Automated Accessibility Testing for React Applications

Introduction to accessibility audits you can add to your automated test suite

MP4 | Video: h264, 1280×720 | Audio: AAC, 44.1 KHz, 2 Ch
Genre: eLearning | Language: English + srt | Duration: 25 lectures (1h 38m) | Size: 748.9 MB

What you’ll learn
Linting static code using eslint-plugin-jsx-a11y
Testing rendered code using Jest, jest-axe and testing-library
Visual audits using Cypress and cypress-audit/lighthouse
Limitations of automated testing for accessibility

Requirements
Familiarity with JavaScript, HTML and CSS
Basic experience with React and automated testing

Description
You probably want make sure your web application is usable by as many people as possible. Maybe you have manual accessibility testers, and you want to make sure they don’t have to spend time chasing down issues that can be caught by a computer. Or perhaps you are just learning about accessibility and want to know how to incorporate audits into your automated tests. Read on to learn how this course can help!

Three levels of accessibility testing

This course teaches three levels of accessibility testing, to catch as many errors as possible using automated tests:

Linting static code using eslint-plugin-jsx-a11y

Testing rendered code using Jest, jest-axe and testing-library

Visual audits using Cypress and cypress-audit/lighthouse

Make the most of the testing tools

The course also teaches

creating custom rules for jest-axe, to tailor your audits to your company’s standards

generating an HTML report for cypress-audit/lighthouse to help isolate errors

Lists of tools for other technologies

While this course focuses on React applications, much of the material can be applied to other technologies (such as Angular or Vue). Additionally, each section lists alternative tools that might better fit your tech stack.

Who this course is for
React developers wishing to add accessibility audits to their automated tests