Skip to main content

Cypress Accessibility

tip

Cypress Accessibility is a paid add-on. Schedule a demo today and see how easy it is to enhance your accessibility testing while speeding up your development process.

What is Cypress Accessibility?

Cypress Accessibility provides organized, visual, and actionable accessibility reports, based completely on the tests you record to Cypress Cloud, and powered by Axe Core® by Deque Systems. This is the documentation page for that product. To learn about the general topic of accessibility testing using the Cypress App, see our guide on this topic.

Cypress Accessibility generates a sortable, filterable report, to see scores and violation counts by page/component, or a combined rule-based report for the entire run. It also includes a drill-in view with live DOM snapshots highlighting each issue detected.

A graphic showing the Cypress Accessibility dashboard including list of rules, views, and the user interface showing how devtools can be used

How are reports created?

Cypress Cloud generates an accessibility report for each unique state reached during your tests on a given Cypress run. This includes pages visited in end-to-end tests, as well as individual components rendered in component tests, and any states or pages that were encountered as a result of interactions performed during test execution.

All of these page or component states are detected using the same protocol that powers Test Replay, meaning no additional code or setup is needed anywhere in your tests.

These individual accessibility "snapshots" are grouped into page- or component-level reports (called "Views"), and also form the bases of a unified report covering the entire run. This gives you multiple ways to examine your report - by focusing on the most important parts of your application, or by

Reports are generated using the industry-standard open source Axe Core® library created by Deque Systems, with a default configuration focused on the Web Content Accessibility Guidelines (WCAG) 2.1.

Highlights

  • All steps of all user flows tested in Cypress are captured automatically
  • Server-side execution means no disruption to existing test code or practices, and no performance impact from accessibility checks
  • Reports are generated at the page or component level, as well as a combined report showing the outcome of all accessibility rules checked in the run
  • Debuggable full-page DOM snapshots with highlights are provided for every violation
  • Most iframe and Shadow DOM uses cases are supported out-of-the-box
  • The Results API allows you to own how your CI pipeline reacts to the accessibility results of the run to implement a policy
  • "Ignored" elements are isolated and don't affect your score, but can still be reviewed

Note: DEQUE, DEQUELABS, AXE®, and AXE-CORE® are trademarks of Deque Systems, Inc. in the US and other countries. These terms are used throughout our documentation to refer to the accessibility testing library used by Cypress Accessibility.