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
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test ability to tab to and away from breadcrumbs using keyboard.
const TEST_URL = URL_ROOT + "doc_inspector_breadcrumbs.html";
/**
* Test data has the format of:
* {
* desc {String} description for better logging
* focused {Boolean} flag, indicating if breadcrumbs contain focus
* key {String} key event's key
* options {?Object} optional event data such as shiftKey, etc
* }
*/
const TEST_DATA = [
{
desc: "Move the focus away from breadcrumbs to a next focusable element",
focused: false,
key: "VK_TAB",
options: {},
},
{
desc: "Move the focus back to the breadcrumbs",
focused: true,
key: "VK_TAB",
options: { shiftKey: true },
},
{
desc:
"Move the focus back away from breadcrumbs to a previous focusable " +
"element",
focused: false,
key: "VK_TAB",
options: { shiftKey: true },
},
{
desc: "Move the focus back to the breadcrumbs",
focused: true,
key: "VK_TAB",
options: {},
},
];
add_task(async function () {
const { inspector } = await openInspectorForURL(TEST_URL);
const doc = inspector.panelDoc;
const { breadcrumbs } = inspector;
const { waitForHighlighterTypeShown } = getHighlighterTestHelpers(inspector);
await selectNode("#i2", inspector);
info("Clicking on the corresponding breadcrumbs node to focus it");
const container = doc.getElementById("inspector-breadcrumbs");
const button = container.querySelector("button[checked]");
const onHighlight = waitForHighlighterTypeShown(
inspector.highlighters.TYPES.BOXMODEL
);
button.click();
await onHighlight;
// Ensure a breadcrumb is focused.
is(doc.activeElement, container, "Focus is on selected breadcrumb");
is(
container.getAttribute("aria-activedescendant"),
button.id,
"aria-activedescendant is set correctly"
);
for (const { desc, focused, key, options } of TEST_DATA) {
info(desc);
EventUtils.synthesizeKey(key, options);
// Wait until the keyPromise promise resolves.
await breadcrumbs.keyPromise;
if (focused) {
is(doc.activeElement, container, "Focus is on selected breadcrumb");
} else {
ok(!containsFocus(doc, container), "Focus is outside of breadcrumbs");
}
is(
container.getAttribute("aria-activedescendant"),
button.id,
"aria-activedescendant is set correctly"
);
}
});
|
