Skip to content

Commit 213c1f6

Browse files
authored
update AQ content (#6299)
1 parent a324dd5 commit 213c1f6

File tree

9 files changed

+239
-4
lines changed

9 files changed

+239
-4
lines changed

docs/accessibility/changelog.mdx

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,18 @@ sidebar_position: 200
99

1010
# Changelog
1111

12+
## Week of 10/13/2025
13+
14+
- Individual rules, or set of rules, can now be ignored for specific elements using [a `data-a11y-ignore` attribute](/accessibility/configuration/ignoring-rules-per-element).
15+
16+
## Week of 10/6/2025
17+
18+
- False positives in ["Interactive elements should be semantically correct"](/accessibility/core-concepts/cypress-rules#Interactive-elements-should-be-semantically-correct) related to elements using the `contenteditable` attribute have been addressed.
19+
20+
## Week of 7/7/2025
21+
22+
- A new custom accessibility rule, ["Interactive elements should be semantically correct"](/accessibility/core-concepts/cypress-rules#Interactive-elements-should-be-semantically-correct), is now available. This rule is based on the interactions that take place during your test execution, and helps detect accessibility issues that are not a part of typical DOM-based accessibility scans.
23+
1224
## Week of 7/7/2025
1325

1426
- A new custom accessibility rule, ["Interactive elements should be semantically correct"](/accessibility/core-concepts/cypress-rules#Interactive-elements-should-be-semantically-correct), is now available. This rule is based on the interactions that take place during your test execution, and helps detect accessibility issues that are not a part of typical DOM-based accessibility scans.

docs/accessibility/configuration/axe-core-configuration.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
title: 'Axe Core® configuration | Cypress Accessibility'
3-
description: 'Configuration for Axe-Core® rules can be configured.'
3+
description: 'Configuration for Axe-Core® rules.'
44
sidebar_label: 'Axe Core® configuration'
55
---
66

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
---
2+
title: 'Ignoring rules for specific elements | Cypress Accessibility'
3+
description: 'Elements can avoid failing certain rules using a data-a11y-ignore attribute'
4+
sidebar_label: 'Ignore rules for specific elements'
5+
sidebar_position: 70
6+
---
7+
8+
<ProductHeading product="accessibility" />
9+
10+
# Ignore rules for specific elements
11+
12+
Cypress Accessibility configuration allows you to exclude [elements](/accessibility/configuration/elementfilters) or whole [pages](/accessibility/configuration/viewfilters) from the accessibility report, but sometimes there are situations where you may want to keep an element in your accessibility report, but ignore some accessibility rules for that element.
13+
14+
This can be accomplished in your application code using the `data-a11y-ignore` attribute, like this:
15+
16+
```html
17+
<button data-a11y-ignore="color-contrast">Log In</button>
18+
```
19+
20+
This would mean that if a color contrast violation was detected on this button, it would be tracked and flagged as an ignored violation in your accessibility report, instead of being listed as a failure. Any other violations detected would be flagged as normal failures.
21+
22+
## Ignore multiple rules
23+
24+
Multiple rules can be ignored by using commas to separate a list of rule IDs:
25+
26+
```html
27+
<button data-a11y-ignore="color-contrast,button-name">Log In</button>
28+
```
29+
30+
## Where to find rule IDs
31+
32+
The "Learn more" link in your accessibility reports will display the ID for each rule. They can also be looked up in the [Axe-Core® rule documentation](https://github.com/dequelabs/axe-core/blob/develop/doc/rule-descriptions.md) directly.
33+
34+
## When to use this
35+
36+
### Handle false positives
37+
38+
This is most useful when there is a known false positive failure for a specific rule and you want to remove it from your report without losing all other insights about an element.
39+
40+
The `data-a11y-ignore` attribute pattern is used in some libraries like Adobe's React Spectrum, so those UI elements automatically have the defined rules ignored correctly in Cypress Accessibility.
41+
42+
### Avoid blocking a code change
43+
44+
A secondary use case is to avoid certain known issues becoming blocking for a pull request. `data-a11y-ignore` allows for a minimal scope of what to ignore, and creates a paper trail through version control which means these changes are obvious at code review, and comments can be added nearby to explain the reason for ignoring the rule.

docs/accessibility/core-concepts/run-level-reports.mdx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,9 @@ The count of elements in a View categorized as:
5555

5656
- **Failed:** Elements violating at least one rule. These affect your accessibility score.
5757
- **Inconclusive:** Elements had at least one check marked "incomplete" by Axe Core® during the run. These represent checks that couldn't be completed for technical reasons, or items that need manual review to confirm if there is an accessibility issue. These do not affect your accessibility score.
58-
- **Ignored:** Elements with failed or incomplete checks that were excluded via CSS selectors in your [configuration](/accessibility/configuration/elementfilters) but still processed. They do not affect your accessibility score.
58+
- **Ignored:** Elements with failed or incomplete checks that were excluded via CSS selectors in your [configuration](/accessibility/configuration/elementfilters), or through the `data-a11y-ignore` attribute. These elements are still processed in order to support your understanding of what is ignored. They do not affect your accessibility score.
59+
60+
Each of these numbers can be clicked to navigate to a report filtered to just that set of findings.
5961

6062
### Failed rules
6163

docs/accessibility/results-api.mdx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -493,4 +493,9 @@ steps:
493493
```
494494
</TabItem>
495495
</Tabs>
496+
497+
## Required CI environment variables
498+
499+
<ResultsApiEnvVars />
500+
496501
```
Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
The `@cypress/extract-cloud-results` helper cross-references some environment variables from where it is executed with ones that were present when a Cypress Cloud run was recorded. This allows for automatically detecting the correct Cloud run when the Results API is invoked from the same CI context as a given run (as is the case in the above examples).
2+
3+
For more complex setups, or for local iteration on your Results API handler code, it can be useful to know what variables Cypress is looking for so that you can make sure they are passed through where they are needed.
4+
5+
Likewise, if you want to use the Results API locally to pull the data for a specific run (within the last 7 days), you can set these variables locally to match what was present in CI.
6+
7+
## Local development example
8+
9+
If you executed a run in GitHub Actions and it was recorded to Cypress Cloud, you would set these 4 environment variables to replicate the context of that run locally and execute your local handler script. This is a great way to iterate on your script and verify everything is working as expected, without having to integrate anything in CI. It's also useful for debugging.
10+
11+
```
12+
CYPRESS_PROJECT_ID=AAA
13+
CYPRESS_RECORD_KEY=BBB
14+
GITHUB_ACTIONS=true
15+
GITHUB_RUN_ID=111
16+
GITHUB_RUN_ATTEMPT=0
17+
node verifyAccessibilityResults.js
18+
```
19+
20+
The Results API will then look for the Cypress Cloud run that matches this run ID. If there is more than one Cypress Cloud run found for that GitHub Actions Run, you can pass run tags to narrow down to one run's report.
21+
22+
## Supported CI Provider Overview
23+
24+
Each CI provider has a unique combination of components, patterns, and environment variables that must be interpreted by this module.
25+
26+
### GitHub Actions
27+
28+
Reference: https://docs.github.com/en/actions/learn-github-actions/understanding-github-actions
29+
30+
#### Essential environment variables
31+
32+
- `GITHUB_ACTIONS` - Presence identifies the environment as a GitHub Actions environment.
33+
- `GITHUB_RUN_ID` - Value uniquely identifies a GitHub Actions workflow instance. Value does not change as jobs in the workflow are re-executed.
34+
- `GITHUB_RUN_ATTEMPT` - Value identifies the workflow instance's attempt index. Value is incremented each time jobs are re-executed.
35+
36+
Full environment variable reference: https://docs.github.com/en/actions/learn-github-actions/variables#default-environment-variables
37+
38+
#### Prerequisites
39+
40+
1. The run to validate and this module's validation script are being executed within the same workflow.
41+
2. The module script is always executed _after_ the run to validate has been created. This can be achieved by either:
42+
1. Executing the module script in a separate job that is dependent upon the job that records the run (using the `needs: [job-name]` option in the config), or
43+
2. Executing the module script in serial with the cypress recording in the same job.
44+
45+
### GitLab Pipelines
46+
47+
Reference: https://docs.gitlab.com/ee/ci/pipelines/
48+
49+
#### Essential environment variables
50+
51+
- `GITLAB_CI` - Presence identifies the environment as a GitLab CI environment
52+
- `CI_PIPELINE_ID` - Value uniquely identifies a GitLab pipeline workflow. This value does not change as jobs in the pipeline are retried.
53+
- `CI_JOB_NAME` - Value uniquely identifies a single job name within a pipeline. Ex. `run-e2e`
54+
- `CI_JOB_ID` - Value uniquely identifies an execution instance of a job. This value will change each time a job is executed/re-executed.
55+
56+
Full environment variable reference: https://docs.gitlab.com/ee/ci/variables/predefined_variables.html
57+
58+
#### Prerequisites
59+
60+
1. The run to validate and this module's validation script are being executed within the same pipeline.
61+
2. The module script is always executed _after_ the run to validate has been created. This can be achieved by:
62+
1. Executing the module script in a separate job that is dependent upon the job that records the run (using the `needs: [job-name]` option in the config), or
63+
2. Executing the module script in a separate job that is executed in a lower stage than the job that records the Cypress run, or
64+
3. Executing the module script in serial with the cypress recording in the same job.
65+
66+
### Jenkins
67+
68+
Reference: https://www.jenkins.io/doc/
69+
70+
Jenkins is heavily customizable through the usage of plugins, which limits the amount of assumptions we can make about available environment variables and overall behavior.
71+
72+
We have implemented Jenkins support within this module using the broadest set of available default values. For the purposes of this documentation, though, we will discuss terms related to Jenkins Pipeline support: https://www.jenkins.io/doc/book/pipeline/getting-started/
73+
74+
#### Essential terms
75+
76+
#### Essential environment variables
77+
78+
- `JENKINS_HOME` - Presence identifies the environment as a Jenkins environment
79+
- `BUILD_URL` - Value uniquely identifies a Jenkins job execution, including name and id characteristics.
80+
81+
Full environment variable reference: https://www.jenkins.io/doc/book/pipeline/jenkinsfile/#using-environment-variables
82+
83+
#### Prerequisites
84+
85+
1. The run to validate and this module's validation script are being executed within the same job.
86+
2. The module script is always executed _after_ the run to validate has been created. This can be achieved by executing the module script in serial with the cypress recording in the same job.
87+
88+
### Azure
89+
90+
Reference: https://learn.microsoft.com/en-us/azure/devops/pipelines/get-started/key-pipelines-concepts?view=azure-devops
91+
92+
> Note: Cypress v13.13.1 is the earliest Cypress release that records the environment variables necessary for this module to identify runs in an Azure environment. Previous Cypress versions are not supported in Azure pipelines.
93+
94+
#### Essential environment variables
95+
96+
- `TF_BUILD` and `AZURE_HTTP_USER_AGENT` - Combined presence identifies the environment as a Azure pipeline environment.
97+
- `SYSTEM_PLANID` - Value uniquely identifies a pipeline run. Value does not change as jobs within the pipeline are retried from failure.
98+
- `SYSTEM_JOBID` - Value uniquely identifies a job execution. Value changes each time a job is retried from failure, in conjunction with the `SYSTEM_JOBATTEMPT` being incremented.
99+
- `SYSTEM_JOBATTEMPT` - Value identifies the pipelines shared attempt index. Value is incremented when jobs are retried from failure.
100+
101+
Full environment variable reference: https://learn.microsoft.com/en-us/azure/devops/pipelines/build/variables?view=azure-devops&tabs=yaml
102+
103+
#### Prerequisites
104+
105+
1. The run to validate and this module's validation script are being executed within the same pipeline run (i.e. they share a `SYSTEM_PLANID` value).
106+
2. The module script is always executed _after_ the run to validate has been created. This can be achieved by either:
107+
1. Executing the module script in a separate job that is dependent upon the job that records the run (using the `dependsOn: [job-name]` option in the config), or
108+
2. Executing the module script in serial with the Cypress recording in the same job.
109+
110+
### CircleCI
111+
112+
Reference: https://circleci.com/docs/about-circleci/
113+
114+
> Note: Cypress v13.13.1 is the earliest Cypress release that records the environment variables necessary for this module to identify runs in an CircleCI environment. Previous Cypress versions are not supported in CircleCI pipelines.
115+
116+
#### Essential environment variables
117+
118+
- `CIRCLECI` - Presence identifies the environment as a CircleCI environment
119+
- `CIRCLE_PIPELINE_ID` - Value uniquely identifies a CircleCI pipeline, created on push or manually triggered through the UI. This value does not change as workflows within the pipeline are re-executed.
120+
- `CIRCLE_WORKFLOW_ID` - Value uniquely identifies an instance of a workflow's execution within a pipeline. This value will be updated upon each workflow execution; in other words, retrying a workflow from failure from the Circle UI will create a new workflow with a new `CIRCLE_WORKFLOW_ID` value available to the jobs executed within it.
121+
- `CIRCLE_WORKFLOW_JOB_ID` - Value uniquely identifies an execution instance of a named job within a workflow instance.
122+
123+
Full environment variable reference: https://docs.gitlab.com/ee/ci/variables/predefined_variables.html
124+
125+
#### Prerequisites
126+
127+
1. The run to validate and this module's validation script are being executed within the same pipeline **and** workflow.
128+
2. The module script is always executed _after_ the run to validate has been created. This can be achieved by:
129+
1. Executing the module script in a separate job that is dependent upon the job that records the run (using the `requires: [job-name]` option in the config), or
130+
2. Executing the module script in serial with the cypress recording in the same job.
131+
132+
### AWS CodeBuild
133+
134+
Reference: https://docs.aws.amazon.com/codebuild/
135+
136+
#### Essential environment variables
137+
138+
- `CODEBUILD_BUILD_ID` - Presence identifies the environment as an AWS CodeBuild environment. Value uniquely identifies a build.
139+
140+
Full environment variable reference: https://docs.aws.amazon.com/codebuild/latest/userguide/build-env-ref-env-vars.html
141+
142+
Prerequisites
143+
144+
1. The run to validate and this module's validation script are being executed within the same build.
145+
2. The module script is always executed _after_ the run to validate has been created. This can be achieved by executing the module script in serial with the cypress recording in the same build.
146+
147+
### Drone
148+
149+
Reference: https://docs.drone.io/pipeline/overview/
150+
151+
#### Essential environment variables
152+
153+
- `DRONE` - Presence identifies the environment as an Drone environment.
154+
- `DRONE_BUILD_NUMBER` - Value uniquely identifies a Drone build.
155+
156+
Full environment variable reference: https://docs.drone.io/pipeline/environment/reference/
157+
158+
#### Prerequisites
159+
160+
1. The run to validate and this module's validation script are being executed within the same build.
161+
2. The module script is always executed _after_ the run to validate has been created. This can be achieved by executing the module script in serial with the cypress recording in the same build.
162+
163+
In order to iterate on your verification script and see everything working without putting code into your CI environment, it can be useful to simulate the CI context for a specific Cypress run locally. This can save a lot of time when getting started.

docs/partials/_viewfilters.mdx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
By default, every URL visited within a test run is included in reports. However, not all URLs are relevant for your analysis. The `viewFilters` property allows you to specify patterns for URLs that should be excluded, ensuring your reports focus on meaningful parts of your application.
22

3-
In UI Coverage, excluding a URL excludes all application snapshots from that URL from the reports, and **also** excludes all links pointing to that URL from being counted towards coverage scores.
4-
53
## Why use view filters?
64

75
- **Exclude Third-Party URLs**: If your application integrates with third-party services, you might want to exclude their URLs from analysis.
@@ -17,6 +15,11 @@ Nesting this property under an `accessibility` or `uiCoverage` key is
1715
supported, if you need to split them up.
1816
:::
1917

18+
## Note on product-specific behavior
19+
20+
- In UI Coverage, excluding a URL excludes all application snapshots from that URL from the reports, and **also** excludes all links pointing to that URL from being counted towards coverage scores.
21+
- In Cypress Accessibility, excluding a URL excludes all application snapshots from that URL from the reports, but has no other effects.
22+
2023
## Syntax
2124

2225
```json

docs/ui-coverage/results-api.mdx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -388,4 +388,8 @@ steps:
388388
```
389389
</TabItem>
390390
</Tabs>
391+
392+
## Required CI environment variables
393+
394+
<ResultsApiEnvVars />
391395
```

src/theme/MDXComponents.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ import CloudFreePlan from "@site/docs/partials/_cloud_free_plan.mdx";
4444
import CiProviderCloudSteps from "@site/docs/partials/_ci_provider_cloud_steps.mdx";
4545
import UrlAllowList from "@site/docs/partials/_url_allowlist.mdx";
4646
import UICovPremiumNote from "@site/docs/partials/_ui-coverage-premium-note.mdx";
47+
import ResultsApiEnvVars from "@site/docs/partials/_results-api-env-vars.mdx";
4748

4849
// Font Awesome
4950
import { library } from '@fortawesome/fontawesome-svg-core'
@@ -208,4 +209,5 @@ export default {
208209
CiProviderCloudSteps,
209210
UrlAllowList,
210211
UICovPremiumNote,
212+
ResultsApiEnvVars,
211213
}

0 commit comments

Comments
 (0)