The Tor Browser: accessible/tests/mochitest/treeupdate/test

accessible/tests/mochitest/treeupdate/test_imagemap.html@925c144e1f1f (annotated)

accessible/tests/mochitest/treeupdate/test_imagemap.html

Fri, 16 Jan 2015 18:13:44 +0100

author: Michael Schloh von Bennewitz <michael@schloh.com>
date: Fri, 16 Jan 2015 18:13:44 +0100
branch: TOR_BUG_9701
changeset 14: 925c144e1f1f
permissions: -rw-r--r--

Integrate suggestion from review to improve consistency with existing code.

 <!DOCTYPE html>
 <html>
 <head>
   <title>HTML img map accessible tree update tests</title>
   <link rel="stylesheet" type="text/css"
         href="chrome://mochikit/content/tests/SimpleTest/test.css" />
   <script type="application/javascript"
           src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
   <script type="application/javascript"
           src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
   <script type="application/javascript"
           src="../common.js"></script>
   <script type="application/javascript"
           src="../role.js"></script>
   <script type="application/javascript"
           src="../events.js"></script>
   <script type="application/javascript">
     function insertArea(aImageMapID, aMapID)
     {
       this.imageMap = getAccessible(aImageMapID);
       this.mapNode = getNode(aMapID);
       function getInsertedArea(aThisObj)
       {
         return aThisObj.imageMap.firstChild;
       }
       this.eventSeq = [
         new invokerChecker(EVENT_SHOW, getInsertedArea, this),
         new invokerChecker(EVENT_REORDER, this.imageMap)
       ];
       this.invoke = function insertArea_invoke()
       {
         var areaElm = document.createElement("area");
         areaElm.setAttribute("href",
                              "http://www.bbc.co.uk/radio4/atoz/index.shtml#a");
         areaElm.setAttribute("coords", "0,0,13,14");
         areaElm.setAttribute("alt", "a");
         areaElm.setAttribute("shape", "rect");
         this.mapNode.insertBefore(areaElm, this.mapNode.firstChild);
       }
       this.finalCheck = function insertArea_finalCheck()
       {
         var accTree =
           { IMAGE_MAP: [
             {
               role: ROLE_LINK,
               name: "a",
               children: [ ]
             },
             {
               role: ROLE_LINK,
               name: "b",
               children: [ ]
             },
           ] };
         testAccessibleTree(this.imageMap, accTree);
       }
       this.getID = function insertArea_getID()
       {
         return "insert area element";
       }
     }
     function appendArea(aImageMapID, aMapID)
     {
       this.imageMap = getAccessible(aImageMapID);
       this.mapNode = getNode(aMapID);
       function getAppendedArea(aThisObj)
       {
         return aThisObj.imageMap.lastChild;
       }
       this.eventSeq = [
         new invokerChecker(EVENT_SHOW, getAppendedArea, this),
         new invokerChecker(EVENT_REORDER, this.imageMap)
       ];
       this.invoke = function appendArea_invoke()
       {
         var areaElm = document.createElement("area");
         areaElm.setAttribute("href",
                              "http://www.bbc.co.uk/radio4/atoz/index.shtml#c");
         areaElm.setAttribute("coords", "34,0,47,14");
         areaElm.setAttribute("alt", "c");
         areaElm.setAttribute("shape", "rect");
         this.mapNode.appendChild(areaElm);
       }
       this.finalCheck = function appendArea_finalCheck()
       {
         var accTree =
           { IMAGE_MAP: [
             {
               role: ROLE_LINK,
               name: "a",
               children: [ ]
             },
             {
               role: ROLE_LINK,
               name: "b",
               children: [ ]
             },
             {
               role: ROLE_LINK,
               name: "c",
               children: [ ]
             }
           ] };
         testAccessibleTree(this.imageMap, accTree);
       }
       this.getID = function appendArea_getID()
       {
         return "append area element";
       }
     }
     function removeArea(aImageMapID, aMapID)
     {
       this.imageMap = getAccessible(aImageMapID);
       this.area = null;
       this.mapNode = getNode(aMapID);
       function getRemovedArea(aThisObj)
       {
         return aThisObj.area;
       }
       this.eventSeq = [
         new invokerChecker(EVENT_HIDE, getRemovedArea, this),
         new invokerChecker(EVENT_REORDER, this.imageMap)
       ];
       this.invoke = function removeArea_invoke()
       {
         this.area = this.imageMap.firstChild;
         this.mapNode.removeChild(this.mapNode.firstElementChild);
       }
       this.finalCheck = function removeArea_finalCheck()
       {
         var accTree =
           { IMAGE_MAP: [
             {
               role: ROLE_LINK,
               name: "b",
               children: [ ]
             },
             {
               role: ROLE_LINK,
               name: "c",
               children: [ ]
             }
           ] };
         testAccessibleTree(this.imageMap, accTree);
       }
       this.getID = function removeArea_getID()
       {
         return "remove area element";
       }
     }
     function removeNameOnMap(aImageMapContainerID, aImageMapID, aMapID)
     {
       this.container = getAccessible(aImageMapContainerID);
       this.containerNode = this.container.DOMNode;
       this.imageMap = getAccessible(aImageMapID);
       this.imgNode = this.imageMap.DOMNode;
       this.mapNode = getNode(aMapID);
       this.eventSeq = [
         new invokerChecker(EVENT_HIDE, this.imageMap),
         new invokerChecker(EVENT_SHOW, this.imgNode),
         new invokerChecker(EVENT_REORDER, this.container)
       ];
       this.invoke = function removeNameOnMap_invoke()
       {
         this.mapNode.removeAttribute("name");
       }
       this.finalCheck = function removeNameOnMap_finalCheck()
       {
         var accTree =
           { SECTION: [
             { GRAPHIC: [ ] }
           ] };
         testAccessibleTree(this.container, accTree);
       }
       this.getID = function removeNameOnMap_getID()
       {
         return "remove @name on map element";
       }
     }
     function restoreNameOnMap(aImageMapContainerID, aImageMapID, aMapID)
     {
       this.container = getAccessible(aImageMapContainerID);
       this.containerNode = this.container.DOMNode;
       this.imageMap = null;
       this.imgNode = getNode(aImageMapID);
       this.mapNode = getNode(aMapID);
       function getImageMap(aThisObj)
       {
         return aThisObj.imageMap;
       }
       this.eventSeq = [
         new invokerChecker(EVENT_HIDE, getImageMap, this),
         new invokerChecker(EVENT_SHOW, this.imgNode),
         new invokerChecker(EVENT_REORDER, this.container)
       ];
       this.invoke = function restoreNameOnMap_invoke()
       {
         this.imageMap = getAccessible(aImageMapID);
         this.mapNode.setAttribute("name", "atoz_map");
         // XXXhack: force repainting of the image (see bug 745788 for details).
         waveOverImageMap(aImageMapID);
       }
       this.finalCheck = function removeNameOnMap_finalCheck()
       {
         var accTree =
           { SECTION: [
             { IMAGE_MAP: [
               { LINK: [ ] },
               { LINK: [ ] }
             ] }
           ] };
         testAccessibleTree(this.container, accTree);
       }
       this.getID = function removeNameOnMap_getID()
       {
         return "restore @name on map element";
       }
     }
     function removeMap(aImageMapContainerID, aImageMapID, aMapID)
     {
       this.container = getAccessible(aImageMapContainerID);
       this.containerNode = this.container.DOMNode;
       this.imageMap = null;
       this.imgNode = getNode(aImageMapID);
       this.mapNode = getNode(aMapID);
       function getImageMap(aThisObj)
       {
         return aThisObj.imageMap;
       }
       this.eventSeq = [
         new invokerChecker(EVENT_HIDE, getImageMap, this),
         new invokerChecker(EVENT_SHOW, this.imgNode),
         new invokerChecker(EVENT_REORDER, this.container)
       ];
       this.invoke = function removeMap_invoke()
       {
         this.imageMap = getAccessible(aImageMapID);
         this.mapNode.parentNode.removeChild(this.mapNode);
       }
       this.finalCheck = function removeMap_finalCheck()
       {
         var accTree =
           { SECTION: [
             { GRAPHIC: [ ] }
           ] };
         testAccessibleTree(this.container, accTree);
       }
       this.getID = function removeMap_getID()
       {
         return "remove map element";
       }
     }
     function insertMap(aImageMapContainerID, aImageID)
     {
       this.container = getAccessible(aImageMapContainerID);
       this.containerNode = this.container.DOMNode;
       this.image = null;
       this.imgMapNode = getNode(aImageID);
       function getImage(aThisObj)
       {
         return aThisObj.image;
       }
       this.eventSeq = [
         new invokerChecker(EVENT_HIDE, getImage, this),
         new invokerChecker(EVENT_SHOW, this.imgMapNode),
         new invokerChecker(EVENT_REORDER, this.container)
       ];
       this.invoke = function insertMap_invoke()
       {
         this.image = getAccessible(aImageID);
         var map = document.createElement("map");
         map.setAttribute("name", "atoz_map");
         map.setAttribute("id", "map");
         var area = document.createElement("area")
         area.setAttribute("href",
                           "http://www.bbc.co.uk/radio4/atoz/index.shtml#b");
         area.setAttribute("coords", "17,0,30,14");
         area.setAttribute("alt", "b");
         area.setAttribute("shape", "rect");
         map.appendChild(area);
         this.containerNode.appendChild(map);
       }
       this.finalCheck = function insertMap_finalCheck()
       {
         var accTree =
           { SECTION: [
             { IMAGE_MAP: [
               { LINK: [ ] }
             ] }
           ] };
         testAccessibleTree(this.container, accTree);
       }
       this.getID = function insertMap_getID()
       {
         return "insert map element";
       }
     }
     function hideImageMap(aContainerID, aImageID)
     {
       this.container = getAccessible(aContainerID);
       this.imageMap = null;
       this.imageMapNode = getNode(aImageID);
       function getImageMap(aThisObj)
       {
         return aThisObj.imageMap;
       }
       this.eventSeq = [
         new invokerChecker(EVENT_HIDE, getImageMap, this),
         new invokerChecker(EVENT_REORDER, aContainerID)
       ];
       this.invoke = function hideImageMap_invoke()
       {
         this.imageMap = getAccessible(this.imageMapNode);
         this.imageMapNode.style.display = "none";
       }
       this.finalCheck = function hideImageMap_finalCheck()
       {
         var accTree =
           { SECTION: [ ] };
         testAccessibleTree(this.container, accTree);
       }
       this.getID = function hideImageMap_getID()
       {
         return "display:none image";
       }
     }
     //gA11yEventDumpToConsole = true; // debug stuff
     function doPreTest()
     {
       waitForImageMap("imgmap", doTest);
     }
     var gQueue = null;
     function doTest()
     {
       gQueue = new eventQueue();
       gQueue.push(new insertArea("imgmap", "map"));
       gQueue.push(new appendArea("imgmap", "map"));
       gQueue.push(new removeArea("imgmap", "map"));
       gQueue.push(new removeNameOnMap("container", "imgmap", "map"));
       gQueue.push(new restoreNameOnMap("container", "imgmap", "map"));
       gQueue.push(new removeMap("container", "imgmap", "map"));
       gQueue.push(new insertMap("container", "imgmap"));
       gQueue.push(new hideImageMap("container", "imgmap"));
       //enableLogging("tree"); // debug stuff
       //gQueue.onFinish = function() { disableLogging("tree"); }
       gQueue.invoke(); // Will call SimpleTest.finish();
     }
     SimpleTest.waitForExplicitFinish();
     addA11yLoadEvent(doPreTest);
   </script>
 </head>
 <body>
   <a target="_blank"
      title="Image map accessible tree is not updated when image map is changed"
      href="https://bugzilla.mozilla.org/show_bug.cgi?id=732389">
     Mozilla Bug 732389
   </a>
   <p id="display"></p>
   <div id="content" style="display: none"></div>
   <pre id="test">
   </pre>
   <map name="atoz_map" id="map">
     <area href="http://www.bbc.co.uk/radio4/atoz/index.shtml#b"
           coords="17,0,30,14" alt="b" shape="rect">
   </map>
   <div id="container">
     <img id="imgmap" width="447" height="15"
          usemap="#atoz_map"
          src="../letters.gif"><!--
     Important: no whitespace between the <img> and the </div>, so we
     don't end up with textframes there, because those would be reflected
     in our accessible tree in some cases.
     --></div>
 </body>
 </html>

The Tor Browser / annotate

accessible/tests/mochitest/treeupdate/test_imagemap.html@925c144e1f1f (annotated)

accessible/tests/mochitest/treeupdate/test_imagemap.html