accessible/tests/mochitest/jsat/test_live_regions.html@6474c204b198 (annotated)
accessible/tests/mochitest/jsat/test_live_regions.html
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rw-r--r--
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
| michael@0 | 1 | <html> |
| michael@0 | 2 | |
| michael@0 | 3 | <head> |
| michael@0 | 4 | <title>AccessFu tests for live regions support</title> |
| michael@0 | 5 | |
| michael@0 | 6 | <link rel="stylesheet" type="text/css" |
| michael@0 | 7 | href="chrome://mochikit/content/tests/SimpleTest/test.css" /> |
| michael@0 | 8 | <script type="application/javascript" |
| michael@0 | 9 | src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> |
| michael@0 | 10 | <script type="application/javascript" |
| michael@0 | 11 | src="../common.js"></script> |
| michael@0 | 12 | <script type="application/javascript" |
| michael@0 | 13 | src="./jsatcommon.js"></script> |
| michael@0 | 14 | <script type="application/javascript"> |
| michael@0 | 15 | |
| michael@0 | 16 | function startAccessFu() { |
| michael@0 | 17 | SpecialPowers.setIntPref("accessibility.accessfu.activate", 1); |
| michael@0 | 18 | AccessFuTest.once_log("EventManager.start", AccessFuTest.nextTest); |
| michael@0 | 19 | } |
| michael@0 | 20 | |
| michael@0 | 21 | function stopAccessFu() { |
| michael@0 | 22 | SpecialPowers.setIntPref("accessibility.accessfu.activate", 0); |
| michael@0 | 23 | AccessFuTest.once_log("EventManager.stop", AccessFuTest.finish); |
| michael@0 | 24 | } |
| michael@0 | 25 | |
| michael@0 | 26 | function hide(id) { |
| michael@0 | 27 | var element = document.getElementById(id); |
| michael@0 | 28 | element.style.display = "none"; |
| michael@0 | 29 | } |
| michael@0 | 30 | |
| michael@0 | 31 | function show(id) { |
| michael@0 | 32 | var element = document.getElementById(id); |
| michael@0 | 33 | element.style.display = "block"; |
| michael@0 | 34 | } |
| michael@0 | 35 | |
| michael@0 | 36 | function udpate(id, text, property) { |
| michael@0 | 37 | var element = document.getElementById(id); |
| michael@0 | 38 | element[property] = text; |
| michael@0 | 39 | } |
| michael@0 | 40 | |
| michael@0 | 41 | function updateText(id, text) { |
| michael@0 | 42 | udpate(id, text, "textContent"); |
| michael@0 | 43 | } |
| michael@0 | 44 | |
| michael@0 | 45 | function updateHTML(id, text) { |
| michael@0 | 46 | udpate(id, text, "innerHTML"); |
| michael@0 | 47 | } |
| michael@0 | 48 | |
| michael@0 | 49 | var tests = [{ |
| michael@0 | 50 | expected: [{ |
| michael@0 | 51 | "method": "speak", |
| michael@0 | 52 | "data": "hidden I will be hidden", |
| michael@0 | 53 | "options": { |
| michael@0 | 54 | "enqueue": true |
| michael@0 | 55 | } |
| michael@0 | 56 | }], |
| michael@0 | 57 | action: function action() { |
| michael@0 | 58 | [hide(id) for (id of ["to_hide1", "to_hide2", "to_hide3", "to_hide4"])]; |
| michael@0 | 59 | } |
| michael@0 | 60 | }, { |
| michael@0 | 61 | expected: [{ |
| michael@0 | 62 | "method": "speak", |
| michael@0 | 63 | "data": "hidden I will be hidden", |
| michael@0 | 64 | "options": { |
| michael@0 | 65 | "enqueue": true |
| michael@0 | 66 | } |
| michael@0 | 67 | }], |
| michael@0 | 68 | action: function action() { |
| michael@0 | 69 | [hide(id) for (id of ["to_hide_descendant1", "to_hide_descendant2", |
| michael@0 | 70 | "to_hide_descendant3", "to_hide_descendant4"])]; |
| michael@0 | 71 | } |
| michael@0 | 72 | }, { |
| michael@0 | 73 | expected: [{ |
| michael@0 | 74 | "method": "speak", |
| michael@0 | 75 | "data": "I will be shown", |
| michael@0 | 76 | "options": { |
| michael@0 | 77 | "enqueue": true |
| michael@0 | 78 | } |
| michael@0 | 79 | }], |
| michael@0 | 80 | action: function action() { |
| michael@0 | 81 | [show(id) for (id of ["to_show1", "to_show2", "to_show3", "to_show4"])]; |
| michael@0 | 82 | } |
| michael@0 | 83 | }, { |
| michael@0 | 84 | expected: [{ |
| michael@0 | 85 | "method": "speak", |
| michael@0 | 86 | "data": "I will be shown", |
| michael@0 | 87 | "options": { |
| michael@0 | 88 | "enqueue": true |
| michael@0 | 89 | } |
| michael@0 | 90 | }], |
| michael@0 | 91 | action: function action() { |
| michael@0 | 92 | [show(id) for (id of ["to_show_descendant1", "to_show_descendant2", |
| michael@0 | 93 | "to_show_descendant3", "to_show_descendant4"])]; |
| michael@0 | 94 | } |
| michael@0 | 95 | }, { |
| michael@0 | 96 | expected: [{ |
| michael@0 | 97 | "method": "speak", |
| michael@0 | 98 | "data": "hidden I will be hidden", |
| michael@0 | 99 | "options": { |
| michael@0 | 100 | "enqueue": false |
| michael@0 | 101 | } |
| michael@0 | 102 | }], |
| michael@0 | 103 | action: function action() { |
| michael@0 | 104 | hide("to_hide_live_assertive"); |
| michael@0 | 105 | } |
| michael@0 | 106 | }, { |
| michael@0 | 107 | expected: [{ |
| michael@0 | 108 | "method": "speak", |
| michael@0 | 109 | "data": "I will be shown", |
| michael@0 | 110 | "options": { |
| michael@0 | 111 | "enqueue": false |
| michael@0 | 112 | } |
| michael@0 | 113 | }], |
| michael@0 | 114 | action: function action() { |
| michael@0 | 115 | [show(id) for (id of ["to_show_live_off", "to_show_live_assertive"])]; |
| michael@0 | 116 | } |
| michael@0 | 117 | }, { |
| michael@0 | 118 | expected: [{ |
| michael@0 | 119 | "method": "speak", |
| michael@0 | 120 | "data": "Text Added", |
| michael@0 | 121 | "options": { |
| michael@0 | 122 | "enqueue": false |
| michael@0 | 123 | } |
| michael@0 | 124 | }], |
| michael@0 | 125 | action: function action() { |
| michael@0 | 126 | updateText("text_add", "Text Added"); |
| michael@0 | 127 | } |
| michael@0 | 128 | }, { |
| michael@0 | 129 | expected: [{ |
| michael@0 | 130 | "method": "speak", |
| michael@0 | 131 | "data": "Text Added", |
| michael@0 | 132 | "options": { |
| michael@0 | 133 | "enqueue": false |
| michael@0 | 134 | } |
| michael@0 | 135 | }], |
| michael@0 | 136 | action: function action() { |
| michael@0 | 137 | updateHTML("text_add", "Text Added"); |
| michael@0 | 138 | } |
| michael@0 | 139 | }, { |
| michael@0 | 140 | expected: [{ |
| michael@0 | 141 | "method": "speak", |
| michael@0 | 142 | "data": "hidden Text Removed", |
| michael@0 | 143 | "options": { |
| michael@0 | 144 | "enqueue": true |
| michael@0 | 145 | } |
| michael@0 | 146 | }], |
| michael@0 | 147 | action: function action() { |
| michael@0 | 148 | updateText("text_remove", ""); |
| michael@0 | 149 | } |
| michael@0 | 150 | }, { |
| michael@0 | 151 | expected: [{ |
| michael@0 | 152 | "method": "speak", |
| michael@0 | 153 | "data": "Descendant Text Added", |
| michael@0 | 154 | "options": { |
| michael@0 | 155 | "enqueue": false |
| michael@0 | 156 | } |
| michael@0 | 157 | }], |
| michael@0 | 158 | action: function action() { |
| michael@0 | 159 | updateText("text_add_descendant", "Descendant Text Added"); |
| michael@0 | 160 | } |
| michael@0 | 161 | }, { |
| michael@0 | 162 | expected: [{ |
| michael@0 | 163 | "method": "speak", |
| michael@0 | 164 | "data": "Descendant Text Added", |
| michael@0 | 165 | "options": { |
| michael@0 | 166 | "enqueue": false |
| michael@0 | 167 | } |
| michael@0 | 168 | }], |
| michael@0 | 169 | action: function action() { |
| michael@0 | 170 | updateHTML("text_add_descendant", "Descendant Text Added"); |
| michael@0 | 171 | } |
| michael@0 | 172 | }, { |
| michael@0 | 173 | expected: [{ |
| michael@0 | 174 | "method": "speak", |
| michael@0 | 175 | "data": "hidden Descendant Text Removed", |
| michael@0 | 176 | "options": { |
| michael@0 | 177 | "enqueue": true |
| michael@0 | 178 | } |
| michael@0 | 179 | }], |
| michael@0 | 180 | action: function action() { |
| michael@0 | 181 | updateText("text_remove_descendant", ""); |
| michael@0 | 182 | } |
| michael@0 | 183 | }, { |
| michael@0 | 184 | expected: [{ |
| michael@0 | 185 | "method": "speak", |
| michael@0 | 186 | "data": "Descendant Text Added", |
| michael@0 | 187 | "options": { |
| michael@0 | 188 | "enqueue": false |
| michael@0 | 189 | } |
| michael@0 | 190 | }], |
| michael@0 | 191 | action: function action() { |
| michael@0 | 192 | updateText("text_add_descendant2", "Descendant Text Added"); |
| michael@0 | 193 | } |
| michael@0 | 194 | }, { |
| michael@0 | 195 | expected: [{ |
| michael@0 | 196 | "method": "speak", |
| michael@0 | 197 | "data": "Descendant Text Added", |
| michael@0 | 198 | "options": { |
| michael@0 | 199 | "enqueue": false |
| michael@0 | 200 | } |
| michael@0 | 201 | }], |
| michael@0 | 202 | action: function action() { |
| michael@0 | 203 | updateHTML("text_add_descendant2", "Descendant Text Added"); |
| michael@0 | 204 | } |
| michael@0 | 205 | }, { |
| michael@0 | 206 | expected: [{ |
| michael@0 | 207 | "method": "speak", |
| michael@0 | 208 | "data": "hidden Descendant Text Removed", |
| michael@0 | 209 | "options": { |
| michael@0 | 210 | "enqueue": true |
| michael@0 | 211 | } |
| michael@0 | 212 | }], |
| michael@0 | 213 | action: function action() { |
| michael@0 | 214 | updateText("text_remove_descendant2", ""); |
| michael@0 | 215 | } |
| michael@0 | 216 | }, { |
| michael@0 | 217 | expected: [{ |
| michael@0 | 218 | "method": "speak", |
| michael@0 | 219 | "data": "I am replaced main", |
| michael@0 | 220 | "options": { |
| michael@0 | 221 | "enqueue": true |
| michael@0 | 222 | } |
| michael@0 | 223 | }], |
| michael@0 | 224 | action: function action() { |
| michael@0 | 225 | var region = document.getElementById("to_replace_region"); |
| michael@0 | 226 | var child = document.getElementById("to_replace"); |
| michael@0 | 227 | child.setAttribute("role", "main"); |
| michael@0 | 228 | } |
| michael@0 | 229 | }, { |
| michael@0 | 230 | expected: [{ |
| michael@0 | 231 | "method": "speak", |
| michael@0 | 232 | "data": "I am a replaced text", |
| michael@0 | 233 | "options": { |
| michael@0 | 234 | "enqueue": false |
| michael@0 | 235 | } |
| michael@0 | 236 | }], |
| michael@0 | 237 | action: function action() { |
| michael@0 | 238 | updateText("to_replace_text", "I am a replaced text"); |
| michael@0 | 239 | } |
| michael@0 | 240 | }, { |
| michael@0 | 241 | expected: [{ |
| michael@0 | 242 | "method": "speak", |
| michael@0 | 243 | "data": "I am a replaced text", |
| michael@0 | 244 | "options": { |
| michael@0 | 245 | "enqueue": false |
| michael@0 | 246 | } |
| michael@0 | 247 | }], |
| michael@0 | 248 | action: function action() { |
| michael@0 | 249 | updateHTML("to_replace_text", "I am a replaced text"); |
| michael@0 | 250 | } |
| michael@0 | 251 | }]; |
| michael@0 | 252 | |
| michael@0 | 253 | function doTest() { |
| michael@0 | 254 | AccessFuTest.addFunc(startAccessFu); |
| michael@0 | 255 | tests.forEach(function addTest(test) { |
| michael@0 | 256 | AccessFuTest.addFunc(function () { |
| michael@0 | 257 | AccessFuTest.once(test.expected, AccessFuTest.nextTest); |
| michael@0 | 258 | test.action(); |
| michael@0 | 259 | }); |
| michael@0 | 260 | }); |
| michael@0 | 261 | AccessFuTest.addFunc(stopAccessFu); |
| michael@0 | 262 | AccessFuTest.waitForExplicitFinish(); |
| michael@0 | 263 | AccessFuTest.runTests(); |
| michael@0 | 264 | } |
| michael@0 | 265 | |
| michael@0 | 266 | SimpleTest.waitForExplicitFinish(); |
| michael@0 | 267 | addA11yLoadEvent(doTest); |
| michael@0 | 268 | </script> |
| michael@0 | 269 | |
| michael@0 | 270 | </head> |
| michael@0 | 271 | <body> |
| michael@0 | 272 | <a target="_blank" |
| michael@0 | 273 | href="https://bugzilla.mozilla.org/show_bug.cgi?id=795957" |
| michael@0 | 274 | title="[AccessFu] Support live regions"> |
| michael@0 | 275 | Mozilla Bug 795957 |
| michael@0 | 276 | </a> |
| michael@0 | 277 | <div id="root"> |
| michael@0 | 278 | <p id="display"></p> |
| michael@0 | 279 | <div id="content" style="display: none"></div> |
| michael@0 | 280 | <pre id="test"></pre> |
| michael@0 | 281 | |
| michael@0 | 282 | <p id="to_hide1">I should not be announced 1</p> |
| michael@0 | 283 | <p id="to_hide2" aria-live="polite">I should not be announced 2</p> |
| michael@0 | 284 | <p id="to_hide3" aria-live="assertive" aria-relevant="text">I should not be announced 3</p> |
| michael@0 | 285 | <p id="to_hide4" aria-live="polite" aria-relevant="all">I will be hidden</p> |
| michael@0 | 286 | |
| michael@0 | 287 | <div> |
| michael@0 | 288 | <p id="to_hide_descendant1">I should not be announced 1</p> |
| michael@0 | 289 | </div> |
| michael@0 | 290 | <div aria-live="polite"> |
| michael@0 | 291 | <p id="to_hide_descendant2">I should not be announced 2</p> |
| michael@0 | 292 | </div> |
| michael@0 | 293 | <div aria-live="assertive" aria-relevant="text"> |
| michael@0 | 294 | <p id="to_hide_descendant3">I should not be announced 3</p> |
| michael@0 | 295 | </div> |
| michael@0 | 296 | <div aria-live="polite" aria-relevant="all"> |
| michael@0 | 297 | <p id="to_hide_descendant4">I will be hidden</p> |
| michael@0 | 298 | </div> |
| michael@0 | 299 | |
| michael@0 | 300 | <p id="to_show1" style="display: none">I should not be announced 1</p> |
| michael@0 | 301 | <p id="to_show2" aria-live="assertive" aria-relevant="text" style="display: none">I should not be announced 2</p> |
| michael@0 | 302 | <p id="to_show3" aria-live="polite" aria-relevant="removals" style="display: none">I should not be announced 3</p> |
| michael@0 | 303 | <p id="to_show4" aria-live="polite" aria-relevant="all" style="display: none">I will be shown</p> |
| michael@0 | 304 | |
| michael@0 | 305 | <div> |
| michael@0 | 306 | <p id="to_show_descendant1" style="display: none">I should not be announced 1</p> |
| michael@0 | 307 | </div> |
| michael@0 | 308 | <div aria-live="polite" aria-relevant="removals"> |
| michael@0 | 309 | <p id="to_show_descendant2" style="display: none">I should not be announced 2</p> |
| michael@0 | 310 | </div> |
| michael@0 | 311 | <div aria-live="assertive" aria-relevant="text"> |
| michael@0 | 312 | <p id="to_show_descendant3" style="display: none">I should not be announced 3</p> |
| michael@0 | 313 | </div> |
| michael@0 | 314 | <div aria-live="polite" aria-relevant="all"> |
| michael@0 | 315 | <p id="to_show_descendant4" style="display: none">I will be shown</p> |
| michael@0 | 316 | </div> |
| michael@0 | 317 | |
| michael@0 | 318 | <div aria-live="assertive" aria-relevant="all"> |
| michael@0 | 319 | <p id="to_hide_live_assertive">I will be hidden</p> |
| michael@0 | 320 | </div> |
| michael@0 | 321 | <p id="to_show_live_assertive" aria-live="assertive" style="display: none">I will be shown</p> |
| michael@0 | 322 | |
| michael@0 | 323 | <p id="to_show_live_off" aria-live="off" style="display: none">I will not be shown</p> |
| michael@0 | 324 | |
| michael@0 | 325 | <div id="to_replace_region" aria-live="polite" aria-relevant="all"> |
| michael@0 | 326 | <p id="to_replace">I am replaced</p> |
| michael@0 | 327 | </div> |
| michael@0 | 328 | |
| michael@0 | 329 | <p id="to_replace_text" aria-live="assertive" aria-relevant="text">I am going to be replaced</p> |
| michael@0 | 330 | |
| michael@0 | 331 | <p id="text_add" aria-live="assertive" aria-relevant="text"></p> |
| michael@0 | 332 | <p id="text_remove" aria-live="polite" aria-relevant="all">Text Removed</p> |
| michael@0 | 333 | |
| michael@0 | 334 | <div aria-live="assertive" aria-relevant="all"> |
| michael@0 | 335 | <p id="text_add_descendant"></p> |
| michael@0 | 336 | </div> |
| michael@0 | 337 | <div aria-live="polite" aria-relevant="text"> |
| michael@0 | 338 | <p id="text_remove_descendant">Descendant Text Removed</p> |
| michael@0 | 339 | </div> |
| michael@0 | 340 | <div aria-live="assertive" aria-relevant="text"> |
| michael@0 | 341 | <p id="text_add_descendant2"></p> |
| michael@0 | 342 | </div> |
| michael@0 | 343 | <div aria-live="polite" aria-relevant="all"> |
| michael@0 | 344 | <p id="text_remove_descendant2">Descendant Text Removed</p> |
| michael@0 | 345 | </div> |
| michael@0 | 346 | </div> |
| michael@0 | 347 | </body> |
| michael@0 | 348 | </html> |
