Puppeteer screenshot works, but not penthouse

[davidwebca]

Penthouse is currently unable to see the full HTML rendered by my Vue app and thus doesn't provide the correct critical css.

The screenshot returned by penthouse is blank which lead me to believe it doesn't wait long enough for my JS to fully initialize. I added "renderWaitTime" and regardless, it doesn't work.

I then tried loading puppeteer manually, the version installed with penthouse, to get a screenshot and see what the browser "sees" and it works properly. I used this code to make the screenshot teset:

import puppeteer from 'puppeteer';
(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  page.setViewport({
    width: 1920,
    height: 1080
  });
  await page.goto('http://mywebsite.com');
  await delay(5000);
  await page.screenshot({path: 'screenshottest.png'});
  await browser.close();
})();

Here's the config I'm passing down to penthouse.

renderWaitTime: 5000,
blockJSRequests: false,
keepLargerMediaQueries: true,
width: 1920,
height: 1080,
screenshots: {
  basePath: 'homepage',
  type: 'jpeg',
  quality: 80
}

[davidwebca]

I found a trail. Penthouse ignores media="print", but the plugin for Craft CMS that I use (craft-plugin-vite) uses the common print to onload="this.media='all'" stylesheet preload method.

So the "print" style gets thrown away before the stylehseet has a change of loading at all. Penthouse probably should wait that the stylesheet has loaded to check its media attribute.

Just adding this detail if anyone stumbles onto this from a craft project:
For now, the craft vite plugin allows passing a 2nd attribute to the craft.vite.script function to prevent the async loading in the twig, so I added an env var to prevent it locally only. {{ craft.vite.script("src/main.js", getenv('CRAFT_VITE_ASYNC_CSS') ? true : false) }}

[davidwebca]

Well well. I use rollup-plugin-critical which uses critical which uses penthouse and critical is wrongly passing down the HTML to compare instead of letting penthouse doing its job. :| I apologize for that. Probably had nothing to do with the loading swap I mentionned earlier -_-