Skip to content

Commit

Permalink
Merge branch 'develop' into aria-braille-equivalent
Browse files Browse the repository at this point in the history
  • Loading branch information
WilcoFiers committed Jul 31, 2023
2 parents c839ea6 + d417630 commit f4c7937
Show file tree
Hide file tree
Showing 17 changed files with 306 additions and 85 deletions.
3 changes: 2 additions & 1 deletion doc/rule-descriptions.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,10 @@
| Rule ID | Description | Impact | Tags | Issue Type | ACT Rules |
| :------------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------- | :---------------- | :--------------------------------------------------------------------------------------------------------------------------------- | :------------------------- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [area-alt](https://dequeuniversity.com/rules/axe/4.7/area-alt?application=RuleDescription) | Ensures <area> elements of image maps have alternate text | Critical | cat.text-alternatives, wcag2a, wcag244, wcag412, section508, section508.22.a, TTv5, TT6.a, EN-301-549, EN-9.2.4.4, EN-9.4.1.2, ACT | failure, needs review | [c487ae](https://act-rules.github.io/rules/c487ae) |
| [aria-allowed-attr](https://dequeuniversity.com/rules/axe/4.7/aria-allowed-attr?application=RuleDescription) | Ensures an element's role supports its ARIA attributes | Serious, Critical | cat.aria, wcag2a, wcag412, EN-301-549, EN-9.4.1.2 | failure, needs review | [5c01ea](https://act-rules.github.io/rules/5c01ea) |
| [aria-allowed-attr](https://dequeuniversity.com/rules/axe/4.7/aria-allowed-attr?application=RuleDescription) | Ensures an element's role supports its ARIA attributes | Critical | cat.aria, wcag2a, wcag412, EN-301-549, EN-9.4.1.2 | failure, needs review | [5c01ea](https://act-rules.github.io/rules/5c01ea) |
| [aria-braille-equivalent](https://dequeuniversity.com/rules/axe/4.7/aria-braille-equivalent?application=RuleDescription) | Ensure aria-braillelabel and aria-brailleroledescription have a non-braille equivalent | Serious | cat.aria, wcag2a, wcag412, EN-301-549, EN-9.4.1.2 | failure, needs review | |
| [aria-command-name](https://dequeuniversity.com/rules/axe/4.7/aria-command-name?application=RuleDescription) | Ensures every ARIA button, link and menuitem has an accessible name | Serious | cat.aria, wcag2a, wcag412, TTv5, TT6.a, EN-301-549, EN-9.4.1.2, ACT | failure, needs review | [97a4e1](https://act-rules.github.io/rules/97a4e1) |
| [aria-conditional-attr](https://dequeuniversity.com/rules/axe/4.7/aria-conditional-attr?application=RuleDescription) | Ensures ARIA attributes are used as described in the specification of the element's role | Serious | cat.aria, wcag2a, wcag412, EN-301-549, EN-9.4.1.2 | failure | [5c01ea](https://act-rules.github.io/rules/5c01ea) |
| [aria-deprecated-role](https://dequeuniversity.com/rules/axe/4.7/aria-deprecated-role?application=RuleDescription) | Ensures elements do not use deprecated roles | Minor | cat.aria, wcag2a, wcag412, EN-301-549, EN-9.4.1.2 | failure | [674b10](https://act-rules.github.io/rules/674b10) |
| [aria-hidden-body](https://dequeuniversity.com/rules/axe/4.7/aria-hidden-body?application=RuleDescription) | Ensures aria-hidden='true' is not present on the document body. | Critical | cat.aria, wcag2a, wcag412, EN-301-549, EN-9.4.1.2 | failure | |
| [aria-hidden-focus](https://dequeuniversity.com/rules/axe/4.7/aria-hidden-focus?application=RuleDescription) | Ensures aria-hidden elements are not focusable nor contain focusable elements | Serious | cat.name-role-value, wcag2a, wcag412, TTv5, TT6.a, EN-301-549, EN-9.4.1.2 | failure, needs review | [6cfa84](https://act-rules.github.io/rules/6cfa84) |
Expand Down
17 changes: 15 additions & 2 deletions lib/commons/dom/create-grid.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import { getNodeFromTree, getScroll, isShadowRoot } from '../../core/utils';
import constants from '../../core/constants';
import cache from '../../core/base/cache';
import assert from '../../core/utils/assert';
import getOverflowHiddenAncestors from './get-overflow-hidden-ancestors';
import { getIntersectionRect } from '../math';

const ROOT_LEVEL = 0;
const DEFAULT_LEVEL = 0.1;
Expand Down Expand Up @@ -392,11 +394,22 @@ function findScrollRegionParent(vNode, parentVNode) {
* @param {VirtualNode}
*/
function addNodeToGrid(grid, vNode) {
vNode.clientRects.forEach(rect => {
const overflowHiddenNodes = getOverflowHiddenAncestors(vNode);

vNode.clientRects.forEach(clientRect => {
// ignore any rects that are outside the bounds of overflow hidden ancestors
const visibleRect = overflowHiddenNodes.reduce((rect, overflowNode) => {
return rect && getIntersectionRect(rect, overflowNode.boundingClientRect);
}, clientRect);

if (!visibleRect) {
return;
}

// save a reference to where this element is in the grid so we
// can find it even if it's in a subgrid
vNode._grid ??= grid;
const gridRect = grid.getGridPositionOfRect(rect);
const gridRect = grid.getGridPositionOfRect(visibleRect);
grid.loopGridPosition(gridRect, gridCell => {
if (!gridCell.includes(vNode)) {
gridCell.push(vNode);
Expand Down
2 changes: 1 addition & 1 deletion lib/intro.stub
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/*! axe v<%= pkg.version %>
* Copyright (c) <%= grunt.template.today("yyyy") %> Deque Systems, Inc.
* Copyright (c) 2015 - <%= grunt.template.today("yyyy") %> Deque Systems, Inc.
*
* Your use of this Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
Expand Down
2 changes: 1 addition & 1 deletion lib/rules/aria-allowed-attr.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
"description": "Ensures an element's role supports its ARIA attributes",
"help": "Elements must only use supported ARIA attributes"
},
"all": ["aria-allowed-attr", "aria-conditional-attr"],
"all": ["aria-allowed-attr"],
"any": [],
"none": ["aria-unsupported-attr"]
}
13 changes: 13 additions & 0 deletions lib/rules/aria-conditional-attr.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{
"id": "aria-conditional-attr",
"matches": "aria-allowed-attr-matches",
"tags": ["cat.aria", "wcag2a", "wcag412", "EN-301-549", "EN-9.4.1.2"],
"actIds": ["5c01ea"],
"metadata": {
"description": "Ensures ARIA attributes are used as described in the specification of the element's role",
"help": "ARIA attributes must be used as specified for the element's role"
},
"all": ["aria-conditional-attr"],
"any": [],
"none": []
}
4 changes: 4 additions & 0 deletions locales/_template.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,10 @@
"description": "Ensures every ARIA button, link and menuitem has an accessible name",
"help": "ARIA commands must have an accessible name"
},
"aria-conditional-attr": {
"description": "Ensures ARIA attributes are used as described in the specification of the element's role",
"help": "ARIA attributes must be used as specified for the element's role"
},
"aria-deprecated-role": {
"description": "Ensures elements do not use deprecated roles",
"help": "Deprecated ARIA roles must not be used"
Expand Down
18 changes: 18 additions & 0 deletions test/commons/dom/create-grid.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,24 @@ describe('create-grid', () => {
]);
});

it('only adds the visible non-overflow area of large elements', () => {
const vNode = queryFixture(`
<div style="overflow: hidden; width: 300px; height: 300px;">
<span id="target" style="display: inline-block; width: 1000px; height: 1000px;">' +
'Hello world</span>
</div>
`);
createGrid();

const positions = findPositions(vNode._grid, vNode);
assert.deepEqual(positions, [
{ col: 0, row: 0 },
{ col: 1, row: 0 },
{ col: 0, row: 1 },
{ col: 1, row: 1 }
]);
});

describe('stackingOrder', () => {
it('adds stacking context information', () => {
fixture = fixtureSetup('<span>Hello world</span>');
Expand Down
45 changes: 45 additions & 0 deletions test/integration/full/contrast/memory.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Test Page</title>
<link
rel="stylesheet"
type="text/css"
href="/node_modules/mocha/mocha.css"
/>
<script src="/node_modules/mocha/mocha.js"></script>
<script src="/node_modules/chai/chai.js"></script>
<script src="/axe.js"></script>
<script>
mocha.setup({
timeout: 2000,
ui: 'bdd'
});
var assert = chai.assert;
</script>
<script src="/test/integration/no-ui-reporter.js"></script>
<style>
* {
box-sizing: border-box;
}
html,
body {
padding: 0;
margin: 0;
height: 100%;
background: #fff;
color: #000;
}
</style>
</head>
<body>
<div id="fixture">
<div style="overflow: hidden; width: 200px; height: 200px">
<!-- browsers each have their own CSS size limit so this number (which should be greater than the limit) will be capped to that -->
<div style="width: 1e9px; height: 1e9px">Hello World</div>
</div>
</div>
<script src="memory.js"></script>
<script src="/test/integration/adapter.js"></script>
</body>
</html>
18 changes: 18 additions & 0 deletions test/integration/full/contrast/memory.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
/*
Since we can't easily test for memory issue we'll assume that if this test doesn't time out then the memory issue isn't a problem
*/
describe('color-contrast memory test', () => {
describe('violations', () => {
it('should find none', done => {
axe.run(
'#fixture',
{ runOnly: { type: 'rule', values: ['color-contrast'] } },
(err, results) => {
assert.isNull(err);
assert.lengthOf(results.violations, 0);
done();
}
);
});
});
});
18 changes: 0 additions & 18 deletions test/integration/rules/aria-allowed-attr/failures.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,21 +9,3 @@
aria-orientation="horizontal"
id="fail5"
></audio>

<div role="table">
<div role="row" aria-expanded="false" id="fail6"></div>
<div role="row" aria-posinset="1" id="fail7"></div>
<div role="row" aria-setsize="10" id="fail8"></div>
<div role="row" aria-level="1" id="fail9"></div>
</div>

<div role="grid">
<div role="row" aria-expanded="false" id="fail10"></div>
<div role="row" aria-posinset="1" id="fail11"></div>
<div role="row" aria-setsize="10" id="fail12"></div>
<div role="row" aria-level="1" id="fail13"></div>
</div>

<input type="checkbox" aria-checked="mixed" id="fail14" />
<input type="checkbox" aria-checked="true" id="fail15" />
<input type="checkbox" aria-checked="false" checked id="fail16" />
19 changes: 1 addition & 18 deletions test/integration/rules/aria-allowed-attr/failures.json
Original file line number Diff line number Diff line change
@@ -1,22 +1,5 @@
{
"description": "aria-allowed-attr failing tests",
"rule": "aria-allowed-attr",
"violations": [
["#fail1"],
["#fail2"],
["#fail3"],
["#fail4"],
["#fail5"],
["#fail6"],
["#fail7"],
["#fail8"],
["#fail9"],
["#fail10"],
["#fail11"],
["#fail12"],
["#fail13"],
["#fail14"],
["#fail15"],
["#fail16"]
]
"violations": [["#fail1"], ["#fail2"], ["#fail3"], ["#fail4"], ["#fail5"]]
}
51 changes: 24 additions & 27 deletions test/integration/rules/aria-allowed-attr/passes.html
Original file line number Diff line number Diff line change
Expand Up @@ -2121,26 +2121,6 @@
<svg aria-label="value" id="pass89"></svg>
<video aria-label="value" id="pass90" controls></video>

<table role="treegrid">
<thead>
<tr>
<th>Col 1</th>
</tr>
</thead>
<tbody>
<tr
id="treegrid"
role="row"
aria-level="1"
aria-posinset="1"
aria-setsize="1"
aria-expanded="true"
>
<td role="gridcell">Treegrids are awesome</td>
</tr>
</tbody>
</table>

<div
id="pass91"
role="comment"
Expand All @@ -2151,11 +2131,28 @@
ok
</div>

<input type="checkbox" aria-checked="false" id="pass92" />
<input type="checkbox" aria-checked="true" checked id="pass93" />

<!-- Prohibited attributes fail in aria-prohibited-attr -->
<div role="caption" aria-label="value" id="pass94"></div>
<div role="caption" aria-labelledby="value" id="pass95"></div>
<div role="paragraph" aria-labelledby="value" id="pass96"></div>
<div role="strong" aria-label="value" id="pass97"></div>
<div role="caption" aria-label="value" id="pass92"></div>
<div role="caption" aria-labelledby="value" id="pass93"></div>
<div role="paragraph" aria-labelledby="value" id="pass94"></div>
<div role="strong" aria-label="value" id="pass95"></div>

<!-- Conditional ARIA attributes tested under aria-conditional-attr: -->
<div role="table">
<div role="row" aria-expanded="false" id="pass96"></div>
</div>
<table role="treegrid">
<tr
id="pass97"
role="row"
aria-level="1"
aria-posinset="1"
aria-setsize="1"
aria-expanded="true"
>
<td role="gridcell">Treegrids are awesome</td>
</tr>
</table>

<input type="checkbox" aria-checked="false" id="pass98" />
<input type="checkbox" aria-checked="mixed" id="pass99" />
5 changes: 3 additions & 2 deletions test/integration/rules/aria-allowed-attr/passes.json
Original file line number Diff line number Diff line change
Expand Up @@ -93,13 +93,14 @@
["#pass88"],
["#pass89"],
["#pass90"],
["#treegrid"],
["#pass91"],
["#pass92"],
["#pass93"],
["#pass94"],
["#pass95"],
["#pass96"],
["#pass97"]
["#pass97"],
["#pass98"],
["#pass99"]
]
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
<input type="checkbox" aria-checked="false" id="pass1" />
<input type="checkbox" aria-checked="true" checked id="pass2" />
<table role="treegrid">
<tr
id="pass3"
role="row"
aria-level="1"
aria-posinset="1"
aria-setsize="1"
aria-expanded="true"
>
<td role="gridcell">Treegrids are awesome</td>
</tr>
</table>

<div role="table">
<div role="row" aria-expanded="false" id="fail1"></div>
<div role="row" aria-posinset="1" id="fail2"></div>
<div role="row" aria-setsize="10" id="fail3"></div>
<div role="row" aria-level="1" id="fail4"></div>
</div>

<div role="grid">
<div role="row" aria-expanded="false" id="fail5"></div>
<div role="row" aria-posinset="1" id="fail6"></div>
<div role="row" aria-setsize="10" id="fail7"></div>
<div role="row" aria-level="1" id="fail8"></div>
</div>

<input type="checkbox" aria-checked="mixed" id="fail9" />
<input type="checkbox" aria-checked="true" id="fail10" />
<input type="checkbox" aria-checked="false" checked id="fail11" />
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{
"description": "aria-conditional-attr tests",
"rule": "aria-conditional-attr",
"passes": [["#pass1"], ["#pass2"], ["#pass3"]],
"violations": [
["#fail1"],
["#fail2"],
["#fail3"],
["#fail4"],
["#fail5"],
["#fail6"],
["#fail7"],
["#fail8"],
["#fail9"],
["#fail10"],
["#fail11"]
]
}
15 changes: 0 additions & 15 deletions test/integration/virtual-rules/aria-allowed-attr.js
Original file line number Diff line number Diff line change
Expand Up @@ -120,21 +120,6 @@ describe('aria-allowed-attr virtual-rule', function () {
assert.lengthOf(results.incomplete, 0);
});

it('fails when aria-checked is inconsistent with native checkbox state', () => {
var results = axe.runVirtualRule('aria-allowed-attr', {
nodeName: 'input',
checked: true,
attributes: {
type: 'checkbox',
'aria-checked': 'false'
}
});

assert.lengthOf(results.passes, 0);
assert.lengthOf(results.violations, 1);
assert.lengthOf(results.incomplete, 0);
});

it('should incomplete for non-global attributes and custom element', function () {
var results = axe.runVirtualRule('aria-allowed-attr', {
nodeName: 'custom-elm1',
Expand Down

0 comments on commit f4c7937

Please sign in to comment.