Skip to content

Commit 4552548

Browse files
andybalaamrichvdh
andauthored
Update docs about Percy now they run nightly (matrix-org#10442)
* Update docs about Percy now they run nightly * Fix paths Co-authored-by: Richard van der Hoff <[email protected]> --------- Co-authored-by: Richard van der Hoff <[email protected]>
1 parent c225b8e commit 4552548

File tree

1 file changed

+27
-9
lines changed

1 file changed

+27
-9
lines changed

docs/cypress.md

+27-9
Original file line numberDiff line numberDiff line change
@@ -186,12 +186,30 @@ already familiar with Cypress.
186186
This is a small selection - the Cypress best practices guide, linked above, has more good advice, and we
187187
should generally try to adhere to them.
188188

189-
## Percy Visual Testing
190-
191-
We also support visual testing via Percy, this extracts the DOM from Cypress and renders it using custom renderers
192-
for Safari, Firefox, Chrome & Edge, allowing us to spot visual regressions before they become release regressions.
193-
Each `cy.percySnapshot()` call results in 8 screenshots (4 browsers, 2 sizes) this can quickly be exhausted and
194-
so we only run Percy testing on `develop` and PRs which are labelled `X-Needs-Percy`.
195-
196-
To record a snapshot use `cy.percySnapshot()`, you may have to pass `percyCSS` into the 2nd argument to hide certain
197-
elements which contain dynamic/generated data to avoid them cause false positives in the Percy screenshot diffs.
189+
## Screenshot testing with Percy
190+
191+
We also support visual testing via [Percy](https://percy.io). Within many of our
192+
Cypress tests you can see lines calling `cy.percySnapshot()`. This creates a
193+
screenshot and uses Percy to check whether it has changed from the last time
194+
this test was run.
195+
196+
It can help to pass `percyCSS` in as the 2nd argument to `percySnapshot` to hide
197+
elements that vary (e.g. timestamps). See the existing code for examples of
198+
this. (Note: it is also possible for team members to mark certain parts of a
199+
screenshot to be ignored. This is done within the Percy UI.)
200+
201+
Percy screenshots are created using custom renderers based on Safari, Firefox,
202+
Chrome and Edge. Each `percySnapshot` actually creates 8 screenshots (4
203+
browsers, 2 sizes). Since we have a limited budget for Percy screenshots, by
204+
default we only run Percy once per day against the `develop` branch, based on a
205+
nightly build at approximately 04:00 UTC every day. (The schedule is defined in
206+
[element-web.yaml](../.github/workflows/element-web.yaml) and the Percy tests are
207+
enabled/disabled in [cypress.yaml](../.github/workflows/cypress.yaml).)
208+
209+
If your pull request makes visual changes, you are encouraged to request Percy
210+
to run by adding the label `X-Needs-Percy` to the PR. This will help us find any
211+
visual bugs or validate visual changes at the time they are made, instead of
212+
having to figure it out later after the nightly build. If you don't have
213+
permission to add a label, please ask your reviewer to do it. Note: it's best to
214+
add this label when the change is nearly ready, because the screenshots will be
215+
re-created every time you make a change to your PR.

0 commit comments

Comments
 (0)