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
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
|
/* Any copyright is dedicated to the Public Domain.
* http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
/* global toggleRow, toggleMenuItem, TREE_FILTERS_MENU_ID */
const TEST_URI = `<html>
<head>
<meta charset="utf-8"/>
<title>Accessibility Panel Test</title>
</head>
<body>
<h1 style="color:rgba(255,0,0,0.1); background-color:rgba(255,255,255,1);">
Top level header
</h1>
<h2 style="color:rgba(0,255,0,0.1); background-color:rgba(255,255,255,1);">
Second level header
</h2>
</body>
</html>`;
/**
* Test data has the format of:
* {
* desc {String} description for better logging
* setup {Function} An optional setup that needs to be performed before
* the state of the tree and the sidebar can be checked.
* expected {JSON} An expected states for the tree and the sidebar.
* }
*/
const tests = [
{
desc: "Expand first and second tree nodes.",
setup: async ({ doc }) => {
await toggleRow(doc, 0);
await toggleRow(doc, 1);
},
expected: {
tree: [
{
role: "document",
name: `"Accessibility Panel Test"`,
level: 1,
},
{
role: "heading",
name: `"Top level header"`,
level: 2,
},
{
role: "text leaf",
name: `"Top level header "contrast`,
badges: ["contrast"],
level: 3,
},
{
role: "heading",
name: `"Second level header"`,
level: 2,
},
],
},
},
{
desc: "Click on the all filter.",
setup: async ({ doc, toolbox }) => {
await toggleMenuItem(doc, toolbox.doc, TREE_FILTERS_MENU_ID, 1);
},
expected: {
tree: [
{
role: "text leaf",
name: `"Top level header "contrast`,
badges: ["contrast"],
level: 1,
},
{
role: "text leaf",
name: `"Second level header "contrast`,
badges: ["contrast"],
selected: true,
level: 1,
},
],
},
},
{
desc: "Click on the all filter again.",
setup: async ({ doc, toolbox }) => {
await toggleMenuItem(doc, toolbox.doc, TREE_FILTERS_MENU_ID, 1);
},
expected: {
tree: [
{
role: "document",
name: `"Accessibility Panel Test"`,
level: 1,
},
{
role: "heading",
name: `"Top level header"`,
level: 2,
},
{
role: "text leaf",
name: `"Top level header "contrast`,
badges: ["contrast"],
level: 3,
},
{
role: "heading",
name: `"Second level header"`,
level: 2,
},
{
role: "text leaf",
name: `"Second level header "contrast`,
badges: ["contrast"],
selected: true,
level: 3,
},
],
},
},
];
/**
* Simple test that checks content of the Accessibility panel tree when one of
* the tree rows has a "contrast" badge and auditing is activated via toolbar
* filter.
*/
addA11yPanelTestsTask(
tests,
TEST_URI,
"Test Accessibility panel tree with contrast badge present."
);
|
