Cross-browser visual testing is available for all Percy customers to effortlessly see visual changes across environments.

With a single click you can enable Firefox and Chrome testing to any project and Percy takes care of the rendering as usual. When cross-browser testing is enabled, each build will show separate snapshots for each browser, highlighting the visual diffs specific to each. The number of diffs for each browser will appear over the browser icon on your build.

Keep in mind that you will occasionally see different visual diff counts for each browser because each renders slightly differently. Catching those browser-specific visual regressions is an advantage of cross-browser testing.

Enabling and disabling browsers

By default, both Firefox and Chrome are enabled for each new project.

Browsers can be enabled or disabled for any individual project at any time. To enable or disable a browser, simply go to Project Settings.

After enabling a browser, a new baseline will be established on the project's subsequent build. This means that the snapshots in the first build for that browser won't have a baseline comparison.

If you disable a browser and choose to re-enable it in the future, we will update the browser to Percy's newest version and the subsequent build will create a new baseline for that browser.

Usage & Pricing

Enabling and disabling browsers will impact your usage, as each browser rendering counts as an individual snapshot. For example, enabling a second browser to a project will double the number of snapshots for all new builds within that project.

How it works

Because Percy stores the original DOM snapshot and page assets, we simply render the same page within different browsers when generating snapshots. This is handled entirely server-side and has no effect on the speed of your CI run since all rendering and diffing takes place in Percy, like normal.

Cross-browser testing works with all existing Percy functionality--see the respective docs for more information about those features: