Visual testing with Happo and Playwright

Elevate your Playwright tests with visual regression testing and accessibility regression testing. Convert time-consuming manual reviews into fast, reliable checks while maintaining visual precision throughout your application.

Visual testing with Happo and Playwright in action

Easy integration

Integrate Happo with Playwright in minutes. Use your existing tests and inject Happo screenshots for key UI states.

View setup instructions

Stable & cross-browser

Happo captures screenshots in real browsers — Chrome, Firefox, Safari, Edge and iOS Safari. We parallize test runs across our large fleet of browsers to give you fast results.

Learn about browsers

Responsive testing

Tell Happo to take screenshots in different viewport sizes. This will ensure your UI looks good no matter what device they are rendered on.

Configure viewport sizes

CI integration

With minimal setup, Happo will run with your Playwright tests in your CI/CD pipeline. We support GitHub, Bitbucket, Azure, CircleCI, and more.

CI integration docs

Less flake

Happo will automatically silence animations, wait for asynchronous assets, fonts, and more. And you can specify a color-delta tolerance for visual changes so that you don't have to worry about minor differences.

Learn how to silence flake
Phil Glass
Monzo

Happo allows us to make changes to components used on hundreds of screens and upgrade core UI dependencies with confidence. It has been a big productivity boost over our previous workflow.

Adam Neary
Airbnb

Happo is a straight up life-saver. How many times did you think your change was contained only to discover that ten other teams started using what you built, and your change breaks three of the ten? Without Happo, you might not know.

Denitsa Kulezich

Happo supports the latest versions of most browsers and emulators. Their speed of image comparison is impressive. They also have GitHub and CI integration and plugins to support Storybook and Cypress directly.

Spot differences with ease

Happo's set of tools make it easy to spot differences between screenshots. When side by side isn't enough, the Diff view will highlight exactly where the change is located, and the swipe view allows you to quickly switch between the before and after.

To reduce noise, you can set a color-delta tolerance for visual changes. Happo will then treat changes below this threshold as noise and ignore them. This is great for image compression noise, anti-aliasing, and other minor differences.

Screenshot of the side by side view
Screenshot of the diff view
Screenshot of the swipe view

Playwright visual regression testing that scales

Playwright is great at validating behavior. Add visual regression testing to catch the UI changes that functional assertions miss—layout shifts, spacing changes, typography regressions, and responsive bugs.

With Happo, you can keep your existing Playwright suite and capture screenshots for the states that matter most. Runs in real browsers and plugs into CI so every pull request includes a visual diff review.

You can also add accessibility regression testing to the same runs—without writing any new tests—to catch new violations before they ship.

FAQ

What is Playwright visual regression testing?

Playwright visual regression testing captures screenshots from Playwright tests and compares them to a baseline to detect unintended UI changes.

Should I use Playwright snapshots or a dedicated visual tool?

Built-in snapshots can work for small suites, but dedicated visual testing is typically more stable and easier to review at scale with better diffing, cross-browser coverage, and CI review workflows.

Does Happo support accessibility testing too?

Yes. Happo includes accessibility regression testing that you can enable alongside your existing screenshot runs—no need to write new tests—so you can catch new accessibility violations alongside visual changes.

How do you reduce flaky screenshots in CI?

Happo silences animations, waits for fonts and assets, and lets you configure tolerances to reduce noise from anti-aliasing and compression.

Can I run visual and accessibility checks on every pull request?

Yes. Happo integrates with CI so each PR gets a visual and accessibility review link showing exactly what changed.

Need help?