fix(aria-required-children): allow combobox to own a searchbox

lib/checks/aria/required-children.js

@@ -1,5 +1,6 @@
 const requiredOwned = axe.commons.aria.requiredOwned;
 const implicitNodes = axe.commons.aria.implicitNodes;
+const subclassImplicitNodes = axe.commons.aria.subclassImplicitNodes;
 const matchesSelector = axe.utils.matchesSelector;
 const idrefs = axe.commons.dom.idrefs;
 const reviewEmpty =
@@ -10,11 +11,15 @@ function owns(node, virtualTree, role, ariaOwned) {
 		return false;
 	}
 	var implicit = implicitNodes(role),
+		subclass = subclassImplicitNodes(role),
 		selector = ['[role="' + role + '"]'];
 
 	if (implicit) {
 		selector = selector.concat(implicit);
 	}
+	if (subclass) {
+		selector = selector.concat(subclass);
+	}
 
 	selector = selector.join(',');
 	return ariaOwned

lib/commons/aria/index.js

@@ -1732,6 +1732,7 @@ lookupTable.role = {
 		nameFrom: ['author'],
 		context: null,
 		implicit: ['input[type="search"]'],
+		superclassRole: 'textbox',
 		unsupported: false,
 		allowedElements: {
 			nodeName: 'input',

lib/commons/aria/subclass-implicit-nodes.js

@@ -0,0 +1,29 @@
+/* global aria */
+
+/**
+ * Get a list of CSS selectors of subclass nodes that have an implicit role
+ * @method subclassImplicitNodes
+ * @memberof axe.commons.aria
+ * @instance
+ * @param {String} role The role to check
+ * @return {Mixed} Either an Array of CSS selectors or `null` if there are none
+ */
+aria.subclassImplicitNodes = function(role) {
+	const roles = aria.lookupTable.role;
+	let subclassRoles = [];
+
+	for (const roleName in roles) {
+		if (roles[roleName].superclassRole === role) {
+			const implicit = aria.implicitNodes(roleName);
+			if (implicit) {
+				subclassRoles = subclassRoles.concat(implicit);
+			}
+		}
+	}
+
+	if (subclassRoles.length > 0) {
+		return subclassRoles;
+	}
+
+	return null;
+};

test/checks/aria/required-children.js

@@ -287,6 +287,15 @@ describe('aria-required-children', function() {
 		);
 	});
 
+	it('should pass role comboxbox when child is native "search" input type', function() {
+		var params = checkSetup(
+			'<div role="combobox" id="target"><input type="search"><p role="listbox">Textbox</p></div>'
+		);
+		assert.isTrue(
+			checks['aria-required-children'].evaluate.apply(checkContext, params)
+		);
+	});
+
 	describe('options', function() {
 		it('should return undefined instead of false when the role is in options.reviewEmpty', function() {
 			var params = checkSetup('<div role="grid" id="target"></div>');

test/commons/aria/subclass-implicit-nodes.js

@@ -0,0 +1,60 @@
+describe('aria.subclassImplicitNodes', function() {
+	'use strict';
+
+	var orig = axe.commons.aria.lookupTable.role;
+	afterEach(function() {
+		axe.commons.aria.lookupTable.role = orig;
+	});
+
+	it('should return an array of implicit CSS selectors', function() {
+		axe.commons.aria.lookupTable.role = {
+			trains: {
+				superclassRole: 'planes',
+				implicit: ['[class=trains]']
+			}
+		};
+
+		var subclassRoles = axe.commons.aria.subclassImplicitNodes('planes');
+		assert.deepEqual(subclassRoles, ['[class=trains]']);
+	});
+
+	it('should return CSS selectors for all subclass roles', function() {
+		axe.commons.aria.lookupTable.role = {
+			trains: {
+				superclassRole: 'planes',
+				implicit: ['[class=trains]']
+			},
+			automobiles: {
+				superclassRole: 'planes',
+				implicit: ['[class=automobiles]']
+			}
+		};
+
+		var subclassRoles = axe.commons.aria.subclassImplicitNodes('planes');
+		assert.deepEqual(subclassRoles, ['[class=trains]', '[class=automobiles]']);
+	});
+
+	it("should not add roles that don't have implicit nodes", function() {
+		axe.commons.aria.lookupTable.role = {
+			trains: {
+				superclassRole: 'planes'
+			},
+			automobiles: {
+				superclassRole: 'planes',
+				implicit: ['[class=automobiles]']
+			}
+		};
+
+		var subclassRoles = axe.commons.aria.subclassImplicitNodes('planes');
+		assert.deepEqual(subclassRoles, ['[class=automobiles]']);
+	});
+
+	it('should return null if the role does not have a subclass role', function() {
+		axe.commons.aria.lookupTable.role = {
+			planes: {}
+		};
+
+		var subclassRoles = axe.commons.aria.subclassImplicitNodes('planes');
+		assert.isNull(subclassRoles);
+	});
+});