accessible/tests/mochitest/treeupdate/test_imagemap.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 <!DOCTYPE html>
michael@0 2 <html>
michael@0 3 <head>
michael@0 4 <title>HTML img map accessible tree update tests</title>
michael@0 5 <link rel="stylesheet" type="text/css"
michael@0 6 href="chrome://mochikit/content/tests/SimpleTest/test.css" />
michael@0 7
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="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
michael@0 12
michael@0 13 <script type="application/javascript"
michael@0 14 src="../common.js"></script>
michael@0 15 <script type="application/javascript"
michael@0 16 src="../role.js"></script>
michael@0 17 <script type="application/javascript"
michael@0 18 src="../events.js"></script>
michael@0 19
michael@0 20 <script type="application/javascript">
michael@0 21 function insertArea(aImageMapID, aMapID)
michael@0 22 {
michael@0 23 this.imageMap = getAccessible(aImageMapID);
michael@0 24 this.mapNode = getNode(aMapID);
michael@0 25
michael@0 26 function getInsertedArea(aThisObj)
michael@0 27 {
michael@0 28 return aThisObj.imageMap.firstChild;
michael@0 29 }
michael@0 30
michael@0 31 this.eventSeq = [
michael@0 32 new invokerChecker(EVENT_SHOW, getInsertedArea, this),
michael@0 33 new invokerChecker(EVENT_REORDER, this.imageMap)
michael@0 34 ];
michael@0 35
michael@0 36 this.invoke = function insertArea_invoke()
michael@0 37 {
michael@0 38 var areaElm = document.createElement("area");
michael@0 39 areaElm.setAttribute("href",
michael@0 40 "http://www.bbc.co.uk/radio4/atoz/index.shtml#a");
michael@0 41 areaElm.setAttribute("coords", "0,0,13,14");
michael@0 42 areaElm.setAttribute("alt", "a");
michael@0 43 areaElm.setAttribute("shape", "rect");
michael@0 44
michael@0 45 this.mapNode.insertBefore(areaElm, this.mapNode.firstChild);
michael@0 46 }
michael@0 47
michael@0 48 this.finalCheck = function insertArea_finalCheck()
michael@0 49 {
michael@0 50 var accTree =
michael@0 51 { IMAGE_MAP: [
michael@0 52 {
michael@0 53 role: ROLE_LINK,
michael@0 54 name: "a",
michael@0 55 children: [ ]
michael@0 56 },
michael@0 57 {
michael@0 58 role: ROLE_LINK,
michael@0 59 name: "b",
michael@0 60 children: [ ]
michael@0 61 },
michael@0 62 ] };
michael@0 63 testAccessibleTree(this.imageMap, accTree);
michael@0 64 }
michael@0 65
michael@0 66 this.getID = function insertArea_getID()
michael@0 67 {
michael@0 68 return "insert area element";
michael@0 69 }
michael@0 70 }
michael@0 71
michael@0 72 function appendArea(aImageMapID, aMapID)
michael@0 73 {
michael@0 74 this.imageMap = getAccessible(aImageMapID);
michael@0 75 this.mapNode = getNode(aMapID);
michael@0 76
michael@0 77 function getAppendedArea(aThisObj)
michael@0 78 {
michael@0 79 return aThisObj.imageMap.lastChild;
michael@0 80 }
michael@0 81
michael@0 82 this.eventSeq = [
michael@0 83 new invokerChecker(EVENT_SHOW, getAppendedArea, this),
michael@0 84 new invokerChecker(EVENT_REORDER, this.imageMap)
michael@0 85 ];
michael@0 86
michael@0 87 this.invoke = function appendArea_invoke()
michael@0 88 {
michael@0 89 var areaElm = document.createElement("area");
michael@0 90 areaElm.setAttribute("href",
michael@0 91 "http://www.bbc.co.uk/radio4/atoz/index.shtml#c");
michael@0 92 areaElm.setAttribute("coords", "34,0,47,14");
michael@0 93 areaElm.setAttribute("alt", "c");
michael@0 94 areaElm.setAttribute("shape", "rect");
michael@0 95
michael@0 96 this.mapNode.appendChild(areaElm);
michael@0 97 }
michael@0 98
michael@0 99 this.finalCheck = function appendArea_finalCheck()
michael@0 100 {
michael@0 101 var accTree =
michael@0 102 { IMAGE_MAP: [
michael@0 103 {
michael@0 104 role: ROLE_LINK,
michael@0 105 name: "a",
michael@0 106 children: [ ]
michael@0 107 },
michael@0 108 {
michael@0 109 role: ROLE_LINK,
michael@0 110 name: "b",
michael@0 111 children: [ ]
michael@0 112 },
michael@0 113 {
michael@0 114 role: ROLE_LINK,
michael@0 115 name: "c",
michael@0 116 children: [ ]
michael@0 117 }
michael@0 118 ] };
michael@0 119 testAccessibleTree(this.imageMap, accTree);
michael@0 120 }
michael@0 121
michael@0 122 this.getID = function appendArea_getID()
michael@0 123 {
michael@0 124 return "append area element";
michael@0 125 }
michael@0 126 }
michael@0 127
michael@0 128 function removeArea(aImageMapID, aMapID)
michael@0 129 {
michael@0 130 this.imageMap = getAccessible(aImageMapID);
michael@0 131 this.area = null;
michael@0 132 this.mapNode = getNode(aMapID);
michael@0 133
michael@0 134 function getRemovedArea(aThisObj)
michael@0 135 {
michael@0 136 return aThisObj.area;
michael@0 137 }
michael@0 138
michael@0 139 this.eventSeq = [
michael@0 140 new invokerChecker(EVENT_HIDE, getRemovedArea, this),
michael@0 141 new invokerChecker(EVENT_REORDER, this.imageMap)
michael@0 142 ];
michael@0 143
michael@0 144 this.invoke = function removeArea_invoke()
michael@0 145 {
michael@0 146 this.area = this.imageMap.firstChild;
michael@0 147 this.mapNode.removeChild(this.mapNode.firstElementChild);
michael@0 148 }
michael@0 149
michael@0 150 this.finalCheck = function removeArea_finalCheck()
michael@0 151 {
michael@0 152 var accTree =
michael@0 153 { IMAGE_MAP: [
michael@0 154 {
michael@0 155 role: ROLE_LINK,
michael@0 156 name: "b",
michael@0 157 children: [ ]
michael@0 158 },
michael@0 159 {
michael@0 160 role: ROLE_LINK,
michael@0 161 name: "c",
michael@0 162 children: [ ]
michael@0 163 }
michael@0 164 ] };
michael@0 165 testAccessibleTree(this.imageMap, accTree);
michael@0 166 }
michael@0 167
michael@0 168 this.getID = function removeArea_getID()
michael@0 169 {
michael@0 170 return "remove area element";
michael@0 171 }
michael@0 172 }
michael@0 173
michael@0 174 function removeNameOnMap(aImageMapContainerID, aImageMapID, aMapID)
michael@0 175 {
michael@0 176 this.container = getAccessible(aImageMapContainerID);
michael@0 177 this.containerNode = this.container.DOMNode;
michael@0 178 this.imageMap = getAccessible(aImageMapID);
michael@0 179 this.imgNode = this.imageMap.DOMNode;
michael@0 180 this.mapNode = getNode(aMapID);
michael@0 181
michael@0 182 this.eventSeq = [
michael@0 183 new invokerChecker(EVENT_HIDE, this.imageMap),
michael@0 184 new invokerChecker(EVENT_SHOW, this.imgNode),
michael@0 185 new invokerChecker(EVENT_REORDER, this.container)
michael@0 186 ];
michael@0 187
michael@0 188 this.invoke = function removeNameOnMap_invoke()
michael@0 189 {
michael@0 190 this.mapNode.removeAttribute("name");
michael@0 191 }
michael@0 192
michael@0 193 this.finalCheck = function removeNameOnMap_finalCheck()
michael@0 194 {
michael@0 195 var accTree =
michael@0 196 { SECTION: [
michael@0 197 { GRAPHIC: [ ] }
michael@0 198 ] };
michael@0 199 testAccessibleTree(this.container, accTree);
michael@0 200 }
michael@0 201
michael@0 202 this.getID = function removeNameOnMap_getID()
michael@0 203 {
michael@0 204 return "remove @name on map element";
michael@0 205 }
michael@0 206 }
michael@0 207
michael@0 208 function restoreNameOnMap(aImageMapContainerID, aImageMapID, aMapID)
michael@0 209 {
michael@0 210 this.container = getAccessible(aImageMapContainerID);
michael@0 211 this.containerNode = this.container.DOMNode;
michael@0 212 this.imageMap = null;
michael@0 213 this.imgNode = getNode(aImageMapID);
michael@0 214 this.mapNode = getNode(aMapID);
michael@0 215
michael@0 216 function getImageMap(aThisObj)
michael@0 217 {
michael@0 218 return aThisObj.imageMap;
michael@0 219 }
michael@0 220
michael@0 221 this.eventSeq = [
michael@0 222 new invokerChecker(EVENT_HIDE, getImageMap, this),
michael@0 223 new invokerChecker(EVENT_SHOW, this.imgNode),
michael@0 224 new invokerChecker(EVENT_REORDER, this.container)
michael@0 225 ];
michael@0 226
michael@0 227 this.invoke = function restoreNameOnMap_invoke()
michael@0 228 {
michael@0 229 this.imageMap = getAccessible(aImageMapID);
michael@0 230 this.mapNode.setAttribute("name", "atoz_map");
michael@0 231
michael@0 232 // XXXhack: force repainting of the image (see bug 745788 for details).
michael@0 233 waveOverImageMap(aImageMapID);
michael@0 234 }
michael@0 235
michael@0 236 this.finalCheck = function removeNameOnMap_finalCheck()
michael@0 237 {
michael@0 238 var accTree =
michael@0 239 { SECTION: [
michael@0 240 { IMAGE_MAP: [
michael@0 241 { LINK: [ ] },
michael@0 242 { LINK: [ ] }
michael@0 243 ] }
michael@0 244 ] };
michael@0 245 testAccessibleTree(this.container, accTree);
michael@0 246 }
michael@0 247
michael@0 248 this.getID = function removeNameOnMap_getID()
michael@0 249 {
michael@0 250 return "restore @name on map element";
michael@0 251 }
michael@0 252 }
michael@0 253
michael@0 254 function removeMap(aImageMapContainerID, aImageMapID, aMapID)
michael@0 255 {
michael@0 256 this.container = getAccessible(aImageMapContainerID);
michael@0 257 this.containerNode = this.container.DOMNode;
michael@0 258 this.imageMap = null;
michael@0 259 this.imgNode = getNode(aImageMapID);
michael@0 260 this.mapNode = getNode(aMapID);
michael@0 261
michael@0 262 function getImageMap(aThisObj)
michael@0 263 {
michael@0 264 return aThisObj.imageMap;
michael@0 265 }
michael@0 266
michael@0 267 this.eventSeq = [
michael@0 268 new invokerChecker(EVENT_HIDE, getImageMap, this),
michael@0 269 new invokerChecker(EVENT_SHOW, this.imgNode),
michael@0 270 new invokerChecker(EVENT_REORDER, this.container)
michael@0 271 ];
michael@0 272
michael@0 273 this.invoke = function removeMap_invoke()
michael@0 274 {
michael@0 275 this.imageMap = getAccessible(aImageMapID);
michael@0 276 this.mapNode.parentNode.removeChild(this.mapNode);
michael@0 277 }
michael@0 278
michael@0 279 this.finalCheck = function removeMap_finalCheck()
michael@0 280 {
michael@0 281 var accTree =
michael@0 282 { SECTION: [
michael@0 283 { GRAPHIC: [ ] }
michael@0 284 ] };
michael@0 285 testAccessibleTree(this.container, accTree);
michael@0 286 }
michael@0 287
michael@0 288 this.getID = function removeMap_getID()
michael@0 289 {
michael@0 290 return "remove map element";
michael@0 291 }
michael@0 292 }
michael@0 293
michael@0 294 function insertMap(aImageMapContainerID, aImageID)
michael@0 295 {
michael@0 296 this.container = getAccessible(aImageMapContainerID);
michael@0 297 this.containerNode = this.container.DOMNode;
michael@0 298 this.image = null;
michael@0 299 this.imgMapNode = getNode(aImageID);
michael@0 300
michael@0 301 function getImage(aThisObj)
michael@0 302 {
michael@0 303 return aThisObj.image;
michael@0 304 }
michael@0 305
michael@0 306 this.eventSeq = [
michael@0 307 new invokerChecker(EVENT_HIDE, getImage, this),
michael@0 308 new invokerChecker(EVENT_SHOW, this.imgMapNode),
michael@0 309 new invokerChecker(EVENT_REORDER, this.container)
michael@0 310 ];
michael@0 311
michael@0 312 this.invoke = function insertMap_invoke()
michael@0 313 {
michael@0 314 this.image = getAccessible(aImageID);
michael@0 315
michael@0 316 var map = document.createElement("map");
michael@0 317 map.setAttribute("name", "atoz_map");
michael@0 318 map.setAttribute("id", "map");
michael@0 319
michael@0 320 var area = document.createElement("area")
michael@0 321 area.setAttribute("href",
michael@0 322 "http://www.bbc.co.uk/radio4/atoz/index.shtml#b");
michael@0 323 area.setAttribute("coords", "17,0,30,14");
michael@0 324 area.setAttribute("alt", "b");
michael@0 325 area.setAttribute("shape", "rect");
michael@0 326
michael@0 327 map.appendChild(area);
michael@0 328
michael@0 329 this.containerNode.appendChild(map);
michael@0 330 }
michael@0 331
michael@0 332 this.finalCheck = function insertMap_finalCheck()
michael@0 333 {
michael@0 334 var accTree =
michael@0 335 { SECTION: [
michael@0 336 { IMAGE_MAP: [
michael@0 337 { LINK: [ ] }
michael@0 338 ] }
michael@0 339 ] };
michael@0 340 testAccessibleTree(this.container, accTree);
michael@0 341 }
michael@0 342
michael@0 343 this.getID = function insertMap_getID()
michael@0 344 {
michael@0 345 return "insert map element";
michael@0 346 }
michael@0 347 }
michael@0 348
michael@0 349 function hideImageMap(aContainerID, aImageID)
michael@0 350 {
michael@0 351 this.container = getAccessible(aContainerID);
michael@0 352 this.imageMap = null;
michael@0 353 this.imageMapNode = getNode(aImageID);
michael@0 354
michael@0 355 function getImageMap(aThisObj)
michael@0 356 {
michael@0 357 return aThisObj.imageMap;
michael@0 358 }
michael@0 359
michael@0 360 this.eventSeq = [
michael@0 361 new invokerChecker(EVENT_HIDE, getImageMap, this),
michael@0 362 new invokerChecker(EVENT_REORDER, aContainerID)
michael@0 363 ];
michael@0 364
michael@0 365 this.invoke = function hideImageMap_invoke()
michael@0 366 {
michael@0 367 this.imageMap = getAccessible(this.imageMapNode);
michael@0 368 this.imageMapNode.style.display = "none";
michael@0 369 }
michael@0 370
michael@0 371 this.finalCheck = function hideImageMap_finalCheck()
michael@0 372 {
michael@0 373 var accTree =
michael@0 374 { SECTION: [ ] };
michael@0 375 testAccessibleTree(this.container, accTree);
michael@0 376 }
michael@0 377
michael@0 378 this.getID = function hideImageMap_getID()
michael@0 379 {
michael@0 380 return "display:none image";
michael@0 381 }
michael@0 382 }
michael@0 383
michael@0 384 //gA11yEventDumpToConsole = true; // debug stuff
michael@0 385 function doPreTest()
michael@0 386 {
michael@0 387 waitForImageMap("imgmap", doTest);
michael@0 388 }
michael@0 389
michael@0 390 var gQueue = null;
michael@0 391 function doTest()
michael@0 392 {
michael@0 393 gQueue = new eventQueue();
michael@0 394
michael@0 395 gQueue.push(new insertArea("imgmap", "map"));
michael@0 396 gQueue.push(new appendArea("imgmap", "map"));
michael@0 397 gQueue.push(new removeArea("imgmap", "map"));
michael@0 398 gQueue.push(new removeNameOnMap("container", "imgmap", "map"));
michael@0 399 gQueue.push(new restoreNameOnMap("container", "imgmap", "map"));
michael@0 400 gQueue.push(new removeMap("container", "imgmap", "map"));
michael@0 401 gQueue.push(new insertMap("container", "imgmap"));
michael@0 402 gQueue.push(new hideImageMap("container", "imgmap"));
michael@0 403
michael@0 404 //enableLogging("tree"); // debug stuff
michael@0 405 //gQueue.onFinish = function() { disableLogging("tree"); }
michael@0 406
michael@0 407 gQueue.invoke(); // Will call SimpleTest.finish();
michael@0 408 }
michael@0 409
michael@0 410 SimpleTest.waitForExplicitFinish();
michael@0 411 addA11yLoadEvent(doPreTest);
michael@0 412 </script>
michael@0 413
michael@0 414 </head>
michael@0 415 <body>
michael@0 416
michael@0 417 <a target="_blank"
michael@0 418 title="Image map accessible tree is not updated when image map is changed"
michael@0 419 href="https://bugzilla.mozilla.org/show_bug.cgi?id=732389">
michael@0 420 Mozilla Bug 732389
michael@0 421 </a>
michael@0 422 <p id="display"></p>
michael@0 423 <div id="content" style="display: none"></div>
michael@0 424 <pre id="test">
michael@0 425 </pre>
michael@0 426
michael@0 427 <map name="atoz_map" id="map">
michael@0 428 <area href="http://www.bbc.co.uk/radio4/atoz/index.shtml#b"
michael@0 429 coords="17,0,30,14" alt="b" shape="rect">
michael@0 430 </map>
michael@0 431
michael@0 432 <div id="container">
michael@0 433 <img id="imgmap" width="447" height="15"
michael@0 434 usemap="#atoz_map"
michael@0 435 src="../letters.gif"><!--
michael@0 436 Important: no whitespace between the <img> and the </div>, so we
michael@0 437 don't end up with textframes there, because those would be reflected
michael@0 438 in our accessible tree in some cases.
michael@0 439 --></div>
michael@0 440
michael@0 441 </body>
michael@0 442 </html>

mercurial