Skip to content

Commit 0afa4bd

Browse files
nami8824nami8824
committed
fix(landmark-unique): match section/form with explicit landmark role without label
1 parent 342d816 commit 0afa4bd

3 files changed

Lines changed: 30 additions & 24 deletions

File tree

‎lib/rules/landmark-unique-matches.js‎

Lines changed: 3 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,9 @@
1+
import { getRoleType } from '../commons/aria';
12
import { isVisibleToScreenReaders } from '../commons/dom';
2-
import { getRole } from '../commons/aria';
3-
import { getAriaRolesByType } from '../commons/standards';
4-
import { accessibleTextVirtual } from '../commons/text';
53

64
export default function landmarkUniqueMatches(node, virtualNode) {
75
return (
8-
isLandmarkVirtual(virtualNode) && isVisibleToScreenReaders(virtualNode)
6+
getRoleType(virtualNode) === 'landmark' &&
7+
isVisibleToScreenReaders(virtualNode)
98
);
109
}
11-
12-
function isLandmarkVirtual(vNode) {
13-
const landmarkRoles = getAriaRolesByType('landmark');
14-
const role = getRole(vNode);
15-
if (!role) {
16-
return false;
17-
}
18-
19-
const { nodeName } = vNode.props;
20-
const isLandmarkRole = landmarkRoles.includes(role);
21-
22-
if (nodeName === 'section' || nodeName === 'form') {
23-
return isLandmarkRole && !!accessibleTextVirtual(vNode);
24-
}
25-
26-
return isLandmarkRole;
27-
}

‎test/integration/rules/landmark-unique/landmark-unique-fail.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -98,8 +98,8 @@
9898
<div id="violation-role-region" role="region"></div>
9999
<div id="violation-role-region-2" role="region"></div>
100100

101-
<div id="violation-role-search" role="search"></div>
102-
<div id="violation-role-search-2" role="search"></div>
101+
<form id="violation-role-search" role="search"></form>
102+
<form id="violation-role-search-2" role="search"></form>
103103

104104
<nav id="violation-nav" aria-label="duplicate label for nav"></nav>
105105
<nav id="violation-nav-2" aria-label="duplicate label for nav"></nav>

‎test/rule-matches/landmark-unique-matches.js‎

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ describe('landmark-unique-matches', function () {
3939
assert.isFalse(rule.matches(node, virtualNode));
4040
});
4141

42-
describe('form and section elements must be landmarks with accessible names to be matched', function () {
42+
describe('form and section elements match as landmarks conditionally based on accessible name and role', function () {
4343
const sectionFormElements = ['section', 'form'];
4444

4545
sectionFormElements.forEach(function (elementType) {
@@ -85,6 +85,30 @@ describe('landmark-unique-matches', function () {
8585
}
8686
);
8787

88+
it(
89+
'should match because it is a ' +
90+
elementType +
91+
' with an explicit landmark role but no label',
92+
function () {
93+
const explicitRole =
94+
elementType === 'section' ? 'navigation' : 'search';
95+
axeFixtureSetup(
96+
'<' +
97+
elementType +
98+
' role="' +
99+
explicitRole +
100+
'">some ' +
101+
elementType +
102+
'</' +
103+
elementType +
104+
'>'
105+
);
106+
const node = fixture.querySelector(elementType);
107+
const virtualNode = axe.utils.getNodeFromTree(axe._tree[0], node);
108+
assert.isTrue(rule.matches(node, virtualNode));
109+
}
110+
);
111+
88112
it(
89113
'should not match because it is a ' + elementType + ' without a label',
90114
function () {

0 commit comments

Comments
 (0)