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
96
97
98
99
100
101
102
103
104
105
|
<!DOCTYPE HTML>
<!-- Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ -->
<html>
<head>
<title>Test Panel Item Accesskey Support</title>
<script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
<script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
<script type="text/javascript" src="head.js"></script>
<link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
</head>
<body>
<p id="display"></p>
<div id="content">
<panel-list>
<panel-item accesskey="F">First item</panel-item>
<panel-item accesskey="S">Second item</panel-item>
<panel-item>Third item</panel-item>
</panel-list>
</div>
<pre id="test">
<script class="testbody" type="application/javascript">
const {BrowserTestUtils} = ChromeUtils.importESModule("resource://testing-common/BrowserTestUtils.sys.mjs");
add_task(async function testAccessKey() {
function assertAccessKeys(items, keys, { checkLabels = false } = {}) {
is(items.length, keys.length, "Got the same number of items and keys");
for (let i = 0; i < items.length; i++) {
is(items[i].accessKey, keys[i], `Item ${i} has the right key`);
if (checkLabels) {
let label = items[i].shadowRoot.querySelector("label");
is(label.accessKey, keys[i] || null, `Label ${i} has the right key`);
}
}
}
let panelList = document.querySelector("panel-list");
let panelItems = [...panelList.children];
info("Accesskeys should be removed when closed");
assertAccessKeys(panelItems, ["", "", ""]);
info("Accesskeys should be set when open");
let panelShown = BrowserTestUtils.waitForEvent(panelList, "shown");
panelList.show();
await panelShown;
assertAccessKeys(panelItems, ["F", "S", ""], { checkLabels: true });
info("Changing accesskeys should happen right away");
panelItems[1].accessKey = "c";
panelItems[2].accessKey = "T";
assertAccessKeys(panelItems, ["F", "c", "T"], { checkLabels: true });
info("Accesskeys are removed again on hide");
let panelHidden = BrowserTestUtils.waitForEvent(panelList, "hidden");
panelList.hide();
await panelHidden;
assertAccessKeys(panelItems, ["", "", ""]);
info("Accesskeys are set again on show");
panelItems[0].removeAttribute("accesskey");
panelShown = BrowserTestUtils.waitForEvent(panelList, "shown");
panelList.show();
await panelShown;
assertAccessKeys(panelItems, ["", "c", "T"], { checkLabels: true });
info("Check that accesskeys can be used without the modifier when open");
let secondClickCount = 0;
let thirdClickCount = 0;
panelItems[1].addEventListener("click", () => secondClickCount++);
panelItems[2].addEventListener("click", () => thirdClickCount++);
// Make sure the focus is in the window.
panelItems[0].focus();
panelHidden = BrowserTestUtils.waitForEvent(panelList, "hidden");
synthesizeKey("c", {});
await panelHidden;
is(secondClickCount, 1, "The accesskey worked unmodified");
is(thirdClickCount, 0, "The other listener wasn't fired");
synthesizeKey("c", {});
synthesizeKey("t", {});
is(secondClickCount, 1, "The key doesn't trigger when closed");
is(thirdClickCount, 0, "The key doesn't trigger when closed");
panelShown = BrowserTestUtils.waitForEvent(panelList, "shown");
panelList.show();
await panelShown;
panelHidden = BrowserTestUtils.waitForEvent(panelList, "hidden");
synthesizeKey("t", {});
await panelHidden;
is(secondClickCount, 1, "The other listener wasn't fired");
is(thirdClickCount, 1, "The accesskey worked unmodified");
});
</script>
</pre>
</body>
</html>
|
