aria-api 0.4.1 → 0.4.2

package/README.md

@@ -110,7 +110,7 @@ That said, this is what I think it could also be used for:
 -   [Core Accessibility API Mappings 1.1](https://www.w3.org/TR/core-aam-1.1/)
 -   [HTML Accessibility API Mappings 1.0](https://www.w3.org/TR/html-aam-1.0/)
 -   [WAI-ARIA Graphics Module 1.0](https://www.w3.org/TR/graphics-aria-1.0/)
--   [Digital Publishing WAI-ARIA Module 1.0](https://www.w3.org/TR/graphics-aria-1.0/)
+-   [Digital Publishing WAI-ARIA Module 1.0](https://www.w3.org/TR/dpub-aria-1.0/)
 -   [Accessible Name and Description Computation 1.1](https://www.w3.org/TR/accname-1.1/)
 
 I try to update the code whenever a new version of these specs becomes a

package/dist/aria.js

@@ -23,7 +23,7 @@ var attrs = require('./attrs');
 
 var _getOwner = function(node) {
 	if (node.nodeType === node.ELEMENT_NODE && node.id) {
-		var owner = document.querySelector('[aria-owns~="' + node.id + '"]');
+		var owner = document.querySelector('[aria-owns~="' + CSS.escape(node.id) + '"]');
 		if (owner) {
 			return owner;
 		}
@@ -46,7 +46,7 @@ var detectLoop = function(node) {
 
 var getOwner = function(node) {
 	if (node.nodeType === node.ELEMENT_NODE && node.id) {
-		var owner = document.querySelector('[aria-owns~="' + node.id + '"]');
+		var owner = document.querySelector('[aria-owns~="' + CSS.escape(node.id) + '"]');
 		if (owner && !detectLoop(node)) {
 			return owner;
 		}
@@ -228,62 +228,56 @@ module.exports = {
 };
 
 },{"./constants.js":4}],4:[function(require,module,exports){
+// https://www.w3.org/TR/wai-aria/#state_prop_def
 exports.attributes = {
-	// widget
+	'activedescendant': 'id',
+	'atomic': 'bool',
 	'autocomplete': 'token',
+	'busy': 'bool',
 	'checked': 'tristate',
+	'colcount': 'int',
+	'colindex': 'int',
+	'colspan': 'int',
+	'controls': 'id-list',
 	'current': 'token',
+	'describedby': 'id-list',
+	'details': 'id',
 	'disabled': 'bool',
+	'dropeffect': 'token-list',
+	'errormessage': 'id',
 	'expanded': 'bool-undefined',
+	'flowto': 'id-list',
+	'grabbed': 'bool-undefined',
 	'haspopup': 'token',
-	'hidden': 'bool',  // !
+	'hidden': 'bool-undefined',
 	'invalid': 'token',
 	'keyshortcuts': 'string',
 	'label': 'string',
+	'labelledby': 'id-list',
 	'level': 'int',
+	'live': 'token',
 	'modal': 'bool',
 	'multiline': 'bool',
 	'multiselectable': 'bool',
 	'orientation': 'token',
+	'owns': 'id-list',
 	'placeholder': 'string',
+	'posinset': 'int',
 	'pressed': 'tristate',
 	'readonly': 'bool',
+	'relevant': 'token-list',
 	'required': 'bool',
 	'roledescription': 'string',
-	'selected': 'bool-undefined',
-	'valuemax': 'number',
-	'valuemin': 'number',
-	'valuenow': 'number',
-	'valuetext': 'string',
-
-	// live
-	'atomic': 'bool',
-	'busy': 'bool',
-	'live': 'token',
-	'relevant': 'token-list',
-
-	// dragndrop
-	'dropeffect': 'token-list',
-	'grabbed': 'bool-undefined',
-
-	// relationship
-	'activedescendant': 'id',
-	'colcount': 'int',
-	'colindex': 'int',
-	'colspan': 'int',
-	'controls': 'id-list',
-	'describedby': 'id-list',
-	'details': 'id',
-	'errormessage': 'id',
-	'flowto': 'id-list',
-	'labelledby': 'id-list',
-	'owns': 'id-list',
-	'posinset': 'int',
 	'rowcount': 'int',
 	'rowindex': 'int',
 	'rowspan': 'int',
+	'selected': 'bool-undefined',
 	'setsize': 'int',
 	'sort': 'token',
+	'valuemax': 'number',
+	'valuemin': 'number',
+	'valuenow': 'number',
+	'valuetext': 'string',
 };
 
 exports.attributeStrongMapping = {
@@ -315,6 +309,9 @@ exports.roles = {
 	article: {
 		selectors: ['article'],
 	},
+	blockquote: {
+		selectors: ['blockquote'],
+	},
 	button: {
 		selectors: [
 			'button',
@@ -326,17 +323,21 @@ exports.roles = {
 		],
 		nameFromContents: true,
 	},
+	caption: {
+		selectors: ['caption'],  // not sure about figcaption, ARIA and HTML-AAM differ
+	},
 	cell: {
 		selectors: ['td'],
 		childRoles: ['gridcell', 'rowheader'],
+		nameFromContents: true,
 	},
 	checkbox: {
 		selectors: ['input[type="checkbox"]'],
-		childRoles: ['menuitemcheckbox', 'switch'],
+		childRoles: ['switch'],
 		nameFromContents: true,
-		defaults: {
-			'checked': 'false',
-		},
+	},
+	code: {
+		selectors: ['code'],
 	},
 	columnheader: {
 		selectors: ['th[scope="col"]'],
@@ -355,7 +356,6 @@ exports.roles = {
 			'select[size="1"]:not([multiple])',
 		],
 		defaults: {
-			'expanded': false,
 			'haspopup': 'listbox',
 		},
 	},
@@ -371,6 +371,9 @@ exports.roles = {
 	definition: {
 		selectors: ['dd'],
 	},
+	deletion: {
+		selectors: ['del'],
+	},
 	dialog: {
 		selectors: ['dialog'],
 		childRoles: ['alertdialog'],
@@ -387,16 +390,35 @@ exports.roles = {
 	'doc-noteref': {
 		nameFromContents: true,
 	},
+	'doc-pagebreak': {
+		nameFromContents: true,
+	},
+	'doc-subtitle': {
+		nameFromContents: true,
+	},
 	document: {
-		selectors: ['body'],
+		selector: ['html'],
 		childRoles: ['article', 'graphics-document'],
 	},
+	emphasis: {
+		selectors: ['em'],
+	},
 	figure: {
 		selectors: ['figure'],
+		childRoles: ['doc-example'],
 	},
 	form: {
 		selectors: ['form[aria-label]', 'form[aria-labelledby]', 'form[title]'],
 	},
+	generic: {
+		selectors: [
+			'body',
+			'div',
+			'form:not([aria-label]):not([aria-labelledby]):not([title])',
+			'hgroup',
+			'span',
+		],
+	},
 	grid: {
 		childRoles: ['treegrid'],
 	},
@@ -405,22 +427,22 @@ exports.roles = {
 		nameFromContents: true,
 	},
 	group: {
-		selectors: ['details', 'optgroup'],
+		selectors: ['details', 'fieldset', 'optgroup'],
 		childRoles: ['row', 'select', 'toolbar', 'graphics-object'],
 	},
 	heading: {
 		selectors: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'],
 		nameFromContents: true,
-		defaults: {
-			'level': 2,
-		},
 	},
 	img: {
 		selectors: ['img:not([alt=""])', 'graphics-symbol'],
 		childRoles: ['doc-cover'],
 	},
 	input: {
-		childRoles: ['checkbox', 'option', 'radio', 'slider', 'spinbutton', 'textbox'],
+		childRoles: ['checkbox', 'combobox', 'option', 'radio', 'slider', 'spinbutton', 'textbox'],
+	},
+	insertion: {
+		selectors: ['ins'],
 	},
 	landmark: {
 		childRoles: [
@@ -456,11 +478,12 @@ exports.roles = {
 		nameFromContents: true,
 	},
 	list: {
-		selectors: ['dl', 'ol', 'ul'],
+		selectors: ['ol', 'ul', 'menu'],
 		childRoles: ['directory', 'feed'],
 	},
 	listbox: {
 		selectors: [
+			'datalist',
 			'select[multiple]',
 			'select[size]:not([size="0"]):not([size="1"])',
 		],
@@ -469,8 +492,8 @@ exports.roles = {
 		},
 	},
 	listitem: {
-		selectors: ['dt', 'ul > li', 'ol > li'],
-		childRoles: ['doc-biblioentry', 'doc-endnote', 'treeitem'],
+		selectors: ['ul > li', 'ol > li', 'menu > li'],
+		childRoles: ['treeitem'],
 	},
 	log: {
 		defaults: {
@@ -483,8 +506,14 @@ exports.roles = {
 	math: {
 		selectors: ['math'],
 	},
+	meter: {
+		selectors: ['meter'],
+		defaults: {
+			'valuemin': 0,
+			'valuemax': 100,
+		},
+	},
 	menu: {
-		selectors: ['menu[type="context"]'],
 		childRoles: ['menubar'],
 		defaults: {
 			'orientation': 'vertical',
@@ -504,16 +533,10 @@ exports.roles = {
 		selectors: ['menuitem[type="checkbox"]'],
 		childRoles: ['menuitemradio'],
 		nameFromContents: true,
-		defaults: {
-			'checked': 'false',
-		},
 	},
 	menuitemradio: {
 		selectors: ['menuitem[type="radio"]'],
 		nameFromContents: true,
-		defaults: {
-			'checked': 'false',
-		},
 	},
 	navigation: {
 		selectors: ['nav'],
@@ -530,19 +553,22 @@ exports.roles = {
 			'selected': 'false',
 		},
 	},
+	paragraph: {
+		selectors: ['p'],
+	},
 	progressbar: {
 		selectors: ['progress'],
+		defaults: {
+			'valuemin': 0,
+			'valuemax': 100,
+		},
 	},
 	radio: {
 		selectors: ['input[type="radio"]'],
-		childRoles: ['menuitemradio'],
 		nameFromContents: true,
-		defaults: {
-			'checked': 'false',
-		},
 	},
 	range: {
-		childRoles: ['progressbar', 'scrollbar', 'slider', 'spinbutton'],
+		childRoles: ['meter', 'progressbar', 'scrollbar', 'slider', 'spinbutton'],
 	},
 	region: {
 		selectors: ['section[aria-label]', 'section[aria-labelledby]', 'section[title]'],
@@ -554,12 +580,11 @@ exports.roles = {
 		selectors: ['tr'],
 		nameFromContents: true,
 	},
-	rowheader: {
-		selectors: ['th[scope="row"]'],
-		nameFromContents: true,
-	},
 	rowgroup: {
 		selectors: ['tbody', 'thead', 'tfoot'],
+	},
+	rowheader: {
+		selectors: ['th[scope="row"]'],
 		nameFromContents: true,
 	},
 	scrollbar: {
@@ -577,19 +602,27 @@ exports.roles = {
 	section: {
 		childRoles: [
 			'alert',
+			'blockquote',
+			'caption',
 			'cell',
+			'code',
 			'definition',
+			'deletion',
 			'doc-abstract',
 			'doc-colophon',
 			'doc-credit',
 			'doc-dedication',
 			'doc-epigraph',
-			'doc-example',
 			'doc-footnote',
+			'doc-pagefooter',
+			'doc-pageheader',
+			'doc-pullquote',
 			'doc-qna',
+			'emphasis',
 			'figure',
 			'group',
 			'img',
+			'insertion',
 			'landmark',
 			'list',
 			'listitem',
@@ -597,10 +630,15 @@ exports.roles = {
 			'marquee',
 			'math',
 			'note',
+			'paragraph',
 			'status',
+			'strong',
+			'subscript',
+			'superscript',
 			'table',
 			'tabpanel',
 			'term',
+			'time',
 			'tooltip',
 		],
 	},
@@ -615,16 +653,14 @@ exports.roles = {
 		nameFromContents: true,
 	},
 	select: {
-		childRoles: ['combobox', 'listbox', 'menu', 'radiogroup', 'tree'],
+		childRoles: ['listbox', 'menu', 'radiogroup', 'tree'],
 	},
 	separator: {
+		// assume not focussable because <hr> is not
 		selectors: ['hr'],
 		childRoles: ['doc-pagebreak'],
 		defaults: {
 			'orientation': 'horizontal',
-			'valuemin': 0,
-			'valuemax': 100,
-			'valuenow': 50,
 		},
 	},
 	slider: {
@@ -640,8 +676,7 @@ exports.roles = {
 	spinbutton: {
 		selectors: ['input[type="number"]'],
 		defaults: {
-			// FIXME: no valuemin/valuemax
-			'valuenow': 0,
+			// FIXME: no valuemin/valuemax/valuenow
 		},
 	},
 	status: {
@@ -652,24 +687,32 @@ exports.roles = {
 			'atomic': true,
 		},
 	},
-	switch: {
-		nameFromContents: true,
-		defaults: {
-			'checked': false,
-		},
+	strong: {
+		selectors: ['strong'],
 	},
 	structure: {
 		childRoles: [
 			'application',
 			'document',
 			'none',
+			'generic',
 			'presentation',
+			'range',
 			'rowgroup',
 			'section',
 			'sectionhead',
 			'separator',
 		],
 	},
+	subscript: {
+		selectors: ['sub'],
+	},
+	superscript: {
+		selectors: ['sup'],
+	},
+	switch: {
+		nameFromContents: true,
+	},
 	tab: {
 		nameFromContents: true,
 		defaults: {
@@ -699,6 +742,9 @@ exports.roles = {
 		],
 		childRoles: ['searchbox'],
 	},
+	time: {
+		selectors: ['time'],
+	},
 	toolbar: {
 		defaults: {
 			'orientation': 'horizontal',
@@ -722,9 +768,9 @@ exports.roles = {
 			'composite',
 			'gridcell',
 			'input',
-			'range',
+			'progressbar',
 			'row',
-			'separator',
+			'scrollbar',
 			'tab',
 		],
 	},

package/lib/atree.js

@@ -2,7 +2,7 @@ var attrs = require('./attrs');
 
 var _getOwner = function(node) {
 	if (node.nodeType === node.ELEMENT_NODE && node.id) {
-		var owner = document.querySelector('[aria-owns~="' + node.id + '"]');
+		var owner = document.querySelector('[aria-owns~="' + CSS.escape(node.id) + '"]');
 		if (owner) {
 			return owner;
 		}
@@ -25,7 +25,7 @@ var detectLoop = function(node) {
 
 var getOwner = function(node) {
 	if (node.nodeType === node.ELEMENT_NODE && node.id) {
-		var owner = document.querySelector('[aria-owns~="' + node.id + '"]');
+		var owner = document.querySelector('[aria-owns~="' + CSS.escape(node.id) + '"]');
 		if (owner && !detectLoop(node)) {
 			return owner;
 		}

package/lib/constants.js

@@ -1,59 +1,53 @@
+// https://www.w3.org/TR/wai-aria/#state_prop_def
 exports.attributes = {
-	// widget
+	'activedescendant': 'id',
+	'atomic': 'bool',
 	'autocomplete': 'token',
+	'busy': 'bool',
 	'checked': 'tristate',
+	'colcount': 'int',
+	'colindex': 'int',
+	'colspan': 'int',
+	'controls': 'id-list',
 	'current': 'token',
+	'describedby': 'id-list',
+	'details': 'id',
 	'disabled': 'bool',
+	'dropeffect': 'token-list',
+	'errormessage': 'id',
 	'expanded': 'bool-undefined',
+	'flowto': 'id-list',
+	'grabbed': 'bool-undefined',
 	'haspopup': 'token',
-	'hidden': 'bool',  // !
+	'hidden': 'bool-undefined',
 	'invalid': 'token',
 	'keyshortcuts': 'string',
 	'label': 'string',
+	'labelledby': 'id-list',
 	'level': 'int',
+	'live': 'token',
 	'modal': 'bool',
 	'multiline': 'bool',
 	'multiselectable': 'bool',
 	'orientation': 'token',
+	'owns': 'id-list',
 	'placeholder': 'string',
+	'posinset': 'int',
 	'pressed': 'tristate',
 	'readonly': 'bool',
+	'relevant': 'token-list',
 	'required': 'bool',
 	'roledescription': 'string',
-	'selected': 'bool-undefined',
-	'valuemax': 'number',
-	'valuemin': 'number',
-	'valuenow': 'number',
-	'valuetext': 'string',
-
-	// live
-	'atomic': 'bool',
-	'busy': 'bool',
-	'live': 'token',
-	'relevant': 'token-list',
-
-	// dragndrop
-	'dropeffect': 'token-list',
-	'grabbed': 'bool-undefined',
-
-	// relationship
-	'activedescendant': 'id',
-	'colcount': 'int',
-	'colindex': 'int',
-	'colspan': 'int',
-	'controls': 'id-list',
-	'describedby': 'id-list',
-	'details': 'id',
-	'errormessage': 'id',
-	'flowto': 'id-list',
-	'labelledby': 'id-list',
-	'owns': 'id-list',
-	'posinset': 'int',
 	'rowcount': 'int',
 	'rowindex': 'int',
 	'rowspan': 'int',
+	'selected': 'bool-undefined',
 	'setsize': 'int',
 	'sort': 'token',
+	'valuemax': 'number',
+	'valuemin': 'number',
+	'valuenow': 'number',
+	'valuetext': 'string',
 };
 
 exports.attributeStrongMapping = {
@@ -99,6 +93,7 @@ exports.roles = {
 	cell: {
 		selectors: ['td'],
 		childRoles: ['gridcell', 'rowheader'],
+		nameFromContents: true,
 	},
 	checkbox: {
 		selectors: ['input[type="checkbox"]'],
@@ -324,14 +319,14 @@ exports.roles = {
 		selectors: ['tr'],
 		nameFromContents: true,
 	},
-	rowheader: {
-		selectors: ['th[scope="row"]'],
-		nameFromContents: true,
-	},
 	rowgroup: {
 		selectors: ['tbody', 'thead', 'tfoot'],
 		nameFromContents: true,
 	},
+	rowheader: {
+		selectors: ['th[scope="row"]'],
+		nameFromContents: true,
+	},
 	scrollbar: {
 		defaults: {
 			'orientation': 'vertical',
@@ -388,13 +383,11 @@ exports.roles = {
 		childRoles: ['combobox', 'listbox', 'menu', 'radiogroup', 'tree'],
 	},
 	separator: {
+		// assume not focussable because <hr> is not
 		selectors: ['hr'],
 		childRoles: ['doc-pagebreak'],
 		defaults: {
 			'orientation': 'horizontal',
-			'valuemin': 0,
-			'valuemax': 100,
-			'valuenow': 50,
 		},
 	},
 	slider: {
@@ -422,12 +415,6 @@ exports.roles = {
 			'atomic': true,
 		},
 	},
-	switch: {
-		nameFromContents: true,
-		defaults: {
-			'checked': false,
-		},
-	},
 	structure: {
 		childRoles: [
 			'application',
@@ -440,6 +427,12 @@ exports.roles = {
 			'separator',
 		],
 	},
+	switch: {
+		nameFromContents: true,
+		defaults: {
+			'checked': false,
+		},
+	},
 	tab: {
 		nameFromContents: true,
 		defaults: {
@@ -494,7 +487,6 @@ exports.roles = {
 			'input',
 			'range',
 			'row',
-			'separator',
 			'tab',
 		],
 	},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aria-api",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "Access ARIA information from JavaScript",
   "main": "index.js",
   "keywords": [