Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(aria-required-children): fail for children which are not listed as required #3597

Merged
merged 8 commits into from
Aug 18, 2022
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 24 additions & 7 deletions lib/checks/aria/aria-required-children-evaluate.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,8 @@ import {
getExplicitRole,
getOwnedVirtual
} from '../../commons/aria';
import { hasContentVirtual, idrefs } from '../../commons/dom';
import { getGlobalAriaAttrs } from '../../commons/standards';
import { hasContentVirtual, idrefs, isFocusable } from '../../commons/dom';

/**
* Get all owned roles of an element
Expand All @@ -16,18 +17,24 @@ function getOwnedRoles(virtualNode, required) {
const ownedElement = ownedElements[i];
const role = getRole(ownedElement, { noPresentational: true });

const hasGlobalAria = getGlobalAriaAttrs().some(attr =>
ownedElement.hasAttr(attr)
);
const includedInAccessibilityTree =
straker marked this conversation as resolved.
Show resolved Hide resolved
hasGlobalAria || isFocusable(ownedElement);
straker marked this conversation as resolved.
Show resolved Hide resolved

// if owned node has no role or is presentational, or if role
// allows group or rowgroup, we keep parsing the descendant tree.
// this means intermediate roles between a required parent and
// child will fail the check
if (
!role ||
(!role && !includedInAccessibilityTree) ||
straker marked this conversation as resolved.
Show resolved Hide resolved
(['group', 'rowgroup'].includes(role) &&
required.some(requiredRole => requiredRole === role))
) {
ownedElements.push(...ownedElement.children);
} else if (role) {
ownedRoles.push(role);
} else if (role || includedInAccessibilityTree) {
straker marked this conversation as resolved.
Show resolved Hide resolved
ownedRoles.push({ role, ownedElement });
}
}

Expand All @@ -39,10 +46,10 @@ function getOwnedRoles(virtualNode, required) {
*/
function missingRequiredChildren(virtualNode, role, required, ownedRoles) {
for (let i = 0; i < ownedRoles.length; i++) {
var ownedRole = ownedRoles[i];
const { role } = ownedRoles[i];

if (required.includes(ownedRole)) {
required = required.filter(requiredRole => requiredRole !== ownedRole);
if (required.includes(role)) {
required = required.filter(requiredRole => requiredRole !== role);
return null;
}
}
Expand Down Expand Up @@ -74,6 +81,16 @@ function ariaRequiredChildrenEvaluate(node, options, virtualNode) {
}

const ownedRoles = getOwnedRoles(virtualNode, required);
const unallowed = ownedRoles.filter(({ role }) => !required.includes(role));

if (unallowed.length) {
this.relatedNodes(unallowed.map(({ ownedElement }) => ownedElement));
this.data({
messageKey: 'unallowed'
});
return false;
}

const missing = missingRequiredChildren(
virtualNode,
role,
Expand Down
3 changes: 2 additions & 1 deletion lib/checks/aria/aria-required-children.json
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,8 @@
"pass": "Required ARIA children are present",
"fail": {
"singular": "Required ARIA child role not present: ${data.values}",
"plural": "Required ARIA children role not present: ${data.values}"
"plural": "Required ARIA children role not present: ${data.values}",
"unallowed": "Element has children which are not allowed"
straker marked this conversation as resolved.
Show resolved Hide resolved
},
"incomplete": {
"singular": "Expecting ARIA child role to be added: ${data.values}",
Expand Down
Loading