Skip to main content

Integrate Percy with Selenium and Java

Learn how to integrate Selenium with Java automated tests and Percy to catch visual differences in your website.

Percy integrates with your tests using both Percy and BrowserStack SDK. To establish this integration, choose the appropriate SDK and refer to the following section accordingly:

Prerequisites

Before you start, ensure that you have a BrowserStack Automate account using the BrowserStack SDK to integrate your test script.

To integrate your Java based test suite with Percy using the BrowserStack SDK, follow these steps:

Set BrowserStack credentials

Save your BrowserStack credentials as environment variables. It simplifies running your test suite from your local or CI environment. You can export the environment variables for the Username and Access Key of your BrowserStack account or you can set it in the config file.

Copy icon Copy snippet
Copy icon Copy snippet
Copy icon Copy snippet

Install BrowserStack SDK using Maven Archetype

Maven Archetype provides a template to quickly configure your project. Copy & run the following command on your terminal/command prompt to add browserstack-java-sdk dependency in your pom.xml and browserstack.yml file in your project.

Copy icon Copy snippet
Copy icon Copy snippet

Update your BrowserStack config file

In the browserstack.yml file:

  1. Set percy: true.

  2. Set a projectName.
    After you run a test, an Automate project and a Percy project are created with the project name you set here.
    If a Percy project by the name you set in the browserstack.yml file already exists, your screenshots are added to the same project. However, if the name matches an App Percy project, your visual tests do not run, and you see an error message in your terminal. Your functional tests still run as expected.

  3. Set percyCaptureMode: manual.

Below sample browserstack.yml file shows how to set the percy, the projectName, and the percyCaptureMode parameters.

Copy icon Copy snippet

Manually add Percy screenshot method to update test script

To manually capture screenshots, implement the following steps in your test script:

  1. Import the BrowserStack Percy SDK in your test script.
  2. Add the PercySDK.screenshot(driver, name) method at required points in your test script to get the screenshots you want.

Here’s an example:

Java
Copy icon Copy snippet

Run your test script

Congratulations!

You have successfully integrated Percy with BrowserStack SDK and created your first build. To see the build with snapshots of your application, visit your project in Percy.

When you run another build with visual changes to your application, Percy takes new screenshots. You can then see the comparisons between the two runs on the new build. You can access the Percy dashboard directly from the Automate dashboard.

We recommend using our BrowserStack SDK for Percy integration.

Integrate Percy with your test suite to run visual tests. To do that, follow these steps:

Create a Percy project
Sign in to Percy. In Percy, create a project of the type, Web, and then name the project. After the project is created, Percy generates a token. Make a note of it. You have to use it set your environment variable in the next step.

For details on creating a project, see Create a Percy project.

Set the project token as an environment variable
Run the given command to set PERCY_TOKEN as an environment variable:

Copy icon Copy snippet
Copy icon Copy snippet
Copy icon Copy snippet

To learn about environment variables in Percy, see Percy environment variables.

Install Percy dependencies
Install the following components to establish the integration environment for your test suite.

Install Percy CLI by running the following command:

Copy icon Copy snippet

If you’re using Maven, add percy-java-selenium to your project dependencies:

Copy icon Copy snippet

Update your test script
Import the Percy library to use the method and attributes required to take screenshots.

In the following code, the percy.snapshot method is used:

Copy icon Copy snippet

We are passing the required argument which is name, and are using an <https://example.com> web application. Java example as the name of the snapshot within the percy.snapshot method.

The snapshot method arguments are:

Copy icon Copy snippet


To learn more, visit Percy snapshot.

Run Percy
Run your tests using percy exec command as shown below:

If you are unable to use the percy:exec command or prefer to run your tests using IDE run options, you can use the percy exec:start and percy exec:stop commands. To learn more, visit Run Percy.

Copy icon Copy snippet

This command starts Percy, create a new Percy build, takes snapshots and uploads them to your project, and stops Percy:

Copy icon Copy snippet

Congratulations!

You have successfully created your first build on Percy. To see the build with snapshots of your application, visit your project in Percy.

When you run another build with visual changes to your application, Percy takes new snapshots. You can then see the comparisons between the two runs on the new build.

Advanced topics

Percy Snapshot command

In the preceding steps, we used the Percy Snapshot command for capturing snapshots. Percy provides various configurations to use with Percy snapshot command. To learn more visit, Percy snapshot command.

Base build selection

By default, Percy uses the previous build for comparison however, you always have the option to configure the base build for comparison as needed. To learn more, visit base build selection logic.

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