feat: make react-axe return a promise

cypress/integration/index-test.js

@@ -3,6 +3,18 @@ import ReactDOM from 'react-dom'
 
 const axe = require('../../index')
 
+function filterLogs(args, type) {
+  let filtered = [];
+  args.forEach(function(arg, index) {
+    if (arg.length === 2 && arg[1] === type) {
+      filtered = arg[1];
+    } else if (arg.length === 6 && arg[4] === type) {
+      filtered = arg[4];
+    }
+  });
+  return filtered;
+}
+
 describe('React-axe', function () {
 	it('should assert that page content is correct', function () {
 		cy.visit('http://localhost:8080');
@@ -16,9 +28,7 @@ describe('React-axe', function () {
 			cy.spy(win.console, "groupCollapsed");
 			cy.spy(win.console, "groupEnd");
 
-			axe(React, ReactDOM, 0);
-
-			cy.wait(1500)
+			axe(React, ReactDOM, 0)
 			.then(function() {
 				expect(win.console.group).to.be.calledWith('%cNew aXe issues', 'color:red;font-weight:normal;');
 				expect(win.console.groupCollapsed).to.be.calledWith('%c%s: %c%s %s');
@@ -38,12 +48,10 @@ describe('React-axe', function () {
         serviceChooser = node[0];
       });
 
-      axe(React, ReactDOM, 0);
-
-      cy.wait(1500)
+      axe(React, ReactDOM, 0)
       .then(function() {
-        expect(groupCollapsed.args[2][4]).to.equal(colorMessage);
-        expect(groupCollapsed.args[3][1]).to.equal(serviceChooser);
+        expect(filterLogs(groupCollapsed.args, colorMessage)).to.equal(colorMessage);
+        expect(filterLogs(groupCollapsed.args, serviceChooser)).to.equal(serviceChooser);
       });
     });
   });

index.js

@@ -1,4 +1,4 @@
-/* global document, window */
+/* global document, window, Promise */
 var axeCore = require('axe-core');
 var after = require('./after');
 var React = undefined;
@@ -11,8 +11,6 @@ var moderate = 'color:orange;font-weight:bold;';
 var minor = 'color:orange;font-weight:normal;';
 var defaultReset = 'font-color:black;font-weight:normal;';
 
-var timer;
-var timeout;
 var _createElement;
 var components = {};
 var nodes = [];
@@ -94,20 +92,16 @@ function failureSummary(node, key) {
 	}
 }
 
-function checkAndReport(node, timeout) {
-	if (timer) {
-		clearTimeout(timer);
-		timer = undefined;
-	}
+function checkAndReport(node) {
 	nodes.push(node);
-	timer = setTimeout(function () {
+	return new Promise(function(res, rej) {
 		var n = getCommonParent(nodes);
 		if (n.nodeName.toLowerCase() === 'html') {
 			// if the only common parent is the body, then analyze the whole page
 			n = document;
 		}
 		axeCore.run(n, { reporter: 'v2' }, function (error, results) {
-			if (error) { throw error; }
+			if (error) { throw rej(error); }
 			results.violations = results.violations.filter(function (result) {
 				result.nodes = result.nodes.filter(function (node) {
 					var key = node.target.toString() + result.id;
@@ -147,15 +141,16 @@ function checkAndReport(node, timeout) {
 				});
 				console.groupEnd();
 			}
+			res();
 		});
-	}, timeout);
+	});
 }
 
 function checkNode(component) {
 	var node = ReactDOM.findDOMNode(component);
 
 	if (node) {
-		checkAndReport(node, timeout);
+		checkAndReport(node);
 	}
 }
 
@@ -171,10 +166,9 @@ function addComponent(component) {
 	}
 }
 
-var reactAxe = function reactAxe(_React, _ReactDOM, _timeout, conf) {
+var reactAxe = function reactAxe(_React, _ReactDOM, conf) {
 	React = _React;
 	ReactDOM = _ReactDOM;
-	timeout = _timeout;
 
 	if (conf) {
 		axeCore.configure(conf);
@@ -203,7 +197,8 @@ var reactAxe = function reactAxe(_React, _ReactDOM, _timeout, conf) {
 			return reactEl;
 		};
 	}
-	checkAndReport(document.body, timeout);
+
+	return checkAndReport(document.body);
 };
 
 module.exports = reactAxe;