Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to maximise Screen use in Pupeteer ( non-headless )

I'm testing out puppeteer for chrome browser automation ( previously using selenium but had a few headaches with browser not waiting until page fully loaded ) .

When I launch an instance of puppeteer - then it displays the contents taking up less than half the screen with scroll bars. How can I make it take up a full screen?

const puppeteer = require('puppeteer');  async function test(){     const browser = await puppeteer.launch({         headless: false,       });     const page = await browser.newPage();     await page.goto('http://google.com') }  test() 

The initial page seems to load fine , but as soon as I access a page it makes it scrollable and smaller.

like image 950
Martin Thompson Avatar asked Dec 28 '17 20:12

Martin Thompson


People also ask

How do you maximize a window on a puppeteer?

Chrome arguments are passed to the puppeteer. launch function as the values of the key args , and not rgs . Also, in your Chrome configuration, I suspect that the flags --start-fullscreen and --window-size are contradictory. Finally, you might be interested in the Chrome flag --start-maximized .

How do you set a viewport in puppeteer?

You can pass the --window-size flag as an argument to puppeteer. launch() to change the window size to your desired width and height . Then you can call the Chrome Devtools Protocol method Emulation. clearDeviceMetricsOverride to clear the overridden device metrics (including the default 800 x 600 viewport).


2 Answers

You probably would want to set a certain screen size, which any real browser has:

const puppeteer = require('puppeteer');  (async () => {   const browser = await puppeteer.launch();   const page = await browser.newPage();   await page.setViewport({ width: 1366, height: 768});   await page.goto('https://example.com', {waitUntil: 'networkidle2'});   await page.screenshot({path: 'example.png'});    browser.close(); })(); 
like image 200
Vaviloff Avatar answered Sep 29 '22 11:09

Vaviloff


you can user options in launch

const puppeteer = require('puppeteer');  (async () => {   const browser = await puppeteer.launch({     args:[        '--start-maximized' // you can also use '--start-fullscreen'     ]     });    const page = await browser.newPage();   await page.setViewport({ width: 1366, height: 768});   await page.goto('https://example.com', {waitUntil: 'networkidle2'});   await page.screenshot({path: 'example.png'});    browser.close(); })(); 
like image 35
Akhil Aravind Avatar answered Sep 29 '22 10:09

Akhil Aravind