test(a11yPlugin): add failing tests

Also includes missing Angular map files
angular · Feb 24, 2015 · 4dc1b9a · 4dc1b9a
1 parent 64704e0
commit 4dc1b9a
Show file tree

Hide file tree

Showing 8 changed files with 192 additions and 3 deletions.
diff --git a/plugins/accessibility/index.js b/plugins/accessibility/index.js
@@ -0,0 +1,112 @@
+var q = require('q'),
+    fs = require('fs'),
+    path = require('path'),
+    _ = require('lodash');
+
+/**
+ * You can enable this plugin in your config file:
+ *
+ *    // The Chrome Accessibility Developer Tools are currently
+ *    // the only integration option.
+ *
+ *    exports.config = {
+ *      ...
+ *      plugins: [{
+ *        chromeA11YDevTools: true,
+ *        path: 'node_modules/protractor.plugins/accessiblity'
+ *      }]
+ *    }
+ *
+ */
+
+var AUDIT_FILE = path.join(__dirname, '../../node_modules/accessibility-developer-tools/dist/js/axs_testing.js');
+
+/**
+ * Checks the information returned by the accessibility audit and
+ * displays passed/failed results as console output.
+ *
+ * @param {Object} config The configuration file for the accessibility plugin
+ * @return {q.Promise} A promise which resolves to the results of any passed or
+ *    failed tests
+ * @public
+ */
+function teardown(config) {
+
+  if (config.chromeA11YDevTools) {
+
+    var data = fs.readFileSync(AUDIT_FILE, 'utf-8');
+    data = data + ' return axs.Audit.run();';
+
+    var testOut = {failedCount: 0, specResults: []},
+        elementPromises = [];
+
+    return browser.executeScript_(data, 'a11y developer tool rules').then(function(results) {
+
+      var audit = results.map(function(result) {
+        var DOMElements = result.elements;
+        if (DOMElements !== undefined) {
+
+          DOMElements.forEach(function(elem) {
+            // get elements from WebDriver, add to promises array
+            elementPromises.push(
+              elem.getOuterHtml().then(function(text) {
+                return {
+                  code: result.rule.code,
+                  list: text
+                };
+              })
+            );
+          });
+          result.elementCount = DOMElements.length;
+        }
+        return result;
+      });
+
+      // Wait for element names to be fetched
+      return q.all(elementPromises).then(function(elementFailures) {
+
+        audit.forEach(function(result, index) {
+          if (result.result === 'FAIL') {
+            result.passed = false;
+            testOut.failedCount++;
+
+            var label = result.elementCount === 1 ? ' element ' : ' elements ';
+            result.output = '\n\t\t' + result.elementCount + label + 'failed:';
+
+            // match elements returned via promises
+            // by their failure codes
+            elementFailures.forEach(function(element, index) {
+              if (element.code === result.rule.code) {
+                result.output += '\n\t\t' + elementFailures[index].list;
+              }
+            });
+            result.message = 'warning -- Inaccessible markup';
+          }
+          else {
+            result.passed = true;
+            result.output = null;
+            result.message = null;
+          }
+          result.output += '\n\n\t\t' + result.rule.url;
+
+          testOut.specResults.push({
+            description: result.rule.heading,
+            assertions: [{
+              passed: result.passed,
+              errorMsg: result.output,
+              warningMsg: result.message
+            }],
+            duration: 1
+          });
+        });
+
+        if ((testOut.failedCount > 0) || (testOut.specResults.length > 0)) {
+          return testOut;
+        }
+      });
+    });
+  }
+}
+
+// Export
+exports.teardown = teardown;
diff --git a/scripts/test.js b/scripts/test.js
@@ -112,4 +112,13 @@ executor.addCommandlineTest(
       message: 'warning -- Module "xApp" was created but never loaded.'
     }]);
 
+// Check accessibility plugin
+
+executor.addCommandlineTest(
+    'node lib/cli.js plugins/accessibility/spec/failureConfig.js')
+    .expectExitCode(1)
+    .expectErrors([{
+      message: 'warning -- Inaccessible markup'
+    }]);
+
 executor.execute();
diff --git a/testapp/accessibility/badMarkup.html b/testapp/accessibility/badMarkup.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+
+<html ng-app ng-hint>
+  <head>
+    <meta charset="utf-8">
+    <title>Angular.js Example</title>
+    <script src="../lib/angular_v1.3.13/angular.min.js"></script>
+    <script src="../lib/angular_v1.3.13/angular-aria.min.js"></script>
+    <script>
+      angular.module('xApp', []);
+    </script>
+  </head>
+  <body>
+    First name:<input ng-model="firstName" type="text"/>
+    <br>
+    Last name:<input ng-model="lastName" type="text"/>
+    <br>
+    Hello {{firstName}} {{lastName}}
+    <img src="http://example.com/img.jpg">
+  </body>
+</html>
diff --git a/testapp/accessibility/index.html b/testapp/accessibility/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+
+<html ng-app="xApp">
+  <head>
+    <meta charset="utf-8">
+    <title>Angular.js Example</title>
+    <script src="../../lib/angular_v1.3.13/angular.min.js"></script>
+    <script src="../../lib/angular_v1.3.13/angular-aria.min.js"></script>
+    <script>
+      angular.module('xApp', []);
+    </script>
+  </head>
+  <body>
+    <label for="firstName">First name:</label>
+    <input ng-model="firstName" type="text" id="firstName" />
+    <br>
+    <label for="lastName">Last name:</label>
+    <input ng-model="lastName" type="text" id="lastName" />
+    <br>
+    Hello {{firstName}} {{lastName}}
+    <img src="http://example.com/img.jpg" alt="{{firstName}} {{lastName}}">
+  </body>
+</html>
diff --git a/testapp/index.html b/testapp/index.html
@@ -23,9 +23,9 @@
 
   <div>Angular seed app: v<span app-version></span></div>
 
-  <script src="lib/angular/angular.min.js"></script>
-  <script src="lib/angular/angular-animate.min.js"></script>
-  <script src="lib/angular/angular-route.min.js"></script>
+  <script src="lib/angular_v1.3.13/angular.min.js"></script>
+  <script src="lib/angular_v1.3.13/angular-animate.min.js"></script>
+  <script src="lib/angular_v1.3.13/angular-route.min.js"></script>
 
   <script src="components/app-version.js"></script>
   <script src="async/async.js"></script>

diff --git a/testapp/lib/angular_v1.3.13/angular-animate.min.js.map b/testapp/lib/angular_v1.3.13/angular-animate.min.js.map
diff --git a/testapp/lib/angular_v1.3.13/angular-route.min.js.map b/testapp/lib/angular_v1.3.13/angular-route.min.js.map
diff --git a/testapp/lib/angular_v1.3.13/angular.min.js.map b/testapp/lib/angular_v1.3.13/angular.min.js.map