CODEWITHSUNDEEP
javascriptnode.jsautomationpuppeteerplaywright
Volck
Volck

Reputation: 374

Puppeteer and Playwright chrome headful bugs when making a screenshot

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.

Upvotes: 3

Views: 3729

Answers (1)

pavel.feldman
pavel.feldman

Reputation: 264

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!

Upvotes: 4

Related Questions