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

     1 <!DOCTYPE html>

     2 <html>

     4 <head>

     5   <title>Whitespace text accessible creation/desctruction</title>

     7   <link rel="stylesheet" type="text/css"

     8         href="chrome://mochikit/content/tests/SimpleTest/test.css" />

    10   <script type="application/javascript"

    11           src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>

    13   <script type="application/javascript"

    14           src="../common.js"></script>

    15   <script type="application/javascript"

    16           src="../role.js"></script>

    17   <script type="application/javascript"

    18           src="../events.js"></script>

    20   <script type="application/javascript">

    22     ////////////////////////////////////////////////////////////////////////////

    23     // Invokers

    25     /**

    26      * Middle image accessible removal results in text accessible removal.

    27      *

    28      * Before:

    29      *   DOM: whitespace img1 whitespace img2 whitespace img3 whitespace,

    30      *   a11y: img1 whitespace img2 whitespace img3

    31      * After:

    32      *   DOM: whitespace img1 whitespace whitespace img3 whitespace,

    33      *   a11y: img1 whitespace img3

    34      */

    35     function removeImg()

    36     {

    37       this.containerNode = getNode("container1");

    38       this.imgNode = getNode("img1");

    39       this.img = getAccessible(this.imgNode);

    40       this.text = this.img.nextSibling;

    42       this.eventSeq = [

    43         new invokerChecker(EVENT_HIDE, this.img),

    44         new invokerChecker(EVENT_HIDE, this.text),

    45         new invokerChecker(EVENT_REORDER, this.containerNode)

    46       ];

    48       this.finalCheck = function textLeafUpdate_finalCheck()

    49       {

    50         var tree =

    51           { SECTION: [

    52             { GRAPHIC: [] },

    53             { TEXT_LEAF: [] },

    54             { GRAPHIC: [] }

    55           ] };

    57         testAccessibleTree(this.containerNode, tree);

    58       }

    60       this.invoke = function setOnClickAttr_invoke()

    61       {

    62         var tree =

    63           { SECTION: [

    64             { GRAPHIC: [] },

    65             { TEXT_LEAF: [] },

    66             { GRAPHIC: [] },

    67             { TEXT_LEAF: [] },

    68             { GRAPHIC: [] }

    69           ] };

    71         testAccessibleTree(this.containerNode, tree);

    73         this.containerNode.removeChild(this.imgNode);

    74       }

    76       this.getID = function setOnClickAttr_getID()

    77       {

    78         return "remove middle img";

    79       }

    80     }

    82     /**

    83      * Append image making the whitespace visible and thus accessible.

    84      * Note: images and whitespaces are on different leves of accessible trees,

    85      * so that image container accessible update doesn't update the tree

    86      * of whitespace container.

    87      *

    88      * Before:

    89      *   DOM: whitespace emptylink whitespace linkwithimg whitespace

    90      *   a11y: emptylink linkwithimg

    91      * After:

    92      *   DOM: whitespace linkwithimg whitespace linkwithimg whitespace

    93      *   a11y: linkwithimg whitespace linkwithimg

    94      */

    95     function insertImg()

    96     {

    97       this.containerNode = getNode("container2");

    98       this.topNode = this.containerNode.parentNode;

    99       this.textNode = this.containerNode.nextSibling;

   100       this.imgNode = document.createElement("img");

   101       this.imgNode.setAttribute("src", "../moz.png");

   103       this.eventSeq = [

   104         new invokerChecker(EVENT_SHOW, getAccessible, this.imgNode),

   105         new invokerChecker(EVENT_SHOW, getAccessible, this.textNode),

   106         new invokerChecker(EVENT_REORDER, this.topNode)

   107       ];

   109       this.invoke = function insertImg_invoke()

   110       {

   111         var tree =

   112           { SECTION: [

   113             { LINK: [] },

   114             { LINK: [

   115               { GRAPHIC: [] }

   116             ] }

   117           ] };

   119         testAccessibleTree(this.topNode, tree);

   121         this.containerNode.appendChild(this.imgNode);

   122       }

   124       this.finalCheck = function insertImg_finalCheck()

   125       {

   126         var tree =

   127           { SECTION: [

   128             { LINK: [

   129               { GRAPHIC: [ ] }

   130             ] },

   131             { TEXT_LEAF: [ ] },

   132             { LINK: [

   133               { GRAPHIC: [ ] }

   134             ] }

   135           ] };

   137         testAccessibleTree(this.topNode, tree);

   138       }

   140       this.getID = function appendImg_getID()

   141       {

   142         return "insert img into internal container";

   143       }

   144     }

   146     ////////////////////////////////////////////////////////////////////////////

   147     // Test

   149     //gA11yEventDumpID = "eventdump"; // debug stuff

   150     //gA11yEventDumpToConsole = true;

   152     var gQueue = null;

   154     function doTest()

   155     {

   156       gQueue = new eventQueue();

   158       gQueue.push(new removeImg());

   159       gQueue.push(new insertImg());

   161       gQueue.invoke(); // SimpleTest.finish() will be called in the end

   162     }

   164     SimpleTest.waitForExplicitFinish();

   165     addA11yLoadEvent(doTest);

   166   </script>

   167 </head>

   168 <body>

   170   <a target="_blank"

   171      title="Make sure accessible tree is correct when rendered text is changed"

   172      href="https://bugzilla.mozilla.org/show_bug.cgi?id=625652">

   173     Mozilla Bug 625652

   174   </a>

   176   <p id="display"></p>

   177   <div id="content" style="display: none"></div>

   178   <pre id="test">

   179   </pre>

   181   <div id="container1">  <img src="../moz.png">  <img id="img1" src="../moz.png">  <img src="../moz.png">  </div>

   182   <div> <a id="container2"></a> <a><img src="../moz.png"></a> </div>

   184   <div id="eventdump"></div>

   185 </body>

   186 </html>

The Tor Browser / file revision