Allow HTML source from file system and not just URLs.

[andrewholgate]

HTML Code Sniffer allows for files on file-system to be used as the source HTML.

This is very useful when you need to analyse many HTML files and want to break the process into 2 distinct phases:

1. Download all HTML
2. Analyse HTML files for WCAG compliance.

[whymarrh]

You can, as an example, download a bunch of HTML files, run a HTTP server locally, and test against that site. (There might be something in #10, #16, or #44 that gives you an idea.) Is that what you were thinking of?

e.g.

URL="tom.preston-werner.com"
wget --recursive --accept "*.html" "$URL"
cd "$URL"
python -m SimpleHTTPServer
# In another tab
pa11y http://localhost:8000/2010/08/23/readme-driven-development.html

[andrewholgate]

Nice solution.

Using the PhantomJS HTMLCS_Run.js script that comes with HTML_CodeSniffer, this is possible without the need to load the HTML via an HTTP server:

wget tom.preston-werner.com -P html/
phantomjs node_modules/HTML_CodeSniffer/Contrib/PhantomJS/HTMLCS_Run.js html/index.html WCAG2A

[rowanmanning]

Whymarrh's solution is what I'd go with for now. This feature might make it into pa11y 2.x, but I'm trying to reduce feature work on 1.x while that's in progress. I'll leave open until we have time to consider adding this :) thanks

[rowanmanning]

@andrewholgate I'm not sure about Windows and Linux, but on a Mac you can actually test a file URL with pa11y like this:

pa11y file:///tmp/pa11y.html

Would this be a satisfactory solution? I don't want to add the breaking change of allowing the following, because we're currently adding http:// if a scheme is not provided:

pa11y /tmp/pa11y.html

[andrewholgate]

Thanks, pa11y file:tmp/pa11y.html works on Linux (Ubuntu).

[andrewholgate]

For anyone looking for a single command-line solution (so it can be used as a custom npm script) to load multiple HTML files into pa11y, this is what I have found to work (might need a slight tweek for Mac).

This command reads all of the *.html files from the directory output/ and performs the pa11y WCAG2A analysis on each one:

{
  "scripts": {
    "wcag": "for file in output/*.html; do pa11y --standard WCAG2A file:$file; done"
  }
}

Being an npm script, it can be execute with npm run wcag

[rowanmanning]

Thanks @andrewholgate, I've added a ticket to create an example based on this so that it's easy to find :)