playwright icon indicating copy to clipboard operation
playwright copied to clipboard

[Feature] Save screenshots using `webp` format

Open stramel opened this issue 1 year ago • 1 comments

Following up on #13385 with a request for only webp since it is already supported by Puppeteer https://github.com/puppeteer/puppeteer/issues/5348 and by all major browsers now https://caniuse.com/webp

WebP is a modern image format that provides superior lossless and lossy compression for images on the web.

WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller than comparable JPEG images at equivalent SSIM quality index.

https://developers.google.com/speed/webp

stramel avatar May 12 '23 04:05 stramel

Would be great to have this feature. I am currently using sharp to compress the screenshot to WebP: sharp(screenshot).webp() but having it natively would be much better and reduce the execution time (would avoid having to perform a webp compression on a jpg/png image).

guillaume-acard avatar Feb 15 '24 11:02 guillaume-acard

We would really love to be able to take WebP format screenshots in our system, for the reduced file size. For a smaller CPU/memory hit, ideally the WebP could be generated by the browser as the screenshot it taken instead of us having to convert a PNG in application code.

I tried looking into where in the code the formats are applied when screenshotting, and it seems here (via search results)…

Chromium:

https://github.com/microsoft/playwright/blob/62ae71f96a7932d14dda20edd659b3edd156aa6d/packages/playwright-core/src/server/chromium/crPage.ts#L298

Chromium is capable of taking WebP screenshots:

https://chromedevtools.github.io/devtools-protocol/tot/Page/#method-captureScreenshot

So no blocker there.

Webkit:

https://github.com/microsoft/playwright/blob/62ae71f96a7932d14dda20edd659b3edd156aa6d/packages/playwright-core/src/server/webkit/wkPage.ts#L856-L860

Interestingly, the Playwright approach for Webkit is to screenshot a PNG (is that the only format Webkit supports?) and then after (if JPEG is requested in options) convert the format to a JPEG. This means people selecting JPEG thinking they can be more efficient would be unaware it might double? the hardware used to generate their screenshot. If Playwright is already happy with the approach of converting PNG screenshots on the fly to other formats, then there is no limit to doing so for WebP for all the browsers that don't support WebP screenshots natively, and remove the conversion process once they do in the future.

Firefox:

https://github.com/microsoft/playwright/blob/62ae71f96a7932d14dda20edd659b3edd156aa6d/packages/playwright-core/src/server/firefox/ffPage.ts#L438-L443

I couldn't find docs for the Firefox dev tools protocol. It seems that Firefox is not able to take a WebP screenshot, but I'm not sure if this is just a UI limitation or an underlying limitation on how Firefox screenshots under the hood. Chat GPT seems confident Firefox can't screenshot WebP, and this Bugzilla issue doesn't inspire confidence:

https://bugzilla.mozilla.org/show_bug.cgi?id=1742565

WebP support might need to be added to Firefox to avoid Playwright having to do a format conversion after taking the screenshot.

jaydenseric avatar Apr 09 '24 02:04 jaydenseric