Introduction to aXe

Matt Isner, Deque Systems

Goals for Today

  • Basics of accessibility debugging
  • Idenitfy bugs with aXe Chrome
  • Unit test with aXe-core
  • Integrated test using aXe-WebdriverJS
  • Install and run aXe-CLI

Accessibility Debugging Basics

  • Test with the keyboard
  • Use aXe browser extensions
  • Expose all UI and test again
  • Check headings and landmark structure

aXe Extension for Chrome

bit.ly/axe-chrome

aXe extension page on the Chrome web store

aXe Extension for Firefox

bit.ly/axe-firefox

aXe extension page on the Firefox addon store

aXe Extension Demo

dequeuniversity.com/demo/mars

Deque University Mars Commuter webpage

aXe-core JavaScript API

github.com/dequelabs/axe-core

aXe-core Github page

Helpful Links

Things you'll need

  • A terminal
  • Node.js and npm
  • Git and a Github account (optional)
  • A page to test

Unit Test Demo

github.com/isner/axe-mocha-unit

aXe-WebdriverJS Utility

github.com/dequelabs/axe-webdriverjs

aXe WebdriverJS Github page

Installing Drivers

www.kenst.com/2015/03/installing-chromedriver-on-mac-osx/

Integration Test Demo

github.com/marcysutton/axe-webdriverjs-demo

aXe-CLI

github.com/dequelabs/axe-cli

aXe CLI Github page

Install and run aXe CLI

						
  $ npm install axe-cli -g
  $ axe https://google.com

Stuck on sudo? Fixing npm permissions

Thank you!