1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/dom/events/test/test_bug238987.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,292 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html>
1.6 +<!--
1.7 +https://bugzilla.mozilla.org/show_bug.cgi?id=238987
1.8 +-->
1.9 +<head>
1.10 + <title>Test for Bug 238987</title>
1.11 + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
1.12 + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
1.13 +</head>
1.14 +<body>
1.15 +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=238987">Mozilla Bug 238987</a>
1.16 +<p id="display"></p>
1.17 +<div id="content" style="display: none">
1.18 +
1.19 +</div>
1.20 +<pre id="test">
1.21 +<script class="testbody" type="text/javascript">
1.22 +
1.23 + /** Test for Bug 238987 **/
1.24 +
1.25 + var shouldStop = false;
1.26 + var modifier = 0;
1.27 + var expectedResult = "i1,i2,i3,i4,i5,i6,i7,i8,number,i9,i10,i11,i12";
1.28 + var forwardFocusArray = expectedResult.split(",");
1.29 + var backwardFocusArray = expectedResult.split(",");
1.30 + var forwardBlurArray = expectedResult.split(",");
1.31 + var backwardBlurArray = expectedResult.split(",");
1.32 + // Adding 3 for "begin", "end", "begin" and one for the <a> in the Mochitest template,
1.33 + var expectedWindowFocusCount = forwardFocusArray.length + backwardFocusArray.length + 4;
1.34 + // but the last blur event goes to i1, not "begin".
1.35 + var expectedWindowBlurCount = forwardFocusArray.length + backwardFocusArray.length + 3;
1.36 +
1.37 + // accessibility.tabfocus must be set to value 7 before running test also
1.38 + // on a mac.
1.39 + function setOrRestoreTabFocus(newValue) {
1.40 + if (!newValue) {
1.41 + SpecialPowers.clearUserPref("accessibility.tabfocus");
1.42 + } else {
1.43 + SpecialPowers.setIntPref("accessibility.tabfocus", newValue);
1.44 + }
1.45 + }
1.46 +
1.47 + function handleFocus(e) {
1.48 + if (e.target.id == "begin") {
1.49 + // if the modifier is set, the test is coming back from the end.
1.50 + if (modifier) {
1.51 + shouldStop = true;
1.52 + }
1.53 + } else if (e.target.id == "end") {
1.54 + modifier = Components.interfaces.nsIDOMEvent.SHIFT_MASK;
1.55 + } else if (modifier) {
1.56 + var expected = backwardFocusArray.pop();
1.57 + ok(expected == e.target.id,
1.58 + "(focus) Backward tabbing, expected [" +
1.59 + expected + "], got [" + e.target.id + "]");
1.60 + } else {
1.61 + var expected = forwardFocusArray.shift();
1.62 + is(e.target, document.activeElement, "Wrong activeElement!");
1.63 + ok(expected == e.target.id,
1.64 + "(focus) Forward tabbing, expected [" +
1.65 + expected + "], got [" + e.target.id + "]");
1.66 + }
1.67 + }
1.68 +
1.69 + function handleWindowFocus(e) {
1.70 + --expectedWindowFocusCount;
1.71 + var s = "target " + e.target;
1.72 + if ("id" in e.target) {
1.73 + s = s + ", id=\"" + e.target.id + "\"";
1.74 + }
1.75 + ok(e.eventPhase == Components.interfaces.nsIDOMEvent.CAPTURING_PHASE,
1.76 + "|window| should not have got a focus event, " + s);
1.77 + }
1.78 +
1.79 + function handleBlur(e) {
1.80 + if (e.target.id == "begin" || e.target.id == "end") {
1.81 + return;
1.82 + } else if (modifier) {
1.83 + var expected = backwardBlurArray.pop();
1.84 + ok(expected == e.target.id,
1.85 + "(blur) backward tabbing, expected [" +
1.86 + expected + "], got [" + e.target.id + "]");
1.87 + } else {
1.88 + var expected = forwardBlurArray.shift();
1.89 + ok(expected == e.target.id,
1.90 + "(blur) forward tabbing, expected [" +
1.91 + expected + "], got [" + e.target.id + "]");
1.92 + }
1.93 + }
1.94 +
1.95 + function handleWindowBlur(e) {
1.96 + --expectedWindowBlurCount;
1.97 + var s = "target " + e.target;
1.98 + if ("id" in e.target) {
1.99 + s = s + ", id=\"" + e.target.id + "\"";
1.100 + }
1.101 + ok(e.eventPhase == Components.interfaces.nsIDOMEvent.CAPTURING_PHASE,
1.102 + "|window| should not have got a blur event, " + s);
1.103 + }
1.104 +
1.105 + function tab() {
1.106 + var utils = SpecialPowers.DOMWindowUtils;
1.107 + // Send tab key events.
1.108 + var key = Components.interfaces.nsIDOMKeyEvent.DOM_VK_TAB;
1.109 + utils.sendKeyEvent("keydown", key, 0, modifier);
1.110 + utils.sendKeyEvent("keypress", key, 0, modifier);
1.111 + utils.sendKeyEvent("keyup", key, 0, modifier);
1.112 + if (shouldStop) {
1.113 + // Did focus handling succeed
1.114 + is(forwardFocusArray.length, 0,
1.115 + "Not all forward tabbing focus tests were run, " +
1.116 + forwardFocusArray.toString());
1.117 + is(backwardFocusArray.length, 0,
1.118 + "Not all backward tabbing focus tests were run, " +
1.119 + backwardFocusArray.toString());
1.120 + is(expectedWindowFocusCount, 0,
1.121 + "|window| didn't get the right amount of focus events");
1.122 +
1.123 + // and blur.
1.124 + is(forwardBlurArray.length, 0,
1.125 + "Not all forward tabbing blur tests were run, " +
1.126 + forwardBlurArray.toString());
1.127 + is(backwardBlurArray.length, 0,
1.128 + "Not all backward tabbing blur tests were run, " +
1.129 + backwardBlurArray.toString());
1.130 + is(expectedWindowBlurCount, 0,
1.131 + "|window| didn't get the right amount of blur events");
1.132 +
1.133 + // Cleanup
1.134 + setOrRestoreTabFocus(0);
1.135 + window.removeEventListener("focus", handleWindowFocus, true);
1.136 + window.removeEventListener("focus", handleWindowFocus, false);
1.137 + window.removeEventListener("blur", handleWindowBlur, true);
1.138 + window.removeEventListener("blur", handleWindowBlur, false);
1.139 + var elements = document.getElementsByTagName("*");
1.140 + for (var i = 0; i < elements.length; ++i) {
1.141 + if (elements[i].hasAttribute("id")) {
1.142 + elements[i].removeEventListener("focus", handleFocus, false);
1.143 + elements[i].removeEventListener("blur", handleBlur, false);
1.144 + }
1.145 + }
1.146 +
1.147 + SimpleTest.finish();
1.148 + } else {
1.149 + setTimeout(tab, 0);
1.150 + }
1.151 + }
1.152 +
1.153 + function start() {
1.154 + window.focus();
1.155 + window.addEventListener("focus", handleWindowFocus, true);
1.156 + window.addEventListener("focus", handleWindowFocus, false);
1.157 + window.addEventListener("blur", handleWindowBlur, true);
1.158 + window.addEventListener("blur", handleWindowBlur, false);
1.159 + var elements = document.getElementsByTagName("*");
1.160 + for (var i = 0; i < elements.length; ++i) {
1.161 + if (elements[i].hasAttribute("id")) {
1.162 + elements[i].addEventListener("focus", handleFocus, false);
1.163 + elements[i].addEventListener("blur", handleBlur, false);
1.164 + }
1.165 + if (elements[i].getAttribute("tabindex") == "1") {
1.166 + elements[i].setAttribute("tabindex", "-1");
1.167 + }
1.168 + }
1.169 + tab();
1.170 + }
1.171 +
1.172 + function doTest() {
1.173 + setOrRestoreTabFocus(7);
1.174 + setTimeout(start, 0);
1.175 + }
1.176 +
1.177 + SimpleTest.waitForExplicitFinish();
1.178 + addLoadEvent(doTest);
1.179 +
1.180 +</script>
1.181 +</pre>
1.182 + <h4 tabindex="0" id="begin">Test:</h4>
1.183 + <table>
1.184 + <tbody>
1.185 + <tr>
1.186 + <td>type="text"</td><td><input type="text" id="i1" value=""></td>
1.187 + </tr>
1.188 + <tr>
1.189 + <td>type="button"</td><td><input type="button" id="i2" value="type='button'"></td>
1.190 + </tr>
1.191 + <tr>
1.192 + <td>type="checkbox"</td><td><input type="checkbox" id="i3" ></td>
1.193 + </tr>
1.194 + <tr>
1.195 + <td>type="radio" checked</td><td><input type="radio" id="i4" name="radio" checked>
1.196 + <input type="radio" id="i4b" name="radio"></td>
1.197 + </tr>
1.198 + <tr>
1.199 + <td>type="radio"</td><td><input type="radio" id="i5" name="radio2">
1.200 + <input type="radio" id="i6" name="radio2"></td>
1.201 + </tr>
1.202 + <tr>
1.203 + <td>type="password"</td><td><input type="password" id="i7"></td>
1.204 + </tr>
1.205 + <tr>
1.206 + <td>type="file"</td><td><input type="file" id="i8"></td>
1.207 + </tr>
1.208 + <tr>
1.209 + <td>type="number"</td><td><input type="number" id="number"></td>
1.210 + </tr>
1.211 + <tr>
1.212 + <td>button</td><td><button id="i9">button</button></td>
1.213 + </tr>
1.214 + <tr>
1.215 + <td>select</td><td><select id="i10"><option>select</option></select></td>
1.216 + </tr>
1.217 + <tr>
1.218 + <td>a</td><td><a href="#radio" id="i11">a link</a></td>
1.219 + </tr>
1.220 + <tr>
1.221 + <td>tabindex="0"</td><td><span tabindex="0" id="i12">span</span></td>
1.222 + </tr>
1.223 +
1.224 + <tr>
1.225 + <td><h3>Form elements with tabindex="-1"</h3></td>
1.226 + </tr>
1.227 + <tr>
1.228 + <td>type="text"</td><td><input type="text" tabindex="-1" value=""></td>
1.229 + </tr>
1.230 + <tr>
1.231 + <td>type="button"</td><td><input type="button" tabindex="-1" value="type='button'"></td>
1.232 + </tr>
1.233 + <tr>
1.234 + <td>type="checkbox"</td><td><input type="checkbox" tabindex="-1"></td>
1.235 + </tr>
1.236 + <tr>
1.237 + <td>type="radio" checked</td><td><input type="radio" tabindex="-1" name="radio3" checked>
1.238 + <input type="radio" tabindex="-1" name="radio3"></td>
1.239 + </tr>
1.240 + <tr>
1.241 + <td>type="radio"</td><td><input type="radio" tabindex="-1" name="radio4">
1.242 + <input type="radio" tabindex="-1" name="radio4"></td>
1.243 + </tr>
1.244 + <tr>
1.245 + <td>type="password"</td><td><input type="password" tabindex="-1"></td>
1.246 + </tr>
1.247 + <tr>
1.248 + <td>type="file"</td><td><input type="file" tabindex="-1"></td>
1.249 + </tr>
1.250 + <tr>
1.251 + <td>button</td><td><button tabindex="-1">button</button></td>
1.252 + </tr>
1.253 + <tr>
1.254 + <td>select</td><td><select tabindex="-1"><option>select</option></select></td>
1.255 + </tr>
1.256 +
1.257 + <tr>
1.258 + <td><h3>Form elements with .setAttribute("tabindex", "-1")</h3></td>
1.259 + </tr>
1.260 + <tr>
1.261 + <td>type="text"</td><td><input type="text" tabindex="1" value=""></td>
1.262 + </tr>
1.263 + <tr>
1.264 + <td>type="button"</td><td><input type="button" tabindex="1" value="type='button'"></td>
1.265 + </tr>
1.266 + <tr>
1.267 + <td>type="checkbox"</td><td><input type="checkbox" tabindex="1"></td>
1.268 + </tr>
1.269 + <tr>
1.270 + <td>type="radio" checked</td><td><input type="radio" tabindex="1" name="radio5" checked>
1.271 + <input type="radio" tabindex="1" name="radio5"></td>
1.272 + </tr>
1.273 + <tr>
1.274 + <td>type="radio"</td><td><input type="radio" tabindex="1" name="radio6">
1.275 + <input type="radio" tabindex="1" name="radio6"></td>
1.276 + </tr>
1.277 + <tr>
1.278 + <td>type="password"</td><td><input type="password" tabindex="1"></td>
1.279 + </tr>
1.280 + <tr>
1.281 + <td>type="file"</td><td><input type="file" tabindex="1"></td>
1.282 + </tr>
1.283 + <tr>
1.284 + <td>button</td><td><button tabindex="1">button</button></td>
1.285 + </tr>
1.286 + <tr>
1.287 + <td>select</td><td><select tabindex="1"><option>select</option></select></td>
1.288 + </tr>
1.289 +
1.290 + </tbody>
1.291 + </table>
1.292 + <h4 tabindex="0" id="end">done.</h4>
1.293 +</body>
1.294 +</html>
1.295 +
