aria-api 0.7.0 → 0.9.0

package/index.js

@@ -1,18 +1,4 @@
-var query = require('./lib/query.js');
-var name = require('./lib/name.js');
-var atree = require('./lib/atree.js');
-
-module.exports = {
-	getRole: query.getRole,
-	getAttribute: query.getAttribute,
-	getName: name.getName,
-	getDescription: name.getDescription,
-
-	matches: query.matches,
-	querySelector: query.querySelector,
-	querySelectorAll: query.querySelectorAll,
-	closest: query.closest,
-
-	getParentNode: atree.getParentNode,
-	getChildNodes: atree.getChildNodes,
-};
+export { getParentNode, getChildNodes } from './lib/atree.js';
+export { getRole, getAttribute } from './lib/attrs.js';
+export { matches, querySelector, querySelectorAll, closest } from './lib/query.js';
+export { getName, getDescription } from './lib/name.js';

package/lib/atree.js

@@ -1,27 +1,19 @@
-const attrs = require('./attrs');
+import * as attrs from './attrs';
 
-const _getOwner = function(node, owners) {
+const _getOwner = function(node) {
 	if (node.nodeType === node.ELEMENT_NODE && node.id) {
-		const selector = '[aria-owns~="' + CSS.escape(node.id) + '"]';
-		if (owners) {
-			for (const owner of owners) {
-				if (owner.matches(selector)) {
-					return owner;
-				}
-			}
-		} else {
-			return document.querySelector(selector);
-		}
+		const selector = `[aria-owns~="${CSS.escape(node.id)}"]`;
+		return node.getRootNode().querySelector(selector);
 	}
 };
 
-const _getParentNode = function(node, owners) {
-	return _getOwner(node, owners) || node.parentNode;
+const _getParentNode = function(node) {
+	return _getOwner(node) || node.parentNode || node.host;
 };
 
-const detectLoop = function(node, owners) {
+const detectLoop = function(node) {
 	const seen = [node];
-	while ((node = _getParentNode(node, owners))) {
+	while ((node = _getParentNode(node))) {
 		if (seen.includes(node)) {
 			return true;
 		}
@@ -29,27 +21,36 @@ const detectLoop = function(node, owners) {
 	}
 };
 
-const getOwner = function(node, owners) {
-	const owner = _getOwner(node, owners);
-	if (owner && !detectLoop(node, owners)) {
+const getOwner = function(node) {
+	const owner = _getOwner(node);
+	if (owner && !detectLoop(node)) {
 		return owner;
 	}
 };
 
-const getParentNode = function(node, owners) {
-	return getOwner(node, owners) || node.parentNode;
+export const getParentNode = function(node) {
+	return getOwner(node) || node.parentNode || node.host;
 };
 
 const isHidden = function(node) {
 	return node.nodeType === node.ELEMENT_NODE && attrs.getAttribute(node, 'hidden');
 };
 
-const getChildNodes = function(node, owners) {
+export const getChildNodes = function(node) {
 	const childNodes = [];
+	let rawChildNodes = [];
 
-	for (let i = 0; i < node.childNodes.length; i++) {
-		const child = node.childNodes[i];
-		if (!getOwner(child, owners) && !isHidden(child)) {
+	if (node.shadowRoot) {
+		rawChildNodes = node.shadowRoot.childNodes;
+	} else if (node.assignedNodes) {
+		rawChildNodes = node.assignedNodes();
+	} else {
+		rawChildNodes = node.childNodes;
+	}
+
+	for (let i = 0; i < rawChildNodes.length; i++) {
+		const child = rawChildNodes[i];
+		if (!getOwner(child) && !isHidden(child)) {
 			childNodes.push(child);
 		}
 	}
@@ -57,9 +58,9 @@ const getChildNodes = function(node, owners) {
 	if (node.nodeType === node.ELEMENT_NODE) {
 		const owns = attrs.getAttribute(node, 'owns') || [];
 		for (let i = 0; i < owns.length; i++) {
-			const child = document.getElementById(owns[i]);
+			const child = node.getRootNode().getElementById(owns[i]);
 			// double check with getOwner for consistency
-			if (child && getOwner(child, owners) === node && !isHidden(child)) {
+			if (child && getOwner(child) === node && !isHidden(child)) {
 				childNodes.push(child);
 			}
 		}
@@ -68,17 +69,16 @@ const getChildNodes = function(node, owners) {
 	return childNodes;
 };
 
-const walk = function(root, fn) {
-	const owners = document.querySelectorAll('[aria-owns]');
+export const walk = function(root, fn) {
 	let queue = [root];
 	while (queue.length) {
 		const item = queue.shift();
 		fn(item);
-		queue = getChildNodes(item, owners).concat(queue);
+		queue = getChildNodes(item).concat(queue);
 	}
 };
 
-const searchUp = function(node, test) {
+export const searchUp = function(node, test) {
 	const candidate = getParentNode(node);
 	if (candidate) {
 		if (test(candidate)) {
@@ -88,10 +88,3 @@ const searchUp = function(node, test) {
 		}
 	}
 };
-
-module.exports = {
-	'getParentNode': getParentNode,
-	'getChildNodes': getChildNodes,
-	'walk': walk,
-	'searchUp': searchUp,
-};

package/lib/attrs.js

@@ -1,4 +1,4 @@
-const constants = require('./constants.js');
+import * as constants from './constants.js';
 
 var unique = function(arr) {
 	return arr.filter((a, i) => arr.indexOf(a) === i);
@@ -17,7 +17,7 @@ var normalizeRoles = function(roles, includeAbstract) {
 };
 
 // candidates can be passed for performance optimization
-const getRole = function(el, candidates) {
+const getRoleRaw = function(el, candidates) {
 	// TODO: filter out any invalid roles (e.g. name or context required)
 	const roles = normalizeRoles(
 		(el.getAttribute('role') || '').toLowerCase().split(/\s+/)
@@ -41,14 +41,18 @@ const getRole = function(el, candidates) {
 	}
 };
 
-const hasRole = function(el, roles) {
+export const getRole = function(el) {
+	return getRoleRaw(el);
+};
+
+export const hasRole = function(el, roles) {
 	const subRoles = normalizeRoles(roles, true).map(role => {
 		return constants.roles[role].subRoles || [role];
 	});
-	return !!getRole(el, unique(flatten(subRoles)));
+	return !!getRoleRaw(el, unique(flatten(subRoles)));
 };
 
-const getAttribute = function(el, key) {
+export const getAttribute = function(el, key) {
 	if (constants.attributeStrongMapping.hasOwnProperty(key)) {
 		const value = el[constants.attributeStrongMapping[key]];
 		if (value) {
@@ -124,9 +128,3 @@ const getAttribute = function(el, key) {
 		return false;
 	}
 };
-
-module.exports = {
-	getRole: getRole,
-	hasRole: hasRole,
-	getAttribute: getAttribute,
-};

package/lib/constants.js

@@ -1,5 +1,5 @@
 // https://www.w3.org/TR/wai-aria/#state_prop_def
-exports.attributes = {
+export const attributes = {
 	'activedescendant': 'id',
 	'atomic': 'bool',
 	'autocomplete': 'token',
@@ -55,14 +55,14 @@ exports.attributes = {
 	'valuetext': 'string',
 };
 
-exports.attributeStrongMapping = {
+export const attributeStrongMapping = {
 	'disabled': 'disabled',
 	'placeholder': 'placeholder',
 	'readonly': 'readOnly',
 	'required': 'required',
 };
 
-exports.attributeWeakMapping = {
+export const attributeWeakMapping = {
 	'checked': 'checked',
 	'colspan': 'colSpan',
 	'expanded': 'open',
@@ -89,7 +89,7 @@ const svgSelectors = function(selector) {
 
 // https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings
 // https://www.w3.org/TR/wai-aria/roles
-exports.roles = {
+export const roles = {
 	alert: {
 		childRoles: ['alertdialog'],
 		defaults: {
@@ -387,7 +387,7 @@ exports.roles = {
 		],
 	},
 	link: {
-		selectors: ['a[*|href]', 'area[href]'],
+		selectors: ['a[*|href]', 'area[*|href]'],
 		childRoles: ['doc-backlink', 'doc-biblioref', 'doc-glossref', 'doc-noteref'],
 		nameFromContents: true,
 	},
@@ -732,7 +732,7 @@ exports.roles = {
 };
 
 const getSubRoles = function(role) {
-	const children = (exports.roles[role]).childRoles || [];
+	const children = (roles[role]).childRoles || [];
 	const descendents = children.map(getSubRoles);
 
 	const result = [role];
@@ -748,30 +748,30 @@ const getSubRoles = function(role) {
 	return result;
 };
 
-exports.attrsWithDefaults = [];
+export const attrsWithDefaults = [];
 
-for (const role in exports.roles) {
-	exports.roles[role].subRoles = getSubRoles(role);
-	for (const key in exports.roles[role].defaults) {
-		if (!exports.attrsWithDefaults.includes(key)) {
-			exports.attrsWithDefaults.push(key);
+for (const role in roles) {
+	roles[role].subRoles = getSubRoles(role);
+	for (const key in roles[role].defaults) {
+		if (!attrsWithDefaults.includes(key)) {
+			attrsWithDefaults.push(key);
 		}
 	}
 }
 
-exports.aliases = {
+export const aliases = {
 	'presentation': 'none',
 	'directory': 'list',
 	'img': 'image',
 };
 
-exports.nameFromDescendant = {
+export const nameFromDescendant = {
 	'figure': 'figcaption',
 	'table': 'caption',
 	'fieldset': 'legend',
 };
 
-exports.nameDefaults = {
+export const nameDefaults = {
 	'input[type="submit"]': 'Submit',
 	'input[type="reset"]': 'Reset',
 	'summary': 'Details',

package/lib/name.js

@@ -1,6 +1,7 @@
-const constants = require('./constants.js');
-const atree = require('./atree.js');
-const query = require('./query.js');
+import * as constants from './constants.js';
+import * as atree from './atree.js';
+import * as attrs from './attrs.js';
+import * as query from './query.js';
 
 const addSpaces = function(text, el, pseudoSelector) {
 	// https://github.com/w3c/accname/issues/3
@@ -16,17 +17,17 @@ const getPseudoContent = function(el, pseudoSelector) {
 
 	let match;
 	while (tail.length) {
-		if (match = tail.match(/^"([^"]*)"/)) {
+		if ((match = tail.match(/^"([^"]*)"/))) {
 			ret.push(match[1]);
-		} else if (match = tail.match(/^([a-z-]+)\(([^)]*)\)/)) {
+		} else if ((match = tail.match(/^([a-z-]+)\(([^)]*)\)/))) {
 			if (match[1] === 'attr') {
 				ret.push(el.getAttribute(match[2]) || '');
 			}
-		} else if (match = tail.match(/^([a-z-]+)/)) {
+		} else if ((match = tail.match(/^([a-z-]+)/))) {
 			if (match[1] === 'open-quote' || match[1] === 'close-quote') {
 				ret.push('"');
 			}
-		} else if (match = tail.match(/^\//)) {
+		} else if ((match = tail.match(/^\//))) {
 			ret = [];
 		} else {
 			// invalid content, ignore
@@ -45,12 +46,21 @@ const getContent = function(root, ongoingLabelledBy, visited) {
 	for (let i = 0; i < children.length; i++) {
 		const node = children[i];
 		if (node.nodeType === node.TEXT_NODE) {
-			ret += node.textContent;
+			const styles = window.getComputedStyle(node.parentElement);
+			if (styles.textTransform === 'uppercase') {
+				ret += node.textContent.toUpperCase();
+			} else if (styles.textTransform === 'lowercase') {
+				ret += node.textContent.toLowerCase();
+			} else if (styles.textTransform === 'capitalize') {
+				ret += node.textContent.replace(/\b\w/g, c => c.toUpperCase());
+			} else {
+				ret += node.textContent;
+			}
 		} else if (node.nodeType === node.ELEMENT_NODE) {
 			if (node.tagName.toLowerCase() === 'br') {
 				ret += '\n';
 			} else {
-				ret += getName(node, true, ongoingLabelledBy, visited);
+				ret += getNameRaw(node, true, ongoingLabelledBy, visited);
 			}
 		}
 	}
@@ -59,13 +69,13 @@ const getContent = function(root, ongoingLabelledBy, visited) {
 };
 
 const allowNameFromContent = function(el) {
-	const role = query.getRole(el);
+	const role = attrs.getRole(el);
 	if (role) {
 		return constants.roles[role].nameFromContents;
 	}
 };
 
-const getName = function(el, recursive, ongoingLabelledBy, visited, directReference) {
+const getNameRaw = function(el, recursive, ongoingLabelledBy, visited, directReference) {
 	let ret = '';
 
 	visited = visited || [];
@@ -84,8 +94,8 @@ const getName = function(el, recursive, ongoingLabelledBy, visited, directRefere
 	if (!ongoingLabelledBy && el.matches('[aria-labelledby]')) {
 		const ids = el.getAttribute('aria-labelledby').split(/\s+/);
 		const strings = ids.map(id => {
-			const label = document.getElementById(id);
-			return label ? getName(label, true, true, visited, true) : '';
+			const label = el.getRootNode().getElementById(id);
+			return label ? getNameRaw(label, true, true, visited, true) : '';
 		});
 		ret = strings.join(' ');
 	}
@@ -97,12 +107,12 @@ const getName = function(el, recursive, ongoingLabelledBy, visited, directRefere
 		} else if (query.matches(el, 'combobox,listbox')) {
 			const selected = query.querySelector(el, ':selected') || query.querySelector(el, 'option');
 			if (selected) {
-				ret = getName(selected, recursive, ongoingLabelledBy, visited);
+				ret = getNameRaw(selected, recursive, ongoingLabelledBy, visited);
 			} else {
 				ret = el.value || '';
 			}
 		} else if (query.matches(el, 'range')) {
-			ret = '' + (query.getAttribute(el, 'valuetext') || query.getAttribute(el, 'valuenow') || el.value);
+			ret = '' + (attrs.getAttribute(el, 'valuetext') || attrs.getAttribute(el, 'valuenow') || el.value);
 		}
 	}
 
@@ -115,7 +125,7 @@ const getName = function(el, recursive, ongoingLabelledBy, visited, directRefere
 	// D
 	if (!ret.trim() && !recursive && el.labels) {
 		const strings = Array.prototype.map.call(el.labels, label => {
-			return getName(label, true, ongoingLabelledBy, visited);
+			return getNameRaw(label, true, ongoingLabelledBy, visited);
 		});
 		ret = strings.join(' ');
 	}
@@ -130,7 +140,7 @@ const getName = function(el, recursive, ongoingLabelledBy, visited, directRefere
 			if (el.matches(selector)) {
 				const descendant = el.querySelector(constants.nameFromDescendant[selector]);
 				if (descendant) {
-					ret = getName(descendant, true, ongoingLabelledBy, visited);
+					ret = getNameRaw(descendant, true, ongoingLabelledBy, visited);
 				}
 			}
 		}
@@ -182,21 +192,21 @@ const getName = function(el, recursive, ongoingLabelledBy, visited, directRefere
 	return addSpaces(before + ret + after, el);
 };
 
-const getNameTrimmed = function(el) {
-	return getName(el)
+export const getName = function(el) {
+	return getNameRaw(el)
 		.replace(/[ \n\r\t\f]+/g, ' ')
 		.replace(/^ /, '')
 		.replace(/ $/, '');
 };
 
-const getDescription = function(el) {
+export const getDescription = function(el) {
 	let ret = '';
 
 	if (el.matches('[aria-describedby]')) {
 		const ids = el.getAttribute('aria-describedby').split(/\s+/);
 		const strings = ids.map(id => {
-			const label = document.getElementById(id);
-			return label ? getName(label, true, true) : '';
+			const label = el.getRootNode().getElementById(id);
+			return label ? getNameRaw(label, true, true) : '';
 		});
 		ret = strings.join(' ');
 	} else if (el.matches('[aria-description]')) {
@@ -215,14 +225,9 @@ const getDescription = function(el) {
 
 	ret = (ret || '').trim().replace(/\s+/g, ' ');
 
-	if (ret === getNameTrimmed(el)) {
+	if (ret === getName(el)) {
 		ret = '';
 	}
 
 	return ret;
 };
-
-module.exports = {
-	getName: getNameTrimmed,
-	getDescription: getDescription,
-};

package/lib/query.js

@@ -1,8 +1,7 @@
-const attrs = require('./attrs.js');
-const atree = require('./atree.js');
+import * as attrs from './attrs.js';
+import * as atree from './atree.js';
 
-
-const matches = function(el, selector) {
+export const matches = function(el, selector) {
 	if (selector.substr(0, 1) === ':') {
 		const attr = selector.substr(1);
 		return attrs.getAttribute(el, attr);
@@ -40,7 +39,7 @@ const _querySelector = function(all) {
 	};
 };
 
-const closest = function(el, selector) {
+export const closest = function(el, selector) {
 	return atree.searchUp(el, candidate => {
 		if (candidate.nodeType === candidate.ELEMENT_NODE) {
 			return matches(candidate, selector);
@@ -48,11 +47,5 @@ const closest = function(el, selector) {
 	});
 };
 
-module.exports = {
-	getRole: el => attrs.getRole(el),
-	getAttribute: attrs.getAttribute,
-	matches: matches,
-	querySelector: _querySelector(),
-	querySelectorAll: _querySelector(true),
-	closest: closest,
-};
+export const querySelector = _querySelector();
+export const querySelectorAll = _querySelector(true);

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "aria-api",
-  "version": "0.7.0",
+  "version": "0.9.0",
   "description": "Access ARIA information from JavaScript",
-  "main": "index.js",
+  "main": "dist/aria.js",
+  "module": "index.js",
   "keywords": [
     "aria",
     "accessibility",
@@ -11,11 +12,10 @@
   "author": "Tobias Bengfort <tobias.bengfort@posteo.de>",
   "license": "MIT",
   "devDependencies": {
-    "brfs": "^2.0.0",
-    "browserify": "^17.0.0",
     "expect": "^1.20.2",
     "mocha": "^10.2.0",
-    "mocha-headless-chrome": "^4.0.0"
+    "mocha-headless-chrome": "^4.0.0",
+    "rollup": "^4.24.3"
   },
   "files": [
     "index.js",