-
Notifications
You must be signed in to change notification settings - Fork 136
pa11y ci Integration
With the pa11y-ci integration, and pa11y-ci-reporter-html layered on top, we can run accessibility checks from the command line.
This gives us the power to check the entire sitemap of a local install to make sure there are no accessibility issues before committing, or to check the accessibility of any other URL and provide an HTML dump of the results.
wd_s now comes with a built in script for accessibility checks:
"accessibility": "pa11y-ci --reporter=pa11y-ci-reporter-html --sitemap $npm_config_url/sitemap.xml",
To utilize this, you'll run the following in your command line:
npm run accessibility --url=https://yoururl.test
The accessibility
script will take the value from the URL flag and pop it in place.
This relies on the /sitemap.xml
file existing at the parent level of the site. In WordPress, this should just happen automatically with default WordPress behavior but you may need to adjust the script for your project if your sitemap lives in another location.
Once the results are finalized, you'll see them in a new top-level directory in the theme: /pa11y-ci-report/
.
In this directory, you'll see a set of HTML files. If you open the index.html
file you'll see a list of all of the pages found in your sitemap with errors, warnings, and notices:
Each page in your sitemap is listed here with only the pages/posts with issues displayed as links to pages which display information for each issue found within the page/post:
Don't worry about committing your test results – the /pa11y-ci-report/
directory has been added to .gitignore
so its contents will be ignored.