Create a project
Learn how to create a Percy project.
Percy is an all-in-one visual testing and review platform that allows you to run visual tests using either the BrowserStack SDK or the Percy SDK. If you choose the BrowserStack SDK, you can integrate visual tests into your automated test scripts. Alternatively, using the Percy SDK enables you to create and manage visual tests directly on the Percy dashboard. Based on your SDK selection, refer to the appropriate section for detailed instructions on creating a project and executing your visual tests.
Create your test script based on the required framework and language. Check if your framework and language are supported using the BrowserStack SDK.
Update your BrowserStack config file
In the browserstack.yml file:
- Set
percy: true. - Set a
projectName.- After you run a test, both an Automate project and a Percy project are created with this name.
- If a Percy project with this name already exists, your screenshots are added to the same project.
- If the name matches an App Percy project, visual tests do not run, and you see an error message in your terminal. Functional tests still run as expected.
- Set
percyCaptureMode: autofor Auto mode, or setpercyCaptureMode: manualfor Manual mode:- There are other supported capture modes in the
percyCaptureMode:autoparameter. The following table lists and describes all the acceptable modes.
- There are other supported capture modes in the
| Percy screenshot capture mode | Description |
|---|---|
auto |
Automatically capture screenshots on common events such as screenshot, click, and sendKeys. |
testcase |
Automatically capture screenshots at the end of each test case. |
click |
Automatically capture screenshots on every click. |
screenshot |
Automatically capture screenshots on every driver.screenshot call. |
manual |
This gives you more control over the screenshots you want captured. When used, you have to add the AppPercySDK.screenshot(driver, name) method at required points in your test script. |
Update your test script
Update your test script to capture screenshots using the BrowserStack Percy SDK in Auto and Manual modes.
-
Auto Mode:
- Percy automatically capture screenshots on common events such as screenshot, click, and sendKeys.
- To manually capture screenshots in addition to
automode, import the BrowserStack Percy SDK and use the appropriate SDK screenshot method at required points in your test script to capture the desired screenshots for your language and framework. Check here screenshot method for specific language and framework.
-
Manual Mode:
- Import the BrowserStack Percy SDK and manually add the Percy screenshot method at required points in your test script to capture the desired screenshots for your language and framework. Check here screenshot method for specific language and framework.
Your script is ready to execute visual tests, and Percy is prepared to receive the build.
Related topic
We highly recommend using our BrowserStack SDK for Percy integration.
Follow these steps to create a project in Percy:
- Sign in to Percy.
-
Click Create new project. The “Create a new project” window appears.
- Select Web as the platform and name your project.
- Link a repository (optional): Add your repository’s source code integration if needed.
-
Choose baseline management:
- Git is recommended for developers involved in feature development.
- Visual Git is recommended for QA / SDET involved in testing & test automation.
-
Choose handling of browser selection:
- Select either Percy or Automate. Note that this setting cannot be changed once the project is created.
- Click Create Project.
Percy is ready to receive your first build.
Percy generates a unique PERCY_TOKEN for every created project. This token identifies the organization and project for uploading snapshots. The token starts with web_xxxxxxxx for Percy projects and auto_xxxxxxxx for Percy Automate projects.
Related topic
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
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!
