feat(collect-results-from-frames): add frameWaitTime option (#661)

Closes #660
dequelabs · Jan 18, 2018 · 8016ad1 · 8016ad1
1 parent 595f209
commit 8016ad1
Show file tree

Hide file tree

Showing 6 changed files with 118 additions and 4 deletions.
diff --git a/doc/API.md b/doc/API.md
@@ -337,6 +337,7 @@ Additionally, there are a number or properties that allow configuration of diffe
 | `iframes`       | `true`  | Tell axe to run inside iframes
 | `elementRef`    | `false` | Return element references in addition to the target
 | `restoreScroll` | `false` | Scrolls elements back to before axe started
+| `frameWaitTime` | `60000` | How long (in milliseconds) axe waits for a response from embedded frames before timing out
 
 
 ###### Options Parameter Examples

diff --git a/lib/core/utils/collect-results-from-frames.js b/lib/core/utils/collect-results-from-frames.js
@@ -39,10 +39,12 @@ axe.utils.sendCommandToFrame = function(node, parameters, resolve, reject) {
 	axe.utils.respondable(win, 'axe.ping', null, undefined, function() {
 		clearTimeout(timeout);
 
-		// Give aXe 30s to respond to 'axe.start'
+		// Give aXe 60s (or user-supplied value) to respond to 'axe.start'
+		var frameWaitTime = (parameters.options && parameters.options.frameWaitTime) || 60000;
+
 		timeout = setTimeout(function() {
 			reject(err('Axe in frame timed out', node));
-		}, 30000);
+		}, frameWaitTime);
 
 		// send 'axe.start' and send the callback if it responded
 		axe.utils.respondable(win, 'axe.start', parameters, undefined, function(data) {

diff --git a/test/core/utils/collect-results-from-frames.js b/test/core/utils/collect-results-from-frames.js
@@ -9,10 +9,10 @@ describe('axe.utils.collectResultsFromFrames', function () {
 		fixture.innerHTML = '';
 	});
 
-  it('should timeout after 30s', function (done) {
+  it('should timeout after 60s', function (done) {
     var orig = window.setTimeout;
     window.setTimeout = function (fn, to) {
-      if (to === 30000) {
+      if (to === 60000) {
         assert.ok('timeout set');
         fn();
       } else { // ping timeout
@@ -37,6 +37,37 @@ describe('axe.utils.collectResultsFromFrames', function () {
     frame.src = '../mock/frames/results-timeout.html';
     fixture.appendChild(frame);
 
+  });
+
+  it('should override the timeout with `options.frameWaitTime`, if provided', function (done) {
+    var orig = window.setTimeout;
+    window.setTimeout = function (fn, to) {
+      if (to === 90000) {
+        assert.ok('timeout set');
+        fn();
+      } else { // ping timeout
+        return orig(fn, to);
+      }
+      return 'cats';
+    };
+
+    var frame = document.createElement('iframe');
+    frame.addEventListener('load', function () {
+      var context = new Context(document);
+      var params = { frameWaitTime: 90000 };
+      axe.utils.collectResultsFromFrames(context, params, 'stuff', 'morestuff', noop,
+      function (err) {
+        assert.instanceOf(err, Error);
+        assert.equal(err.message.split(/: /)[0], 'Axe in frame timed out');
+        window.setTimeout = orig;
+        done();
+      });
+    });
+
+    frame.id = 'level0';
+    frame.src = '../mock/frames/results-timeout.html';
+    fixture.appendChild(frame);
+
   });
 
 	it('should not throw given a recursive iframe', function (done) {

diff --git a/test/integration/full/frame-wait-time/frame-wait-time.html b/test/integration/full/frame-wait-time/frame-wait-time.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<title>frame-wait-time test</title>
+	<meta charset="utf8">
+	<link rel="stylesheet" type="text/css" href="/node_modules/mocha/mocha.css" />
+	<script src="/node_modules/mocha/mocha.js"></script>
+	<script src="/node_modules/chai/chai.js"></script>
+	<script src="/axe.js"></script>
+	<script>
+		mocha.setup({
+			timeout: 10000,
+			ui: 'bdd'
+		});
+		var assert = chai.assert;
+	</script>
+</head>
+<body>
+  <main>
+  	<iframe id="frame" title="frame-wait-time test frame" src="frames/frame.html"></iframe>
+  </main>
+	<div id="mocha"></div>
+	<script src="frame-wait-time.js"></script>
+	<script src="/test/integration/adapter.js"></script>
+</body>
+</html>
diff --git a/test/integration/full/frame-wait-time/frame-wait-time.js b/test/integration/full/frame-wait-time/frame-wait-time.js
@@ -0,0 +1,43 @@
+
+describe('frame-wait-time option', function () {
+  'use strict';
+
+  before(function (done) {
+    if (document.readyState !== 'complete') {
+      window.addEventListener('load', done.bind(this, null));
+    } else {
+      done();
+    }
+  });
+
+  describe('when set', function () {
+    var opts = {
+      frameWaitTime: 1
+    };
+
+    it('should modify the default frame timeout', function (done) {
+      var start = new Date();
+      // Run axe with an unreasonably short wait time,
+      // expecting the frame to time out
+      axe.run('main', opts, function (err, res) {
+        assert.isNotNull(err);
+        assert.isUndefined(res);
+        assert.equal(err.message, 'Axe in frame timed out: #frame');
+        // Ensure that axe waited less than the default wait time
+        assert.isBelow(new Date() - start, 60000);
+        done();
+      });
+    });
+  });
+
+  describe('when not set', function () {
+
+    it('should use the default frame timeout', function (done) {
+      axe.run('main', function (err, res) {
+        assert.isNull(err);
+        assert.isAbove(res.violations.length, 0);
+        done();
+      });
+    });
+  });
+});
diff --git a/test/integration/full/frame-wait-time/frames/frame.html b/test/integration/full/frame-wait-time/frames/frame.html
@@ -0,0 +1,11 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<title>frame-wait-time test frame</title>
+	<meta charset="utf8">
+	<script src="/axe.js"></script>
+</head>
+<body>
+  <h1 style="opacity: 0.1;">So Dim</h1>
+</body>
+</html>