Puppeteer 和 Playwright chrome 制作屏幕截图时的严重错误

Question

我目前正在开发一个 node.js 脚本，需要使用 Puppeteer 启动一个 headful chromium 实例，然后每 3 秒截取一个页面，这是我的代码：

const puppeteer = require('puppeteer');

async function init (){
 const browser = await puppeteer.launch({headless: true});
 const page = await browser.newPage();
 await page.goto('https://example.com');
 screenshot(page)
};

async function screenshot(page){

 let buffer = await page.screenshot();
 let imageBuffer = buffer.toString('base64');
 // save imageBuffer to database
 setTimeout(screenshot, 3000, page)
}

我当前的问题是我需要用户仍然能够在浏览器和他的计算机上正常导航，但这不可能，因为：

制作屏幕截图时页面滞后，您可以在以下视频中看到：https://youtu.be/Tl2w-qKckkc
浏览器window在制作屏幕截图时将焦点置于所有windows之上。

我也尝试过使用 Playwright，但是将它与 chromium 一起使用时会出现同样的错误。有人可以帮忙吗

Answer 1

在 Playwright 中，执行以下操作：

// Affects all the platforms.
const page = await browser.newPage({ viewport: null });

// Local fix for those using Apple hardware with Retina displays.
const page = await browser.newPage({ deviceScaleFactor: 2 });

我在 https://github.com/microsoft/playwright/issues/2576 发布了详细回复。请随时跟进并在那里提出问题/请求功能！

Puppeteer 和 Playwright chrome 制作屏幕截图时的严重错误

Puppeteer and Playwright chrome headful bugs when making a screenshot

javascript

node.js

automation

puppeteer

playwright