Auto viewport resize in headless mode

[jpadilla]

I'm wondering why viewport size is set to 1440x900 by default when in headless mode. Is it not possible to do this in headless mode too?

[schickling]

The default in this case is 800 x 600. We just thought 1440 x 900 is a more sensible default. Open for discussion!

[jpadilla]

@schickling can auto sizing be done using window.innerHeight and window.innerWidth in headless instead of setting a default?

[schickling]

You setting this inside of a .evaluate call? I don't see the advantage of this approach over setting the viewport in the constructor?

[jpadilla]

@schickling I'm wondering if it possible to do full height, when it's an unknown.

[schickling]

You probably first need to find out the height using an .evaluate call and then use the .viewport method.

[jpadilla]

@schickling That's what I saw was being done here but not when isHeadless is true. Tried something like this, but renders a white image.

const screenshot = await chromeless
  .goto('https://www.graph.cool')
  .evaluate(async () => {
    const height = window.innerHeight;
    const width = window.innerWidth;
    await chromeless.viewport(width, height);
  })
  .screenshot()

[jroakes]

What you want here (at least for the mean time) is to:

I think evaluate doesn't pass anything but what is returned to it, so screenshot would get a blank image.

const evalstuff= await chromeless
  .goto('https://www.graph.cool')
  .evaluate(async () => {
    const height = document.body.scrollHeight; //This gets the whole scrolled window height.
    const width = window.innerWidth;  // You probably don't need this.
    return {width:width, height:height}
  })

then you call:

const data = await evalstuff
const screenshot = await chromeless
  .setViewport({deviceScaleFactor: 0, scale: 1, fitWindow: true, width: data.width , height: data.height})
  .screenshot()

This worked for me, at least, putting here for others in the same boat.