@hypnosphi/jest-puppeteer-axe
v1.4.0
Published
Axe API integration with Jest and Puppeteer.
Downloads
2
Maintainers
Readme
Jest Puppeteer Axe
Axe (the Accessibility Engine) API integration with Jest and Puppeteer.
Defines Jest async matcher to check whether a given Puppeteer's page instance passes Axe accessibility tests.
Installation
Install the module
npm install @wordpress/jest-puppeteer-axe --save-dev
Setup
The simplest setup is to use Jest's setupFilesAfterEnv
config option:
"jest": {
"setupFilesAfterEnv": [
"@wordpress/jest-puppeteer-axe"
]
},
Usage
In your Jest test suite add the following code to the test's body:
test( 'checks the test page with Axe', async () => {
// First, run some code which loads the content of the page.
loadTestPage();
await expect( page ).toPassAxeTests();
} );
It is also possible to pass optional Axe API options to perform customized check:
include
- CSS selector(s) to to add the list of elements to include in analysis.exclude
- CSS selector(s) to to add the list of elements to exclude from analysis.disabledRules
- the list of Axe rules to skip from verification.options
- options to be used byaxe.run
. See axe-core API documentation for information on its structure.config
- axe configuration object. See axe-core API documentation for documentation on the object structure.
test( 'checks the test component with Axe excluding some button', async () => {
// First, run some code which loads the content of the page.
loadPageWithTestComponent();
await expect( page ).toPassAxeTests( {
include: '.test-component',
exclude: '.some-button',
disabledRules: [ 'aria-allowed-role' ],
} );
} );