Visual comparison - smaller screenshot sizes

capture only the locator you want to verify. If you don't want that you can use clip i guess

I would like to validate full page.. but not save PNG, and use format that is lower in size as jpg

Yes, just tell playwright to save a jpg by naming it as such.

@vgagaleski toHaveScreenshot only support png if you want other type you should use (page.screenshot()).toHaveSnapshot() and input the snapshotOption or screenshotOption {type: jpg} I dont really remember

hmmm, let me try that, but I cannot seem to find any toHaveSnapshot method

@vgagaleski my bed it's toMatchSnapshot()

You can try this out, too: https://stackoverflow.com/a/75508670 And then use for instance jpg: https://playwright.dev/docs/api/class-page#page-screenshot-option-type, https://playwright.dev/docs/api/class-page#page-screenshot-option-path And use sufficiently low quality for the jpg: https://playwright.dev/docs/api/class-page#page-screenshot-option-quality

This is great information, thanks a lot, I will give it a try

If you test using multiple browsers, make sure to have baseline JPGs per browser.

I don't know if the JPG encoding comes from the browsers or Playwright, but each browser will return a different JPG.

You can use https://argos-ci.com/ to upload screenshots and avoid commit it in your repository. So you don't care about the size of screenshots and it is easier to maintain.

I will check this out as well, thanks everyone

we were planning to use S3 as storage

Here is our Playwright presentation page: https://argos-ci.com/playwright