puppeteer: [Bug]: captureBeyondViewport does not respect deviceScaleFactor

Minimal, reproducible example

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({
    headless: 'new',
    executablePath: '/usr/bin/chromium',
    args: ['--no-sandbox'],
  });
  const page = await browser.newPage();
  const url='https://www.scrapingbee.com/webscraping-questions/puppeteer/how-to-take-a-screenshot-with-puppeteer/'
  await page.setViewport({ width: 3840, height: 2160, deviceScaleFactor: 2 });
  await page.goto(url);
  
  try {
    await page.screenshot({ path: `image.jpg` });
  } catch (err) {
    console.log(`Error: ${err.message}`);
  } finally {
    await browser.close();
    console.log(`Screenshot has been captured successfully`);
  }
})();

Error string

no error

Bug behavior

• Flaky
• PDF

Background

Old versions of Puppeteer, particularly from 18.1.0 and up to 19.0.0 produced very good quality of screenshots. Recent versions of Puppeteer, particularly 21.6.0, as well as older version starting from 19.2.0, produced worse quality of screenshots.

I didn’t use bundled version of Chrome, installed it separately. This is the version of the browser outputted from the script:

const browser = await puppeteer.launch({...})
await browser.version(); // HeadlessChrome/119.0.6045.199

Here are the screenshots with exactly the same setup but different Puppeteer versions that shows the difference in image size:

The screenshot taken with 18.1.0 is twice as larget as the one taken with recent versions, as if the deviceScaleFactor=2 is not taken into account.

Here’s the basic Dockerfile that I used:

FROM debian:bookworm-slim

RUN apt update
RUN apt-get install -y nodejs npm
RUN apt-get install -y chromium
RUN apt-get install -y libx11-xcb1 libxcomposite1 libasound2 libatk1.0-0 libatk-bridge2.0-0 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgbm1 libgcc1 libglib2.0-0 libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6

RUN mkdir /tmp/screenshot
WORKDIR /tmp/screenshot
COPY script.js script.js
RUN npm init -y

ENV PUPPETEER_SKIP_DOWNLOAD=true
RUN npm install puppeteer@18.1.0

Expectation

Same quality of screenshots as in 18.1.0

Reality

Screenshots have worse quality on Linux.

Puppeteer configuration file (if used)

No response

Puppeteer version

18.1.0, 21.6.0

Node version

20.3.1

Package manager

npm

Package manager version

9.6.7

Operating system

Linux