axe-core 4.1.2-canary.ec00dc7 → 4.1.2

package/lib/core/utils/preload-cssom.js

@@ -19,25 +19,25 @@ import querySelectorAllFilter from './query-selector-all-filter';
  */
 // TODO: es-modules_tree
 function preloadCssom({ treeRoot = axe._tree[0] }) {
-  /**
-   * get all `document` and `documentFragment` with in given `tree`
-   */
-  const rootNodes = getAllRootNodesInTree(treeRoot);
+	/**
+	 * get all `document` and `documentFragment` with in given `tree`
+	 */
+	const rootNodes = getAllRootNodesInTree(treeRoot);
 
-  if (!rootNodes.length) {
-    return Promise.resolve();
-  }
+	if (!rootNodes.length) {
+		return Promise.resolve();
+	}
 
-  const dynamicDoc = document.implementation.createHTMLDocument(
-    'Dynamic document for loading cssom'
-  );
+	const dynamicDoc = document.implementation.createHTMLDocument(
+		'Dynamic document for loading cssom'
+	);
 
-  const convertDataToStylesheet = getStyleSheetFactory(dynamicDoc);
+	const convertDataToStylesheet = getStyleSheetFactory(dynamicDoc);
 
-  return getCssomForAllRootNodes(
-    rootNodes,
-    convertDataToStylesheet
-  ).then(assets => flattenAssets(assets));
+	return getCssomForAllRootNodes(
+		rootNodes,
+		convertDataToStylesheet
+	).then(assets => flattenAssets(assets));
 }
 
 export default preloadCssom;
