Automated A11y tests with Playwright & Axe

Accessibility is not a nice-to-have feature, but is already a legal requirement in the public sector. From July 2025, companies will also have to comply with guidelines to ensure accessibility.

To ensure the accessibility of websites and mobile applications, a combination of automated and manual tests is recommended. In this blog post, we present a brief overview of automated A11y tests using the end-to-end testing framework Playwright in combination with Axe.

WHY AXE & PLAYWRIGHT?

The combination of Playwright and Axe offers a powerful solution for automated A11y testing. The open source test automation tool Playwright handles user interactions and page navigation. Playwright supports comprehensive testing on common operating systems, different devices and modern rendering engines, including Chromium, WebKit and Firefox. The integration of the @axe-core/playwright-package enables detailed accessibility checks by using the Axe accessibility test engine.

FLAKINESS-AVOIDING, ROBUST TESTS

Playwright offers robust tests with low flakiness. The auto-wait function automatically ensures that actions such as clicks are only executed when the target element is present and ready for interaction, making artificial timeouts superfluous. In addition, assertions specially designed for dynamic websites are automatically repeated until the required condition is met or a timeout is reached. This makes the tests even more stable and reliable.

PLAYWRIGHT-TOOLING

Playwright offers a variety of useful functions designed to facilitate the creation and analysis of tests:

Codegen generates tests in the desired programming language based on the recording of simulated user interaction
Inspector offers functions such as the extraction of selectors or the examination of pages
Trace Viewer offers a comprehensive investigation of test failures using included screencasts of the test execution, live DOM snapshots...

A11Y-SCANS WITH AXE

By default, Axe currently checks for the Web Content Accessibility Guidelines (WCAG) 2.1 AA standards and additional "best practice" rules that go beyond the requirements of the WCAG. The degree of accessibility can be defined as required by adapting the rules to be tested. The A11y tests can cover entire pages or only specific areas. Separate test cases can be created for this purpose or the accessibility scans can be embedded in existing test cases, enabling seamless integration into the existing workflow.

CONCLUSION

In practical application, accessibility testing with Playwright in combination with Axe proved to be easy to integrate and implement. Axe enables an extremely efficient analysis of those accessibility aspects that can be checked automatically. With regard to existing and upcoming legal requirements and the goal of ensuring accessibility to information for all, the automated testing of WCAG compliance is of great importance. In general, accessibility should not be an afterthought, but an integral part of development.