Automating Accessibility Tests with Puppeteer

Recently I gave a mini talk at React Vienna about automating WAI-ARIA Authoring Practices tests with Puppeteer.

You can find the recording at the end of the post.

WAI-ARIA Authoring Practices is a guide for understanding how to use WAI-ARIA 1.1 to create an accessible Rich Internet Application. Specifically the site comes with guidelines and examples for common design patterns and widgets like modal dialogs, tabs etc.

A while ago Facebook funded Bocoup to write regression tests for the examples in the WAI-ARIA website, and obviously Bocoup wrote about this project on their blog.

When I read the article I had the idea of creating a similar suite of tests that would be generic enough to be used in any application with very little setup.

This is when I created WAI-ARIA-Practices-Tests – a proof of concept where I wrote tests for modal dialogs using Puppeteer.

A sample test using Jest. Check out examples folder of the the GitHub repo for a readable version of this example: https://git.io/JeiTL

All the examples are available at the GitHub repository.

The purpose of the tests is to validate behavior and provide a baseline set of checks to run in CI. Such a toolset wouldn't replace manual testing and other types of checks like validation of correct document outline, misuse of aria and role attributes etc.

Finally please keep in mind that this idea and library are a proof of concept and would need further thinking and validation.

Recording

Enjoy the recording!