1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/accessible/tests/mochitest/treeupdate/test_whitespace.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,186 @@
1.4 +<!DOCTYPE html>
1.5 +<html>
1.6 +
1.7 +<head>
1.8 + <title>Whitespace text accessible creation/desctruction</title>
1.9 +
1.10 + <link rel="stylesheet" type="text/css"
1.11 + href="chrome://mochikit/content/tests/SimpleTest/test.css" />
1.12 +
1.13 + <script type="application/javascript"
1.14 + src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
1.15 +
1.16 + <script type="application/javascript"
1.17 + src="../common.js"></script>
1.18 + <script type="application/javascript"
1.19 + src="../role.js"></script>
1.20 + <script type="application/javascript"
1.21 + src="../events.js"></script>
1.22 +
1.23 + <script type="application/javascript">
1.24 +
1.25 + ////////////////////////////////////////////////////////////////////////////
1.26 + // Invokers
1.27 +
1.28 + /**
1.29 + * Middle image accessible removal results in text accessible removal.
1.30 + *
1.31 + * Before:
1.32 + * DOM: whitespace img1 whitespace img2 whitespace img3 whitespace,
1.33 + * a11y: img1 whitespace img2 whitespace img3
1.34 + * After:
1.35 + * DOM: whitespace img1 whitespace whitespace img3 whitespace,
1.36 + * a11y: img1 whitespace img3
1.37 + */
1.38 + function removeImg()
1.39 + {
1.40 + this.containerNode = getNode("container1");
1.41 + this.imgNode = getNode("img1");
1.42 + this.img = getAccessible(this.imgNode);
1.43 + this.text = this.img.nextSibling;
1.44 +
1.45 + this.eventSeq = [
1.46 + new invokerChecker(EVENT_HIDE, this.img),
1.47 + new invokerChecker(EVENT_HIDE, this.text),
1.48 + new invokerChecker(EVENT_REORDER, this.containerNode)
1.49 + ];
1.50 +
1.51 + this.finalCheck = function textLeafUpdate_finalCheck()
1.52 + {
1.53 + var tree =
1.54 + { SECTION: [
1.55 + { GRAPHIC: [] },
1.56 + { TEXT_LEAF: [] },
1.57 + { GRAPHIC: [] }
1.58 + ] };
1.59 +
1.60 + testAccessibleTree(this.containerNode, tree);
1.61 + }
1.62 +
1.63 + this.invoke = function setOnClickAttr_invoke()
1.64 + {
1.65 + var tree =
1.66 + { SECTION: [
1.67 + { GRAPHIC: [] },
1.68 + { TEXT_LEAF: [] },
1.69 + { GRAPHIC: [] },
1.70 + { TEXT_LEAF: [] },
1.71 + { GRAPHIC: [] }
1.72 + ] };
1.73 +
1.74 + testAccessibleTree(this.containerNode, tree);
1.75 +
1.76 + this.containerNode.removeChild(this.imgNode);
1.77 + }
1.78 +
1.79 + this.getID = function setOnClickAttr_getID()
1.80 + {
1.81 + return "remove middle img";
1.82 + }
1.83 + }
1.84 +
1.85 + /**
1.86 + * Append image making the whitespace visible and thus accessible.
1.87 + * Note: images and whitespaces are on different leves of accessible trees,
1.88 + * so that image container accessible update doesn't update the tree
1.89 + * of whitespace container.
1.90 + *
1.91 + * Before:
1.92 + * DOM: whitespace emptylink whitespace linkwithimg whitespace
1.93 + * a11y: emptylink linkwithimg
1.94 + * After:
1.95 + * DOM: whitespace linkwithimg whitespace linkwithimg whitespace
1.96 + * a11y: linkwithimg whitespace linkwithimg
1.97 + */
1.98 + function insertImg()
1.99 + {
1.100 + this.containerNode = getNode("container2");
1.101 + this.topNode = this.containerNode.parentNode;
1.102 + this.textNode = this.containerNode.nextSibling;
1.103 + this.imgNode = document.createElement("img");
1.104 + this.imgNode.setAttribute("src", "../moz.png");
1.105 +
1.106 + this.eventSeq = [
1.107 + new invokerChecker(EVENT_SHOW, getAccessible, this.imgNode),
1.108 + new invokerChecker(EVENT_SHOW, getAccessible, this.textNode),
1.109 + new invokerChecker(EVENT_REORDER, this.topNode)
1.110 + ];
1.111 +
1.112 + this.invoke = function insertImg_invoke()
1.113 + {
1.114 + var tree =
1.115 + { SECTION: [
1.116 + { LINK: [] },
1.117 + { LINK: [
1.118 + { GRAPHIC: [] }
1.119 + ] }
1.120 + ] };
1.121 +
1.122 + testAccessibleTree(this.topNode, tree);
1.123 +
1.124 + this.containerNode.appendChild(this.imgNode);
1.125 + }
1.126 +
1.127 + this.finalCheck = function insertImg_finalCheck()
1.128 + {
1.129 + var tree =
1.130 + { SECTION: [
1.131 + { LINK: [
1.132 + { GRAPHIC: [ ] }
1.133 + ] },
1.134 + { TEXT_LEAF: [ ] },
1.135 + { LINK: [
1.136 + { GRAPHIC: [ ] }
1.137 + ] }
1.138 + ] };
1.139 +
1.140 + testAccessibleTree(this.topNode, tree);
1.141 + }
1.142 +
1.143 + this.getID = function appendImg_getID()
1.144 + {
1.145 + return "insert img into internal container";
1.146 + }
1.147 + }
1.148 +
1.149 + ////////////////////////////////////////////////////////////////////////////
1.150 + // Test
1.151 +
1.152 + //gA11yEventDumpID = "eventdump"; // debug stuff
1.153 + //gA11yEventDumpToConsole = true;
1.154 +
1.155 + var gQueue = null;
1.156 +
1.157 + function doTest()
1.158 + {
1.159 + gQueue = new eventQueue();
1.160 +
1.161 + gQueue.push(new removeImg());
1.162 + gQueue.push(new insertImg());
1.163 +
1.164 + gQueue.invoke(); // SimpleTest.finish() will be called in the end
1.165 + }
1.166 +
1.167 + SimpleTest.waitForExplicitFinish();
1.168 + addA11yLoadEvent(doTest);
1.169 + </script>
1.170 +</head>
1.171 +<body>
1.172 +
1.173 + <a target="_blank"
1.174 + title="Make sure accessible tree is correct when rendered text is changed"
1.175 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=625652">
1.176 + Mozilla Bug 625652
1.177 + </a>
1.178 +
1.179 + <p id="display"></p>
1.180 + <div id="content" style="display: none"></div>
1.181 + <pre id="test">
1.182 + </pre>
1.183 +
1.184 + <div id="container1"> <img src="../moz.png"> <img id="img1" src="../moz.png"> <img src="../moz.png"> </div>
1.185 + <div> <a id="container2"></a> <a><img src="../moz.png"></a> </div>
1.186 +
1.187 + <div id="eventdump"></div>
1.188 +</body>
1.189 +</html>
