AletheiaFact / AletheiaFact/aletheia

Enhancement: Implementation of Visual Regression Testing with Percy

Open
#1,832 0 comments 0 reactions 1 assignee Claimed by @Keikonichi View on GitHub
tech
Dominant language
TypeScript
Stars
55
Forks
20
Avg merge
2d 6h
Merged PRs (30d)
2

Description

### Background Information

To enhance the visual quality of the application and prevent unintended UI regressions, this issue focuses on the implementation of Percy to automatically capture and compare snapshots of the application during Cypress end-to-end (E2E) test execution.

Visual regression tests will ensure that code changes do not introduce unexpected UI modifications, helping to quickly identify inconsistencies.

### Steps to Reproduce

_No response_

### How

- [ ] Configure Percy in the project.
- [ ] Create the percy.yml configuration file to customize snapshot behavior.
- [ ] Integrate Percy with Cypress tests.
- [ ] Add environment variables (PERCY_TOKEN, PERCY_ENABLE) to the project.
- [ ] Update the CI/CD pipeline to execute visual regression tests only when needed.
- [ ] Create specific tests to capture snapshots of relevant pages and components.
- [ ] Document the usage and review process for snapshots in the Percy Dashboard.

### Expected Behavior

- Percy should correctly capture snapshots during Cypress test execution.
- Snapshots should be sent to the Percy Dashboard and stored for future comparisons.
- The CI/CD pipeline should allow executing visual regression tests only when necessary (e.g., stage branch).
- Documentation should be available for the team on how to use and interpret Percy results.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.