You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+69Lines changed: 69 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -497,6 +497,75 @@ In this section, we will run the test cases to test the internally hosted websit
497
497
gradle allureServe
498
498
```
499
499
500
+
# Percy
501
+
502
+
[Percy](https://percy.io) provides a visual review platform.
503
+
504
+
## Prerequisites
505
+
506
+
- Sign up with your BrowserStack account, or create a new [BrowserStack account](https://www.browserstack.com/users/sign_up).
507
+
- Create a new Percy project.
508
+
- Go to the Project's Settings page, identify your Percy Token, and export them as environment variables using the following commands.
509
+
510
+
### Installation
511
+
512
+
1. Install the Percy CLI.
513
+
514
+
```shell
515
+
npm install @percy/cli
516
+
```
517
+
518
+
### Export the Percy Token
519
+
520
+
- For \*nix based and Mac machines:
521
+
522
+
```sh
523
+
export PERCY_TOKEN=[your-project-token]
524
+
```
525
+
526
+
- For Windows:
527
+
528
+
```shell
529
+
set PERCY_TOKEN=[your-project-token]
530
+
```
531
+
532
+
## Run your first Visual Test
533
+
534
+
In this section, we will run the test cases to detect the visual differences. We run the test first, then toggle the property that instructs our test to change some CSS.
535
+
536
+
1. Run the test.
537
+
Maven:
538
+
```sh
539
+
npx percy exec -- mvn clean test -P percy
540
+
```
541
+
542
+
Gradle:
543
+
```sh
544
+
npx percy exec -- gradle clean percy
545
+
```
546
+
547
+
2. Set the `changeCSS` property in the `src/test/java/com/browserstack/test/login/LoginVisuaalTest` directory to true.
548
+
549
+
3. Run the test again.
550
+
551
+
4. View your Project in the Percy dashboard and verify the differences.
552
+
553
+
## Run the Ignore Region Test
554
+
555
+
In this section, we will run the test that ignores a specific area of a webpage. In a real-world situation, you can think of dynamic content and advertisements where this use case applies.
556
+
557
+
1. Run the test.
558
+
Maven:
559
+
```sh
560
+
npx percy exec -- mvn clean test -P percy-ignore
561
+
```
562
+
Gradle:
563
+
```sh
564
+
npx percy exec -- gradle clean percy-ignore
565
+
```
566
+
2. View your Project in the Percy dashboard and verify the differences.
567
+
568
+
500
569
## Additional Resources
501
570
502
571
- View your test results on the [BrowserStack Automate dashboard](https://www.browserstack.com/automate)
0 commit comments