@@ -49,22 +49,22 @@ export default preloadCssom;
  * @returns {Array<Object>} array of objects, which each object containing a root and an optional `shadowId`
  */
 function getAllRootNodesInTree(tree) {
-  const ids = [];
-
-  const rootNodes = querySelectorAllFilter(tree, '*', node => {
-    if (ids.includes(node.shadowId)) {
-      return false;
-    }
-    ids.push(node.shadowId);
-    return true;
-  }).map(node => {
-    return {
-      shadowId: node.shadowId,
-      rootNode: getRootNode(node.actualNode)
-    };
-  });
-
-  return uniqueArray(rootNodes, []);
+	let ids = [];
+
+	const rootNodes = querySelectorAllFilter(tree, '*', node => {
+		if (ids.includes(node.shadowId)) {
+			return false;
+		}
+		ids.push(node.shadowId);
+		return true;
+	}).map(node => {
+		return {
+			shadowId: node.shadowId,
+			rootNode: getRootNode(node.actualNode)
+		};
+	});
+
+	return uniqueArray(rootNodes, []);
 }
 
 /**
@@ -75,44 +75,44 @@ function getAllRootNodesInTree(tree) {
  * @returns {Promise}
  */
 function getCssomForAllRootNodes(rootNodes, convertDataToStylesheet) {
-  const promises = [];
-
-  rootNodes.forEach(({ rootNode, shadowId }, index) => {
-    const sheets = getStylesheetsOfRootNode(
-      rootNode,
-      shadowId,
-      convertDataToStylesheet
-    );
-    if (!sheets) {
-      return Promise.all(promises);
-    }
-
-    const rootIndex = index + 1;
-    const parseOptions = {
-      rootNode,
-      shadowId,
-      convertDataToStylesheet,
-      rootIndex
-    };
-    /**
-     * Note:
-     * `importedUrls` - keeps urls of already imported stylesheets, to prevent re-fetching
-     * eg: nested, cyclic or cross referenced `@import` urls
-     */
-    const importedUrls = [];
-
-    const p = Promise.all(
-      sheets.map((sheet, sheetIndex) => {
-        const priority = [rootIndex, sheetIndex];
-
-        return parseStylesheet(sheet, parseOptions, priority, importedUrls);
-      })
-    );
-
-    promises.push(p);
-  });
-
-  return Promise.all(promises);
+	const promises = [];
+
+	rootNodes.forEach(({ rootNode, shadowId }, index) => {
+		const sheets = getStylesheetsOfRootNode(
+			rootNode,
+			shadowId,
+			convertDataToStylesheet
+		);
+		if (!sheets) {
+			return Promise.all(promises);
+		}
+
+		const rootIndex = index + 1;
+		const parseOptions = {
+			rootNode,
+			shadowId,
+			convertDataToStylesheet,
+			rootIndex
+		};
+		/**
+		 * Note:
+		 * `importedUrls` - keeps urls of already imported stylesheets, to prevent re-fetching
+		 * eg: nested, cyclic or cross referenced `@import` urls
+		 */
+		const importedUrls = [];
+
+		const p = Promise.all(
+			sheets.map((sheet, sheetIndex) => {
+				const priority = [rootIndex, sheetIndex];
+
+				return parseStylesheet(sheet, parseOptions, priority, importedUrls);
+			})
+		);
+
+		promises.push(p);
+	});
+
+	return Promise.all(promises);
 }
 
 /**
@@ -122,11 +122,11 @@ function getCssomForAllRootNodes(rootNodes, convertDataToStylesheet) {
  * @returns {Array<Object>} Array of CSSOM object
  */
 function flattenAssets(assets) {
-  return assets.reduce(
-    (acc, val) =>
-      Array.isArray(val) ? acc.concat(flattenAssets(val)) : acc.concat(val),
-    []
-  );
+	return assets.reduce(
+		(acc, val) =>
+			Array.isArray(val) ? acc.concat(flattenAssets(val)) : acc.concat(val),
+		[]
+	);
 }
 
 /**
@@ -138,19 +138,19 @@ function flattenAssets(assets) {
  * @returns {Array<Object>} an array of stylesheets
  */
 function getStylesheetsOfRootNode(rootNode, shadowId, convertDataToStylesheet) {
-  let sheets;
-
-  // nodeType === 11  -> DOCUMENT_FRAGMENT
-  if (rootNode.nodeType === 11 && shadowId) {
-    sheets = getStylesheetsFromDocumentFragment(
-      rootNode,
-      convertDataToStylesheet
-    );
-  } else {
-    sheets = getStylesheetsFromDocument(rootNode);
-  }
-
-  return filterStylesheetsWithSameHref(sheets);
+	let sheets;
+
+	// nodeType === 11  -> DOCUMENT_FRAGMENT
+	if (rootNode.nodeType === 11 && shadowId) {
+		sheets = getStylesheetsFromDocumentFragment(
+			rootNode,
+			convertDataToStylesheet
+		);
+	} else {
+		sheets = getStylesheetsFromDocument(rootNode);
+	}
+
+	return filterStylesheetsWithSameHref(sheets);
 }
 
 /**
@@ -161,23 +161,23 @@ function getStylesheetsOfRootNode(rootNode, shadowId, convertDataToStylesheet) {
  * @returns {Array<Object>}
  */
 function getStylesheetsFromDocumentFragment(rootNode, convertDataToStylesheet) {
-  return (
-    Array.from(rootNode.children)
-      .filter(filerStyleAndLinkAttributesInDocumentFragment)
-      // Reducer to convert `<style></style>` and `<link>` references to `CSSStyleSheet` object
-      .reduce((out, node) => {
-        const nodeName = node.nodeName.toUpperCase();
-        const data = nodeName === 'STYLE' ? node.textContent : node;
-        const isLink = nodeName === 'LINK';
-        const stylesheet = convertDataToStylesheet({
-          data,
-          isLink,
-          root: rootNode
-        });
-        out.push(stylesheet.sheet);
-        return out;
-      }, [])
-  );
+	return (
+		Array.from(rootNode.children)
+			.filter(filerStyleAndLinkAttributesInDocumentFragment)
+			// Reducer to convert `<style></style>` and `<link>` references to `CSSStyleSheet` object
+			.reduce((out, node) => {
+				const nodeName = node.nodeName.toUpperCase();
+				const data = nodeName === 'STYLE' ? node.textContent : node;
+				const isLink = nodeName === 'LINK';
+				const stylesheet = convertDataToStylesheet({
+					data,
+					isLink,
+					root: rootNode
+				});
+				out.push(stylesheet.sheet);
+				return out;
+			}, [])
+	);
 }
 
 /**
@@ -188,9 +188,9 @@ function getStylesheetsFromDocumentFragment(rootNode, convertDataToStylesheet) {
  * @returns {Array<Object>}
  */
 function getStylesheetsFromDocument(rootNode) {
-  return Array.from(rootNode.styleSheets).filter(sheet =>
-    filterMediaIsPrint(sheet.media.mediaText)
-  );
+	return Array.from(rootNode.styleSheets).filter(sheet =>
+		filterMediaIsPrint(sheet.media.mediaText)
+	);
 }
 
 /**
@@ -201,16 +201,16 @@ function getStylesheetsFromDocument(rootNode) {
  * @returns {Boolean}
  */
 function filerStyleAndLinkAttributesInDocumentFragment(node) {
-  const nodeName = node.nodeName.toUpperCase();
-  const linkHref = node.getAttribute('href');
-  const linkRel = node.getAttribute('rel');
-  const isLink =
-    nodeName === 'LINK' &&
-    linkHref &&
-    linkRel &&
-    node.rel.toUpperCase().includes('STYLESHEET');
-  const isStyle = nodeName === 'STYLE';
-  return isStyle || (isLink && filterMediaIsPrint(node.media));
+	const nodeName = node.nodeName.toUpperCase();
+	const linkHref = node.getAttribute('href');
+	const linkRel = node.getAttribute('rel');
+	const isLink =
+		nodeName === 'LINK' &&
+		linkHref &&
+		linkRel &&
+		node.rel.toUpperCase().includes('STYLESHEET');
+	const isStyle = nodeName === 'STYLE';
+	return isStyle || (isLink && filterMediaIsPrint(node.media));
 }
 
 /**
@@ -220,10 +220,10 @@ function filerStyleAndLinkAttributesInDocumentFragment(node) {
  * @returns {Boolean}
  */
 function filterMediaIsPrint(media) {
-  if (!media) {
-    return true;
-  }
-  return !media.toUpperCase().includes('PRINT');
+	if (!media) {
+		return true;
+	}
+	return !media.toUpperCase().includes('PRINT');
 }
 
 /**
@@ -233,17 +233,17 @@ function filterMediaIsPrint(media) {
  * @returns {Array<Object>}
  */
 function filterStylesheetsWithSameHref(sheets) {
-  const hrefs = [];
-  return sheets.filter(sheet => {
-    if (!sheet.href) {
-      // include sheets without `href`
-      return true;
-    }
-    // if `href` is present, ensure they are not duplicates
-    if (hrefs.includes(sheet.href)) {
-      return false;
-    }
-    hrefs.push(sheet.href);
-    return true;
-  });
+	let hrefs = [];
+	return sheets.filter(sheet => {
+		if (!sheet.href) {
+			// include sheets without `href`
+			return true;
+		}
+		// if `href` is present, ensure they are not duplicates
+		if (hrefs.includes(sheet.href)) {
+			return false;
+		}
+		hrefs.push(sheet.href);
+		return true;
+	});
 }

