cucumber-puppeteer-axe

CucumberPuppeteerAxe

Step definitions to test webpages for accessibility issues with AxeCore

How to use

This setup relies on the package cucumber-puppeteer to work properly.

Checkout this setup to see how you can use this in your project.

If you're using docker then you should checkout puppeteer-cucumber. It is a pre-build docker container for testing with cucumber and puppeteer. This package is also included so you can check for accessibility issues right away!

Available steps

Select tags

Given I use the accessibility standards "wcag2a,wcag2aa"

This statement will set the tags for standards you want to use for the scenario you are running.

Select the standards you want to use. See the axe website for a list of supported tags.

Disable rules

When I disable the accessibility rule "color-contrast,link-name"

Disable accessibility rules for the current scenario

Test the whole page

Then the page should be accessible

Test a section of a page

Then the section "#content" should be accessible

Exclude something when testing the whole page

Then the page excluding "#content img" should be accessible

Exclude something when testing a section

Then the section "#homepage" excluding "img" should be accessible

Output

All output is directly visible in the command line:

If you can't find your elements it is quite easy to find them with the unique selector shown in the output (colored cyan) and add custom styling to them.