The Tor Browser / file comparison
comparison: accessible/tests/mochitest/treeupdate/test_whitespace.html
accessible/tests/mochitest/treeupdate/test_whitespace.html
- branch
- TOR_BUG_9701
- changeset 8
- 97036ab72558
equal
deleted
inserted
replaced
| -1:000000000000 | 0:b3b659e10beb |
|---|---|
| 1 <!DOCTYPE html> | |
| 2 <html> | |
| 3 | |
| 4 <head> | |
| 5 <title>Whitespace text accessible creation/desctruction</title> | |
| 6 | |
| 7 <link rel="stylesheet" type="text/css" | |
| 8 href="chrome://mochikit/content/tests/SimpleTest/test.css" /> | |
| 9 | |
| 10 <script type="application/javascript" | |
| 11 src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> | |
| 12 | |
| 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> | |
| 19 | |
| 20 <script type="application/javascript"> | |
| 21 | |
| 22 //////////////////////////////////////////////////////////////////////////// | |
| 23 // Invokers | |
| 24 | |
| 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; | |
| 41 | |
| 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 ]; | |
| 47 | |
| 48 this.finalCheck = function textLeafUpdate_finalCheck() | |
| 49 { | |
| 50 var tree = | |
| 51 { SECTION: [ | |
| 52 { GRAPHIC: [] }, | |
| 53 { TEXT_LEAF: [] }, | |
| 54 { GRAPHIC: [] } | |
| 55 ] }; | |
| 56 | |
| 57 testAccessibleTree(this.containerNode, tree); | |
| 58 } | |
| 59 | |
| 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 ] }; | |
| 70 | |
| 71 testAccessibleTree(this.containerNode, tree); | |
| 72 | |
| 73 this.containerNode.removeChild(this.imgNode); | |
| 74 } | |
| 75 | |
| 76 this.getID = function setOnClickAttr_getID() | |
| 77 { | |
| 78 return "remove middle img"; | |
| 79 } | |
| 80 } | |
| 81 | |
| 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"); | |
| 102 | |
| 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 ]; | |
| 108 | |
| 109 this.invoke = function insertImg_invoke() | |
| 110 { | |
| 111 var tree = | |
| 112 { SECTION: [ | |
| 113 { LINK: [] }, | |
| 114 { LINK: [ | |
| 115 { GRAPHIC: [] } | |
| 116 ] } | |
| 117 ] }; | |
| 118 | |
| 119 testAccessibleTree(this.topNode, tree); | |
| 120 | |
| 121 this.containerNode.appendChild(this.imgNode); | |
| 122 } | |
| 123 | |
| 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 ] }; | |
| 136 | |
| 137 testAccessibleTree(this.topNode, tree); | |
| 138 } | |
| 139 | |
| 140 this.getID = function appendImg_getID() | |
| 141 { | |
| 142 return "insert img into internal container"; | |
| 143 } | |
| 144 } | |
| 145 | |
| 146 //////////////////////////////////////////////////////////////////////////// | |
| 147 // Test | |
| 148 | |
| 149 //gA11yEventDumpID = "eventdump"; // debug stuff | |
| 150 //gA11yEventDumpToConsole = true; | |
| 151 | |
| 152 var gQueue = null; | |
| 153 | |
| 154 function doTest() | |
| 155 { | |
| 156 gQueue = new eventQueue(); | |
| 157 | |
| 158 gQueue.push(new removeImg()); | |
| 159 gQueue.push(new insertImg()); | |
| 160 | |
| 161 gQueue.invoke(); // SimpleTest.finish() will be called in the end | |
| 162 } | |
| 163 | |
| 164 SimpleTest.waitForExplicitFinish(); | |
| 165 addA11yLoadEvent(doTest); | |
| 166 </script> | |
| 167 </head> | |
| 168 <body> | |
| 169 | |
| 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> | |
| 175 | |
| 176 <p id="display"></p> | |
| 177 <div id="content" style="display: none"></div> | |
| 178 <pre id="test"> | |
| 179 </pre> | |
| 180 | |
| 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> | |
| 183 | |
| 184 <div id="eventdump"></div> | |
| 185 </body> | |
| 186 </html> |
