From d20467b502315a16ebd3c7c8e8c205b151c8ad4d Mon Sep 17 00:00:00 2001 From: Jey Date: Wed, 12 Sep 2018 05:51:31 +0100 Subject: [PATCH] refactor: adding stylesheets for tests to be promise based to invoke done accordingly --- .../full/css-orientation-lock/passes.js | 26 +++----- .../full/css-orientation-lock/violations.js | 26 +++----- .../full/preload-cssom/preload-cssom.js | 34 +++------- test/integration/full/preload/preload.js | 32 +++------- test/testutils.js | 62 +++++++++++++++++++ 5 files changed, 99 insertions(+), 81 deletions(-) diff --git a/test/integration/full/css-orientation-lock/passes.js b/test/integration/full/css-orientation-lock/passes.js index fdc072f160..96c4504845 100644 --- a/test/integration/full/css-orientation-lock/passes.js +++ b/test/integration/full/css-orientation-lock/passes.js @@ -4,20 +4,6 @@ describe('css-orientation-lock passes test', function() { var shadowSupported = axe.testUtils.shadowSupport.v1; var isPhantom = window.PHANTOMJS ? true : false; - function addSheet(data) { - if (data.href) { - var link = document.createElement('link'); - link.rel = 'stylesheet'; - link.href = data.href; - document.head.appendChild(link); - } else { - const style = document.createElement('style'); - style.type = 'text/css'; - style.appendChild(document.createTextNode(data.text)); - document.head.appendChild(style); - } - } - var styleSheets = [ { href: @@ -34,9 +20,15 @@ describe('css-orientation-lock passes test', function() { this.skip(); done(); } else { - styleSheets.forEach(addSheet); - // wait for network request to complete for added sheets - setTimeout(done, 5000); + axe.testUtils + .addStyleSheets(styleSheets) + .then(function() { + done(); + }) + .catch(function(error) { + console.error('Could not load stylesheets for testing.', error); + done(); + }); } }); diff --git a/test/integration/full/css-orientation-lock/violations.js b/test/integration/full/css-orientation-lock/violations.js index 760f2cccc7..f53c12380e 100644 --- a/test/integration/full/css-orientation-lock/violations.js +++ b/test/integration/full/css-orientation-lock/violations.js @@ -4,20 +4,6 @@ describe('css-orientation-lock violations test', function() { var shadowSupported = axe.testUtils.shadowSupport.v1; var isPhantom = window.PHANTOMJS ? true : false; - function addSheet(data) { - if (data.href) { - var link = document.createElement('link'); - link.rel = 'stylesheet'; - link.href = data.href; - document.head.appendChild(link); - } else { - const style = document.createElement('style'); - style.type = 'text/css'; - style.appendChild(document.createTextNode(data.text)); - document.head.appendChild(style); - } - } - var styleSheets = [ { href: @@ -33,9 +19,15 @@ describe('css-orientation-lock violations test', function() { this.skip(); done(); } else { - styleSheets.forEach(addSheet); - // wait for network request to complete for added sheets - setTimeout(done, 5000); + axe.testUtils + .addStyleSheets(styleSheets) + .then(function() { + done(); + }) + .catch(function(error) { + console.error('Could not load stylesheets for testing.', error); + done(); + }); } }); diff --git a/test/integration/full/preload-cssom/preload-cssom.js b/test/integration/full/preload-cssom/preload-cssom.js index 635357b8c4..b9c3824baf 100644 --- a/test/integration/full/preload-cssom/preload-cssom.js +++ b/test/integration/full/preload-cssom/preload-cssom.js @@ -6,23 +6,6 @@ describe('preload cssom integration test', function() { var shadowSupported = axe.testUtils.shadowSupport.v1; var isPhantom = window.PHANTOMJS ? true : false; - function addSheet(data) { - if (data.href) { - var link = document.createElement('link'); - link.rel = 'stylesheet'; - link.href = data.href; - if (data.mediaPrint) { - link.media = 'print'; - } - document.head.appendChild(link); - } else { - const style = document.createElement('style'); - style.type = 'text/css'; - style.appendChild(document.createTextNode(data.text)); - document.head.appendChild(style); - } - } - var styleSheets = [ { href: @@ -44,14 +27,15 @@ describe('preload cssom integration test', function() { this.skip(); done(); } else { - styleSheets.forEach(addSheet); - // cache original axios object - if (axe.imports.axios) { - origAxios = axe.imports.axios; - } - - // wait for network request to complete for added sheets - setTimeout(done, 5000); + axe.testUtils + .addStyleSheets(styleSheets) + .then(function() { + done(); + }) + .catch(function(error) { + console.error('Could not load stylesheets for testing.', error); + done(); + }); } }); diff --git a/test/integration/full/preload/preload.js b/test/integration/full/preload/preload.js index 8a9bcbb312..8d4938a408 100644 --- a/test/integration/full/preload/preload.js +++ b/test/integration/full/preload/preload.js @@ -5,23 +5,6 @@ describe('preload integration test', function() { var origAxios; var isPhantom = window.PHANTOMJS ? true : false; - function addSheet(data) { - if (data.href) { - var link = document.createElement('link'); - link.rel = 'stylesheet'; - link.href = data.href; - if (data.mediaPrint) { - link.media = 'print'; - } - document.head.appendChild(link); - } else { - const style = document.createElement('style'); - style.type = 'text/css'; - style.appendChild(document.createTextNode(data.text)); - document.head.appendChild(style); - } - } - var styleSheets = [ { href: 'https://unpkg.com/gutenberg-css@0.4' @@ -41,8 +24,6 @@ describe('preload integration test', function() { this.skip(); done(); } else { - styleSheets.forEach(addSheet); - // cache originals if (axe.imports.axios) { origAxios = axe.imports.axios; @@ -82,9 +63,16 @@ describe('preload integration test', function() { } ] }); - - // wait for network request to complete for added sheets - setTimeout(done, 5000); + // load stylesheets + axe.testUtils + .addStyleSheets(styleSheets) + .then(function() { + done(); + }) + .catch(function(error) { + console.error('Could not load stylesheets for testing.', error); + done(); + }); } }); diff --git a/test/testutils.js b/test/testutils.js index af2bc610a3..f9f2df69ed 100644 --- a/test/testutils.js +++ b/test/testutils.js @@ -1,3 +1,5 @@ +/* global Promise */ + // Let the user know they need to disable their axe/attest extension before running the tests. if (window.__AXE_EXTENSION__) { throw new Error( @@ -220,4 +222,64 @@ testUtils.awaitNestedLoad = function awaitNestedLoad(win, cb) { }); }; +/** + * Add a given stylesheet dynamically to the document + * + * @param {Object} data composite object containing properties to create stylesheet + * @property {String} data.href relative or absolute url for stylesheet to be loaded + * @property {Boolean} data.mediaPrint boolean to represent if the constructed sheet is for print media + * @property {String} data.text text contents to be written to the stylesheet + * @returns {Object} a Promise + */ +testUtils.addStyleSheet = function addStyleSheet(data) { + function loadAsLinkTag(href, mediaPrint, resolve, reject) { + var link = document.createElement('link'); + link.rel = 'stylesheet'; + link.href = href; + if (mediaPrint) { + link.media = 'print'; + } + link.onload = function() { + resolve(); + }; + link.onerror = function() { + reject(); + }; + document.head.appendChild(link); + } + + function loadAsStyleTag(text, resolve) { + const style = document.createElement('style'); + style.type = 'text/css'; + style.appendChild(document.createTextNode(text)); + document.head.appendChild(style); + resolve(); + } + + return new Promise(function(resolve) { + if (data.href) { + loadAsLinkTag(data.href, data.mediaPrint, resolve); + } else { + loadAsStyleTag(data.text, resolve); + } + }); +}; + +/** + * Add a list of stylesheets + * + * @param {Object} sheets array of sheets data object + * @returns {Object} a Promise + */ +testUtils.addStyleSheets = function addStyleSheets(sheets) { + var promises = []; + + sheets.forEach(function(data) { + var p = axe.testUtils.addStyleSheet(data); + promises.push(p); + }); + + return Promise.all(promises); +}; + axe.testUtils = testUtils;