axe-core/lib/commons/dom/shadow-elements-from-point.js

Accessibility engine for automated Web UI testing

/* global axe, dom */
/**
 * Get elements from point across shadow dom boundaries
 * @method shadowElementsFromPoint
 * @memberof axe.commons.dom
 * @instance
 * @param {Number} nodeX X coordinates of point
 * @param {Number} nodeY Y coordinates of point
 * @param {Object} [root] Shadow root or document root
 * @return {Array}
 */
dom.shadowElementsFromPoint = function(nodeX, nodeY, root = document, i=0) {
	if (i > 999) {
		throw new Error('Infinite loop detected');
	}
	return Array.from(root.elementsFromPoint(nodeX, nodeY))
		// As of Chrome 66, elementFromPoint will return elements from parent trees.
		// We only want to touch each tree once, so we're filtering out nodes on other trees.
		.filter(nodes => dom.getRootNode(nodes) === root)
		.reduce((stack, elm) => {
			if (axe.utils.isShadowRoot(elm)) {
				const shadowStack = dom.shadowElementsFromPoint(nodeX, nodeY, elm.shadowRoot, i+1);
				stack = stack.concat(shadowStack);
				// filter host nodes which get included regardless of overlap
				// TODO: refactor multiline overlap checking inside shadow dom
				if (stack.length && axe.commons.dom.visuallyContains(stack[0], elm)) {
					stack.push(elm);
				}
			} else {
				stack.push(elm);
			}
			return stack;
		}, []);
};