accessible/tests/mochitest/events/test_aria_menu.html

changeset 0
6474c204b198
equal deleted inserted replaced
-1:000000000000 0:d68d3bc9c5a4
1 <html>
2
3 <head>
4 <title>ARIA menu events testing</title>
5
6 <link rel="stylesheet" type="text/css"
7 href="chrome://mochikit/content/tests/SimpleTest/test.css" />
8
9 <script type="application/javascript"
10 src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
11 <script type="application/javascript"
12 src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
13
14 <script type="application/javascript"
15 src="../common.js"></script>
16 <script type="application/javascript"
17 src="../role.js"></script>
18 <script type="application/javascript"
19 src="../states.js"></script>
20 <script type="application/javascript"
21 src="../events.js"></script>
22
23 <script type="application/javascript">
24 const kViaDisplayStyle = 0;
25 const kViaVisibilityStyle = 1;
26
27 function focusMenu(aMenuBarID, aMenuID, aActiveMenuBarID)
28 {
29 this.eventSeq = [];
30
31 if (aActiveMenuBarID) {
32 this.eventSeq.push(new invokerChecker(EVENT_MENU_END,
33 getNode(aActiveMenuBarID)));
34 }
35
36 this.eventSeq.push(new invokerChecker(EVENT_MENU_START, getNode(aMenuBarID)));
37 this.eventSeq.push(new invokerChecker(EVENT_FOCUS, getNode(aMenuID)));
38
39 this.invoke = function focusMenu_invoke()
40 {
41 getNode(aMenuID).focus();
42 }
43
44 this.getID = function focusMenu_getID()
45 {
46 return "focus menu '" + aMenuID + "'";
47 }
48 }
49
50 function showMenu(aMenuID, aParentMenuID, aHow)
51 {
52 this.menuNode = getNode(aMenuID);
53
54 this.eventSeq = [
55 new invokerChecker(EVENT_SHOW, this.menuNode),
56 new invokerChecker(EVENT_MENUPOPUP_START, this.menuNode),
57 new invokerChecker(EVENT_REORDER, getNode(aParentMenuID))
58 ];
59
60 this.invoke = function showMenu_invoke()
61 {
62 if (aHow == kViaDisplayStyle)
63 this.menuNode.style.display = "block";
64 else
65 this.menuNode.style.visibility = "visible";
66 };
67
68 this.getID = function showMenu_getID()
69 {
70 return "Show ARIA menu '" + aMenuID + "' by " +
71 (aHow == kViaDisplayStyle ? "display" : "visibility") +
72 " style tricks";
73 };
74 }
75
76 function closeMenu(aMenuID, aParentMenuID, aHow)
77 {
78 this.menuNode = getNode(aMenuID);
79 this.menu = null;
80
81 this.eventSeq = [
82 new invokerChecker(EVENT_MENUPOPUP_END, getMenu, this),
83 new invokerChecker(EVENT_HIDE, getMenu, this),
84 new invokerChecker(EVENT_REORDER, getNode(aParentMenuID))
85 ];
86
87 this.invoke = function closeMenu_invoke()
88 {
89 // Store menu accessible reference while menu is still open.
90 this.menu = getAccessible(this.menuNode);
91
92 // Hide menu.
93 if (aHow == kViaDisplayStyle)
94 this.menuNode.style.display = "none";
95 else
96 this.menuNode.style.visibility = "hidden";
97 }
98
99 this.getID = function closeMenu_getID()
100 {
101 return "Close ARIA menu " + aMenuID + " by " +
102 (aHow == kViaDisplayStyle ? "display" : "visibility") +
103 " style tricks";
104 }
105
106 function getMenu(aThisObj)
107 {
108 return aThisObj.menu;
109 }
110 }
111
112 function focusInsideMenu(aMenuID, aMenuBarID)
113 {
114 this.eventSeq = [
115 new invokerChecker(EVENT_FOCUS, getNode(aMenuID))
116 ];
117
118 this.unexpectedEventSeq = [
119 new invokerChecker(EVENT_MENU_END, getNode(aMenuBarID))
120 ];
121
122 this.invoke = function focusInsideMenu_invoke()
123 {
124 getNode(aMenuID).focus();
125 }
126
127 this.getID = function focusInsideMenu_getID()
128 {
129 return "focus menu '" + aMenuID + "'";
130 }
131 }
132
133 function blurMenu(aMenuBarID)
134 {
135 var eventSeq = [
136 new invokerChecker(EVENT_MENU_END, getNode(aMenuBarID)),
137 new invokerChecker(EVENT_FOCUS, getNode("outsidemenu"))
138 ];
139
140 this.__proto__ = new synthClick("outsidemenu", eventSeq);
141
142 this.getID = function blurMenu_getID()
143 {
144 return "blur menu";
145 }
146 }
147
148 ////////////////////////////////////////////////////////////////////////////
149 // Do tests
150
151 var gQueue = null;
152
153 //gA11yEventDumpToConsole = true; // debuging
154
155 function doTests()
156 {
157 gQueue = new eventQueue();
158
159 gQueue.push(new focusMenu("menubar2", "menu-help"));
160 gQueue.push(new focusMenu("menubar", "menu-file", "menubar2"));
161 gQueue.push(new showMenu("menupopup-file", "menu-file", kViaDisplayStyle));
162 gQueue.push(new closeMenu("menupopup-file", "menu-file", kViaDisplayStyle));
163 gQueue.push(new showMenu("menupopup-edit", "menu-edit", kViaVisibilityStyle));
164 gQueue.push(new closeMenu("menupopup-edit", "menu-edit", kViaVisibilityStyle));
165 gQueue.push(new focusInsideMenu("menu-edit", "menubar"));
166 gQueue.push(new blurMenu("menubar"));
167
168 gQueue.push(new focusMenu("menubar3", "mb3-mi-outside"));
169 gQueue.push(new showMenu("mb4-menu", document, kViaDisplayStyle));
170 gQueue.push(new focusMenu("menubar4", "mb4-item1"));
171 gQueue.push(new focusMenu("menubar5", "mb5-mi"));
172
173 gQueue.push(new synthFocus("mi6"));
174
175 gQueue.invoke(); // Will call SimpleTest.finish();
176 }
177
178 SimpleTest.waitForExplicitFinish();
179 addA11yLoadEvent(doTests);
180 </script>
181 </head>
182
183 <body>
184
185 <a target="_blank"
186 href="https://bugzilla.mozilla.org/show_bug.cgi?id=606207"
187 title="Dojo dropdown buttons are broken">
188 Bug 606207
189 </a>
190 <a target="_blank"
191 href="https://bugzilla.mozilla.org/show_bug.cgi?id=614829"
192 title="Menupopup end event isn't fired for ARIA menus">
193 Bug 614829
194 </a>
195 <a target="_blank"
196 href="https://bugzilla.mozilla.org/show_bug.cgi?id=615189"
197 title="Clean up FireAccessibleFocusEvent">
198 Bug 615189
199 </a>
200 <a target="_blank"
201 href="https://bugzilla.mozilla.org/show_bug.cgi?id=673958"
202 title="Rework accessible focus handling">
203 Bug 673958
204 </a>
205 <a target="_blank"
206 href="https://bugzilla.mozilla.org/show_bug.cgi?id=933322"
207 title="menustart/end events are missing when aria-owns makes a menu hierarchy">
208 Bug 933322
209 </a>
210 <a target="_blank"
211 href="https://bugzilla.mozilla.org/show_bug.cgi?id=934460"
212 title="menustart/end events may be missed when top level menuitem is focused">
213 Bug 934460
214 </a>
215 <a target="_blank"
216 href="https://bugzilla.mozilla.org/show_bug.cgi?id=970005"
217 title="infinite long loop in a11y:FocusManager::ProcessFocusEvent">
218 Bug 970005
219 </a>
220
221 <p id="display"></p>
222 <div id="content" style="display: none"></div>
223 <pre id="test">
224 </pre>
225
226 <div id="menubar" role="menubar">
227 <div id="menu-file" role="menuitem" tabindex="0">
228 File
229 <div id="menupopup-file" role="menu" style="display: none;">
230 <div id="menuitem-newtab" role="menuitem" tabindex="0">New Tab</div>
231 <div id="menuitem-newwindow" role="menuitem" tabindex="0">New Window</div>
232 </div>
233 </div>
234 <div id="menu-edit" role="menuitem" tabindex="0">
235 Edit
236 <div id="menupopup-edit" role="menu" style="visibility: hidden;">
237 <div id="menuitem-undo" role="menuitem" tabindex="0">Undo</div>
238 <div id="menuitem-redo" role="menuitem" tabindex="0">Redo</div>
239 </div>
240 </div>
241 </div>
242 <div id="menubar2" role="menubar">
243 <div id="menu-help" role="menuitem" tabindex="0">
244 Help
245 <div id="menupopup-help" role="menu" style="display: none;">
246 <div id="menuitem-about" role="menuitem" tabindex="0">About</div>
247 </div>
248 </div>
249 </div>
250 <div tabindex="0" id="outsidemenu">outsidemenu</div>
251
252 <!-- aria-owns relations -->
253 <div id="menubar3" role="menubar" aria-owns="mb3-mi-outside"></div>
254 <div id="mb3-mi-outside" role="menuitem" tabindex="0">Outside</div>
255
256 <div id="menubar4" role="menubar">
257 <div role="menuitem" aria-haspopup="true" aria-owns="mb4-menu">Item</div>
258 </div>
259 <div id="mb4-menu" role="menu" style="display:none;">
260 <div role="menuitem" id="mb4-item1" tabindex="0">Item 1.1</div>
261 <div role="menuitem" tabindex="0">Item 1.2</div>
262 </div>
263
264 <!-- focus top-level menu item having haspopup -->
265 <div id="menubar5" role="menubar">
266 <div role="menuitem" aria-haspopup="true" id="mb5-mi" tabindex="0">
267 Item
268 <div role="menu" style="display:none;">
269 <div role="menuitem" tabindex="0">Item 1.1</div>
270 <div role="menuitem" tabindex="0">Item 1.2</div>
271 </div>
272 </div>
273 </div>
274
275 <!-- other aria-owns relations -->
276 <div id="mi6" tabindex="0" role="menuitem">aria-owned item</div>
277 <div aria-owns="mi6">Obla</div>
278
279 <div id="eventdump"></div>
280
281 </body>
282 </html>

mercurial