Percy Overview

Percy is an all-in-one visual testing and review platform.

We help teams automate manual QA to catch visual bugs and gain insight into UI changes on each commit. Our goal is to give you and your team confidence in the visual integrity of your UI every time you deploy.

Benefits of using App Percy:-

  • Increased Test Coverage: Visual testing fills the gap left by functional testing to ensure not only that everything works as intended but looks visually perfect as well.
  • Ensure Pixel-Perfect Perfection: Manually catching visual bugs on many mobile devices is expensive, time-consuming, and ultimately imperfect. Percy helps integrity of your entire frontend with complete confidence.
  • Seamless Integration: Catch visual bugs much earlier in development cycle. You can integrate with your SCM and CI tools so that bugs are caught on each commit.
  • Collaborate with Ease: By integrating App Percy into your development workflow, teams can seamlessly collaborate on visual reviews and approvals.

📘

Supported Platforms

Percy supports visual testing for desktop browsers, real-mobile browsers and native mobile applications. Continue on this page if you want to use Percy for testing your native mobile applications, if you to know about Percy for Websites, visit here

How it works


Percy handles everything from capturing and rendering screenshots, to detecting and notifying your team of visual changes.

Percy Basics

Projects

Before using App Percy, the first thing you need to create is a Project.

Projects are how Percy builds are organised. We recommend that you name and treat your Percy projects as one-to-one with each unique application you’ll be testing. For example, create separate projects for your web app, component library, marketing website, etc. For each project, you can configure browsers, visibility settings, and automatic branch approvals.

Builds

Once you install a Percy SDK and start running tests, Percy will populate builds.

You can click the information icon next to the build number to see additional data such as when it was created, how long it took, what baseline it is comparing it to, how many screenshots were rendered, git information (if available), and more. Percy builds usually run on each commit or each change to a pull request so that you can continuously review visual changes.

Screenshots and Snapshots

A Percy snapshot is a rendering of a web page or component. Snapshots are made up of screenshots that are permutations of pages or components in a specific browser and at a specific width. For example, two pages rendered across two browsers and three widths would result in twelve screenshots but would show up in Percy's UI as two snapshots.

For each snapshot comparison, you will see the baseline on the left and the new screenshot on the right. Visual differences are overlayed on top of the new screenshot.

Approval

In Percy, you can approve individual snapshots with visual changes, snapshot groups, or entire builds. If you have a source code integration set up, approving a build will also update your pull request or commit status to "All visual changes have been approved.”

You can also request changes on snapshots with visual changes or on grouped snapshots. Taking this action will mark the snapshot(s) and the entire build as “Changes requested.”


What's next

Run your first sample build on App Percy. We have easy to use sample projects to get you started quickly :-