From 1a8a589f20b323d62974219662ad2d3ede81648e Mon Sep 17 00:00:00 2001 From: Dylan Barrell Date: Tue, 4 Aug 2015 08:37:45 -0400 Subject: [PATCH] Build: add accessibility testing Fixes #99 --- .travis.yml | 2 ++ demos/typography.html | 2 +- package.json | 5 ++-- tasks/alias.js | 4 ++- tasks/options/axe-webdriver.js | 19 +++++++++++++ tasks/options/connect.js | 50 ++++++++++++++++++---------------- 6 files changed, 55 insertions(+), 27 deletions(-) create mode 100644 tasks/options/axe-webdriver.js diff --git a/.travis.yml b/.travis.yml index f2b84ca..c3fd4d0 100644 --- a/.travis.yml +++ b/.travis.yml @@ -6,6 +6,8 @@ cache: directories: - node_modules before_script: + - "export DISPLAY=:99.0" + - sh -e /etc/init.d/xvfb start - nohup bash -c - npm install -g grunt-cli script: - "grunt" diff --git a/demos/typography.html b/demos/typography.html index 8552857..42d8f0f 100644 --- a/demos/typography.html +++ b/demos/typography.html @@ -1,5 +1,5 @@ - + CSS Chassis - Typography diff --git a/package.json b/package.json index 1a089eb..c18fffc 100644 --- a/package.json +++ b/package.json @@ -37,16 +37,17 @@ }, "dependencies": {}, "devDependencies": { + "axe-grunt-webdriver": "0.0.1", "browser-perf": "1.2.3", "chromedriver": "2.13.0", "commitplease": "2.0.0", "ejs-template": "0.1.0", "grunt": "0.4.5", "grunt-autoprefixer": "2.1.0", - "grunt-contrib-cssmin": "0.10.0", + "grunt-contrib-connect": "0.9.0", "grunt-contrib-csslint": "0.4.0", + "grunt-contrib-cssmin": "0.10.0", "grunt-contrib-jshint": "0.10.0", - "grunt-contrib-connect": "0.9.0", "grunt-contrib-watch": "0.6.1", "grunt-csscomb": "3.0.0", "grunt-git-authors": "2.0.0", diff --git a/tasks/alias.js b/tasks/alias.js index 30a04c6..b167846 100644 --- a/tasks/alias.js +++ b/tasks/alias.js @@ -1,6 +1,8 @@ module.exports = function( grunt ) { grunt.registerTask( "default", [ "test" ] ); -grunt.registerTask( "test", [ "build", "jshint", "jscs", "csslint" ] ); +grunt.registerTask( "accessibility_all", [ "connect:accessibility", "axe-webdriver"]) +grunt.registerTask( "accessibility", [ "connect:accessibility", "axe-webdriver:firefox"]) +grunt.registerTask( "test", [ "build", "jshint", "jscs", "csslint", "accessibility" ] ); grunt.registerTask( "build", [ "variables", "svg", "sass", "csscomb", "cssmin" ] ); grunt.registerTask( "perf", [ "start-selenium-server", diff --git a/tasks/options/axe-webdriver.js b/tasks/options/axe-webdriver.js new file mode 100644 index 0000000..2f71ca8 --- /dev/null +++ b/tasks/options/axe-webdriver.js @@ -0,0 +1,19 @@ +module.exports = function( grunt ) { +grunt.loadNpmTasks("axe-grunt-webdriver"); +return { + firefox: { + options: { + threshold: 0 + }, + urls: ['http://localhost:4200/demos/typography.html'], + dest: 'tmp/gu.json' + }, + chrome: { + options: { + threshold: 0, + browser: 'chrome' + }, + urls: ['http://localhost:4200/demos/typography.html'] + } +}; +}; diff --git a/tasks/options/connect.js b/tasks/options/connect.js index 10731f9..abd1ab5 100644 --- a/tasks/options/connect.js +++ b/tasks/options/connect.js @@ -5,32 +5,36 @@ var template = require( "ejs-template" ), module.exports = { options: { port: 4200, - base: ".", - middleware: [ - template.middleware({ basedir: __dirname }), - function( req, res ) { - var data, i, - url = urlParser.parse( req.url, true ), - query = {}, - parts = url.pathname.split( "/" ), - file = req.url.replace( /^\//, "" ).split( "?" )[ 0 ]; + base: "." + }, + perf: { + options: { + middleware: [ + template.middleware({ basedir: __dirname }), + function( req, res ) { + var data, i, + url = urlParser.parse( req.url, true ), + query = {}, + parts = url.pathname.split( "/" ), + file = req.url.replace( /^\//, "" ).split( "?" )[ 0 ]; - for ( i = 1; i < parts.length; i += 2 ) { - query[ parts[ i ] ] = parts[ i + 1 ]; + for ( i = 1; i < parts.length; i += 2 ) { + query[ parts[ i ] ] = parts[ i + 1 ]; + } + if ( file.split( "." ).length <= 1 ) { + data = componentGenerator.generate( + query.framework, + query.component, + query.count + ); + file = "../../performance/component.html"; + } + res.endTemplate( file, data ); } - if ( file.split( "." ).length <= 1 ) { - data = componentGenerator.generate( - query.framework, - query.component, - query.count - ); - file = "../../performance/component.html"; - } - res.endTemplate( file, data ); - } - ] + ] + } }, - perf: {}, + accessibility: {}, dev: { options: { keepalive: true