Skip to main content

Visual Testing with App Percy

Learn how visual testing with App Percy works and why you should choose App Percy

Visual testing is a software testing technique that aims to verify the visual aspects of a user interface (UI). To ensure that no unintended visual regressions or discrepancies occur, you need to compare the visual appearance of an application before and after making changes to the application.

App Percy is an all-in-one visual testing and review platform. We help teams automate their visual QA process to catch visual bugs and gain insights 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.

Use App Percy for visual testing of native mobile applications. Check out the video below to get an overview of visual testing with App Percy:

How it works

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

Step 1: Integrate App Percy into your stack

Integrate the App Percy SDK into your mobile application. It supports various programming languages and testing frameworks, so you can choose the one that suits your project.

Step 2: Run visual tests

Write or modify your existing tests to include App Percy commands to capture screenshots or render snapshots of specific UI components or pages in your application. Set the PERCY_TOKEN environment variable in your CI environment and run the visual tests.

Regardless of how you run your visual tests, App Percy handles all asset discovery, rendering, and visual change detection. When you push changes to your codebase, App Percy captures DOM snapshots, renders screenshots, and compares them to previously generated screenshots to see if any pixels have changed. Screenshots for individual components and pages are grouped into snapshots, and snapshots are grouped into builds to be reviewed.

App Percy build dashboard for mobile application

App Percy dashboard

Step 3: Review and approve visual changes

Review the visual differences using App Percy’s dashboard, approve the changes if they are intended, or mark them as regressions if unintended.

You can integrate App Percy into your continuous integration/continuous deployment (CI/CD) pipeline and source code management. Enabling source code integration helps you transition seamlessly from your pull request to App Percy, where you can review all visual changes with a single click.

Our side-by-side comparison view enables you to easily identify exact changes and detect visual regressions across responsive widths and browsers. Your team receives alerts when changes are requested or when changes are approved and ready to ship!

Visual check status

Benefits of using App Percy for visual testing

  • Efficiency: Improves efficiency by reducing the time and effort required to manually spot visual regressions.
  • Consistency: Promotes consistent user experience by identifying visual discrepancies early in the development process.
  • Collaboration: Improves collaboration between developers, designers, and QA teams by providing a visual representation of changes.
  • Prevent regression: Prevents you from experiencing unintended visual regressions.
  • Integrations: App Percy integrates with popular tools and services like GitHub, GitLab, Bitbucket, and more.

Visual testing with App Percy gives you complete insight and confidence on each and every deployment. You can easily catch visual bugs, review design changes, and be sure that every pixel you deploy to customers is correct, before they even see it.

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked






Thank you for your valuable feedback

Is this page helping you?

Yes
No

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked






Thank you for your valuable feedback!

Talk to an Expert
Download Copy