Keep accessibility errors in check.
JavaScript HTML Shell

README.md

accesslint.js

Accessibility warnings for dynamic web content. Join the conversation on Slack.

Usage

Include the javascript in your page before </body>.

<script src="https://cdn.accesslint.com/accesslint-1.1.2.js"></script>

Then, run your phantomjs browser tests to get accessibility warning logs, or open your browser and get automatic warnings in the JavaScript console.

Phantomjs tests

With RSpec, Capybara, and Poltergeist:

% bundle exec rspec spec/features

Randomized with seed 35702
<html> element must have a valid lang attribute [object HTMLHtmlElement]
Form elements must have labels [object HTMLInputElement]
.

Finished in 2.18 seconds (files took 1.11 seconds to load)
1 example, 0 failures

Randomized with seed 35702

Browser Console

Firefox JavaScript console with accessibility warnings

How it works

accesslint.js runs assertions from the aXe-core accessibility library wherever you include the script once on page load, and again for each DOM change event.

This feature gives you feedback on new content introduced via AJAX, for example, or updates to a single page app.

Development

Setup

$ bin/setup

Testing

$ gulp

Building

Development

$ gulp build-dev # build and watch for changes

Production

$ gulp build