package/lib/core/utils/preload-media.js

@@ -10,34 +10,34 @@ import querySelectorAllFilter from './query-selector-all-filter';
  */
 // TODO: es-modules_tree
 function preloadMedia({ treeRoot = axe._tree[0] }) {
-  const mediaVirtualNodes = querySelectorAllFilter(
-    treeRoot,
-    'video, audio',
-    ({ actualNode }) => {
-      /**
-       * this is to safe-gaurd against empty `src` values which can get resolved `window.location`, thus never preloading as the URL is not a media asset
-       */
-      if (actualNode.hasAttribute('src')) {
-        return !!actualNode.getAttribute('src');
-      }
+	const mediaVirtualNodes = querySelectorAllFilter(
+		treeRoot,
+		'video, audio',
+		({ actualNode }) => {
+			/**
+			 * this is to safe-gaurd against empty `src` values which can get resolved `window.location`, thus never preloading as the URL is not a media asset
+			 */
+			if (actualNode.hasAttribute('src')) {
+				return !!actualNode.getAttribute('src');
+			}
 
-      /**
-       * The `src` on <source> element is essential for `audio` and `video` elements
-       */
-      const sourceWithSrc = Array.from(
-        actualNode.getElementsByTagName('source')
-      ).filter(source => !!source.getAttribute('src'));
-      if (sourceWithSrc.length <= 0) {
-        return false;
-      }
+			/**
+			 * The `src` on <source> element is essential for `audio` and `video` elements
+			 */
+			const sourceWithSrc = Array.from(
+				actualNode.getElementsByTagName('source')
+			).filter(source => !!source.getAttribute('src'));
+			if (sourceWithSrc.length <= 0) {
+				return false;
+			}
 
-      return true;
-    }
-  );
+			return true;
+		}
+	);
 
-  return Promise.all(
-    mediaVirtualNodes.map(({ actualNode }) => isMediaElementReady(actualNode))
-  );
+	return Promise.all(
+		mediaVirtualNodes.map(({ actualNode }) => isMediaElementReady(actualNode))
+	);
 }
 
 export default preloadMedia;
@@ -48,23 +48,23 @@ export default preloadMedia;
  * @returns {Promise}
  */
 function isMediaElementReady(elm) {
-  return new Promise(resolve => {
-    /**
-     * See - https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/readyState
-     */
-    if (elm.readyState > 0) {
-      resolve(elm);
-    }
+	return new Promise(resolve => {
+		/**
+		 * See - https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/readyState
+		 */
+		if (elm.readyState > 0) {
+			resolve(elm);
+		}
 
-    function onMediaReady() {
-      elm.removeEventListener('loadedmetadata', onMediaReady);
-      resolve(elm);
-    }
+		function onMediaReady() {
+			elm.removeEventListener('loadedmetadata', onMediaReady);
+			resolve(elm);
+		}
 
-    /**
-     * Given media is not ready, wire up listener for `loadedmetadata`
-     * See - https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/loadedmetadata_event
-     */
-    elm.addEventListener('loadedmetadata', onMediaReady);
-  });
+		/**
+		 * Given media is not ready, wire up listener for `loadedmetadata`
+		 * See - https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/loadedmetadata_event
+		 */
+		elm.addEventListener('loadedmetadata', onMediaReady);
+	});
 }