1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
|
<html>
<head>
<title>Test removal of focused accessible</title>
<link rel="stylesheet" type="text/css"
href="chrome://mochikit/content/tests/SimpleTest/test.css" />
<script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
<script type="application/javascript"
src="../common.js"></script>
<script type="application/javascript"
src="../promisified-events.js"></script>
<script type="application/javascript">
async function setFocus(aNodeToFocus, aExpectedFocus) {
let expected = aExpectedFocus || aNodeToFocus;
let focused = waitForEvent(EVENT_FOCUS, expected);
info("Focusing " + aNodeToFocus.id);
aNodeToFocus.focus();
await focused;
ok(true, expected.id + " focused after " +
aNodeToFocus.id + ".focus()");
}
async function expectFocusAfterRemove(aNodeToRemove, aExpectedFocus, aDisplayNone = false) {
let focused = waitForEvent(EVENT_FOCUS, aExpectedFocus);
info("Removing " + aNodeToRemove.id);
if (aDisplayNone) {
aNodeToRemove.style.display = "none";
} else {
aNodeToRemove.remove();
}
await focused;
let friendlyExpected = aExpectedFocus == document ?
"document" : aExpectedFocus.id;
ok(true, friendlyExpected + " focused after " +
aNodeToRemove.id + " removed");
}
async function doTests() {
info("Testing removal of focused node itself");
let button = getNode("button");
await setFocus(button);
await expectFocusAfterRemove(button, document);
info("Testing removal of focused node's parent");
let dialog = getNode("dialog");
let dialogButton = getNode("dialogButton");
await setFocus(dialogButton);
await expectFocusAfterRemove(dialog, document);
info("Testing removal of aria-activedescendant target");
let listbox = getNode("listbox");
let option = getNode("option");
await setFocus(listbox, option);
await expectFocusAfterRemove(option, listbox);
info("Test hiding focused element with display: none");
let groupingButton = getNode("groupingButton");
await setFocus(groupingButton);
await expectFocusAfterRemove(groupingButton, document, true);
SimpleTest.finish();
}
SimpleTest.waitForExplicitFinish();
addA11yLoadEvent(doTests);
</script>
</head>
<body>
<p id="display"></p>
<div id="content" style="display: none"></div>
<pre id="test">
</pre>
<button id="button"></button>
<div role="dialog" id="dialog">
<button id="dialogButton"></button>
</div>
<div role="listbox" id="listbox" tabindex="0" aria-activedescendant="option">
<div role="option" id="option"></div>
</div>
<div role="grouping" id="grouping">
<button id="groupingButton">
</div>
</body>
</html>
|
