Puppeteer and Playwright chrome headful bugs when making a screenshot

user_11611102 0
Viewed 2466

I am currently developing a node.js script that needs to launch a headful chromium instance using Puppeteer and then make a screenshot of a page every 3 seconds, this is my code : 

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)
}

My current issue is that I need the user to still be able to normally navigate on the browser and on his computer but this impossible as :

  1. The page lags when making the screenshot as you can see on the following video : https://youtu.be/Tl2w-qKckkc
  2. The browser window focuses and goes on top of all the windows when making the screenshot.

I also tried using Playwright but the same bug occurs when using it with chromium. Can someone please help.

puppeteer playwright node.js automation javascript
1 Answers

In Playwright, do the following:

// 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 });

I posted a detailed reply at https://github.com/microsoft/playwright/issues/2576. Please feel free to follow up and ask questions / request features there!

user_16150100
Related