1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/toolkit/content/tests/chrome/test_mousecapture.xul Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,327 @@
1.4 +<?xml version="1.0"?>
1.5 +<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
1.6 +<?xml-stylesheet href="chrome://mochikit/content/tests/SimpleTest/test.css" type="text/css"?>
1.7 +
1.8 +<window title="Mouse Capture Tests" align="start"
1.9 + xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
1.10 +
1.11 +<script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
1.12 +<script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
1.13 +
1.14 +<script>
1.15 +<![CDATA[
1.16 +
1.17 +SimpleTest.expectAssertions(6);
1.18 +
1.19 +SimpleTest.waitForExplicitFinish();
1.20 +
1.21 +var captureRetargetMode = false;
1.22 +var cachedMouseDown = null;
1.23 +var previousWidth = 0, originalWidth = 0;
1.24 +var loadInWindow = false;
1.25 +
1.26 +function splitterCallback(adjustment)
1.27 +{
1.28 + var newWidth = Number($("leftbox").width); // getBoundingClientRect().width;
1.29 + var expectedWidth = previousWidth + adjustment;
1.30 + if (expectedWidth > $("splitterbox").getBoundingClientRect().width)
1.31 + expectedWidth = $("splitterbox").getBoundingClientRect().width - $("splitter").getBoundingClientRect().width;
1.32 + is(newWidth, expectedWidth, "splitter left box size (" + adjustment + ")");
1.33 + previousWidth = newWidth;
1.34 +}
1.35 +
1.36 +function selectionCallback(adjustment)
1.37 +{
1.38 + if (adjustment == 4000) {
1.39 + is(frames[0].getSelection().toString(), "This is some text", "selection after drag (" + adjustment + ")");
1.40 + ok(frames[0].scrollY > 40, "selection caused scroll down (" + adjustment + ")");
1.41 + }
1.42 + else {
1.43 + if (adjustment == 0) {
1.44 + is(frames[0].getSelection().toString(), ".", "selection after drag (" + adjustment + ")");
1.45 + }
1.46 + is(frames[0].scrollY, 0, "selection scrollY (" + adjustment + ")");
1.47 + }
1.48 +}
1.49 +
1.50 +function framesetCallback(adjustment)
1.51 +{
1.52 + var newWidth = frames[1].frames[0].document.documentElement.clientWidth;
1.53 + var expectedWidth = originalWidth + adjustment;
1.54 + if (adjustment == 0)
1.55 + expectedWidth = originalWidth - 12;
1.56 + else if (expectedWidth >= 4000)
1.57 + expectedWidth = originalWidth * 2 - 2;
1.58 +
1.59 + is(newWidth, expectedWidth, "frameset after drag (" + adjustment + ")");
1.60 +}
1.61 +
1.62 +var otherWindow = null;
1.63 +
1.64 +function selectionScrollCheck()
1.65 +{
1.66 + var element = otherWindow.document.documentElement;
1.67 +
1.68 + var count = 0;
1.69 + function selectionScrollDone() {
1.70 + // wait for 6 scroll events to occur
1.71 + if (count++ < 6)
1.72 + return;
1.73 +
1.74 + otherWindow.removeEventListener("scroll", selectionScrollDone, false);
1.75 +
1.76 + var selectedText = otherWindow.getSelection().toString().replace(/\r/g, "");
1.77 + is(selectedText, "One\n\nTwo", "text is selected");
1.78 +
1.79 + // should have scrolled 20 pixels from the mousemove above and six extra
1.80 + // times from the selection scroll timer for a total of 140
1.81 + var oldScrollY = otherWindow.scrollY;
1.82 + is(otherWindow.scrollY, 140, "selection scroll position after timer");
1.83 +
1.84 + synthesizeMouse(element, 4, otherWindow.innerHeight + 25, { type: "mouseup" }, otherWindow);
1.85 + disableNonTestMouseEvents(false);
1.86 + otherWindow.close();
1.87 +
1.88 + if (loadInWindow) {
1.89 + SimpleTest.finish();
1.90 + }
1.91 + else {
1.92 + // now try again, but open the page in a new window
1.93 + loadInWindow = true;
1.94 + synthesizeMouse(document.getElementById("custom"), 2, 2, { type: "mousedown" });
1.95 +
1.96 + // check to ensure that selection dragging scrolls the right scrollable area
1.97 + otherWindow = window.open("data:text/html,<html><p>One</p><p style='margin-top: 200px;'>Two</p><p style='margin-top: 4000px'>This is some text</p></html>", "_blank", "width=200,height=200,scrollbars=yes");
1.98 + otherWindow.addEventListener("load", function() { SimpleTest.waitForFocus(selectionScrollCheck, otherWindow); }, false);
1.99 + }
1.100 + }
1.101 +
1.102 + SimpleTest.executeSoon(function () {
1.103 + disableNonTestMouseEvents(true);
1.104 + synthesizeMouse(element, 2, 2, { type: "mousedown" }, otherWindow);
1.105 + synthesizeMouse(element, 100, otherWindow.innerHeight + 20, { type: "mousemove" }, otherWindow);
1.106 + otherWindow.addEventListener("scroll", selectionScrollDone, false);
1.107 + });
1.108 +}
1.109 +
1.110 +function runTests()
1.111 +{
1.112 + previousWidth = $("leftbox").getBoundingClientRect().width;
1.113 + runCaptureTest($("splitter"), splitterCallback);
1.114 +
1.115 + var custom = document.getElementById("custom");
1.116 + runCaptureTest(custom);
1.117 +
1.118 + synthesizeMouseExpectEvent($("rightbox"), 2, 2, { type: "mousemove" },
1.119 + $("rightbox"), "mousemove", "setCapture and releaseCapture");
1.120 +
1.121 + custom.setCapture();
1.122 + synthesizeMouseExpectEvent($("leftbox"), 2, 2, { type: "mousemove" },
1.123 + $("leftbox"), "mousemove", "setCapture fails on non mousedown");
1.124 +
1.125 + var custom2 = document.getElementById("custom2");
1.126 + synthesizeMouse(custom2, 2, 2, { type: "mousedown" });
1.127 + synthesizeMouseExpectEvent($("leftbox"), 2, 2, { type: "mousemove" },
1.128 + $("leftbox"), "mousemove", "document.releaseCapture releases capture");
1.129 +
1.130 + var custom3 = document.getElementById("custom3");
1.131 + synthesizeMouse(custom3, 2, 2, { type: "mousedown" });
1.132 + synthesizeMouseExpectEvent($("leftbox"), 2, 2, { type: "mousemove" },
1.133 + $("leftbox"), "mousemove", "element.releaseCapture releases capture");
1.134 +
1.135 + var custom4 = document.getElementById("custom4");
1.136 + synthesizeMouse(custom4, 2, 2, { type: "mousedown" });
1.137 + synthesizeMouseExpectEvent($("leftbox"), 2, 2, { type: "mousemove" },
1.138 + custom4, "mousemove", "element.releaseCapture during mousemove before releaseCapture");
1.139 + synthesizeMouseExpectEvent($("leftbox"), 2, 2, { type: "mousemove" },
1.140 + $("leftbox"), "mousemove", "element.releaseCapture during mousemove after releaseCapture");
1.141 +
1.142 + var custom5 = document.getElementById("custom5");
1.143 + runCaptureTest(custom5);
1.144 + captureRetargetMode = true;
1.145 + runCaptureTest(custom5);
1.146 + captureRetargetMode = false;
1.147 +
1.148 + var custom6 = document.getElementById("custom6");
1.149 + synthesizeMouse(custom6, 2, 2, { type: "mousedown" });
1.150 + synthesizeMouseExpectEvent($("leftbox"), 2, 2, { type: "mousemove" },
1.151 + $("leftbox"), "mousemove", "setCapture only works on elements in documents");
1.152 + synthesizeMouse(custom6, 2, 2, { type: "mouseup" });
1.153 +
1.154 + // test that mousedown on an image with setCapture followed by a big enough
1.155 + // mouse move does not start a drag (bug 517737)
1.156 + var image = document.getElementById("image");
1.157 + synthesizeMouse(image, 2, 2, { type: "mousedown" });
1.158 + synthesizeMouseExpectEvent($("leftbox"), 2, 2, { type: "mousemove" },
1.159 + image, "mousemove", "setCapture works on images");
1.160 + synthesizeMouse(image, 2, 2, { type: "mouseup" });
1.161 +
1.162 + // save scroll
1.163 + var scrollX = parent ? parent.scrollX : 0;
1.164 + var scrollY = parent ? parent.scrollY : 0;
1.165 +
1.166 + var b = frames[0].document.getElementById("b");
1.167 +// runCaptureTest(b, selectionCallback);
1.168 +
1.169 + // restore scroll
1.170 + if (parent) parent.scroll(scrollX, scrollY);
1.171 +
1.172 +// frames[0].getSelection().collapseToStart();
1.173 +
1.174 + var body = frames[0].document.body;
1.175 + var fixed = frames[0].document.getElementById("fixed");
1.176 + function captureOnBody() { body.setCapture() }
1.177 + body.addEventListener("mousedown", captureOnBody, true);
1.178 + synthesizeMouse(body, 8, 8, { type: "mousedown" }, frames[0]);
1.179 + body.removeEventListener("mousedown", captureOnBody, true);
1.180 + synthesizeMouseExpectEvent(fixed, 2, 2, { type: "mousemove" },
1.181 + fixed, "mousemove", "setCapture on body retargets to root node", frames[0]);
1.182 + synthesizeMouse(body, 8, 8, { type: "mouseup" }, frames[0]);
1.183 +
1.184 + previousWidth = frames[1].frames[0].document.documentElement.clientWidth;
1.185 + originalWidth = previousWidth;
1.186 + runCaptureTest(frames[1].document.documentElement.lastChild, framesetCallback);
1.187 +
1.188 + // ensure that clicking on an element where the frame disappears doesn't crash
1.189 + synthesizeMouse(frames[2].document.getElementById("input"), 8, 8, { type: "mousedown" }, frames[2]);
1.190 + synthesizeMouse(frames[2].document.getElementById("input"), 8, 8, { type: "mouseup" }, frames[2]);
1.191 +
1.192 + synthesizeMouse(document.getElementById("option3"), 2, 2, { type: "mousedown" });
1.193 + synthesizeMouse(document.getElementById("option3"), 2, 1000, { type: "mousemove" });
1.194 + var select = document.getElementById("select");
1.195 + is(select.selectedIndex, 9, "scroll select");
1.196 + synthesizeMouse(document.getElementById("select"), 2, 2, { type: "mouseup" });
1.197 +
1.198 + synthesizeMouse(custom, 2, 2, { type: "mousedown" });
1.199 +
1.200 + // check to ensure that selection dragging scrolls the right scrollable area.
1.201 + // This should open the page in a new tab.
1.202 +
1.203 + var topPos = window.innerHeight;
1.204 + otherWindow = window.open("data:text/html,<html><p>One</p><p style='margin-top: " + topPos + "'>Two</p><p style='margin-top: 4000px'>This is some text</p></html>", "_blank");
1.205 + otherWindow.addEventListener("load", function() { SimpleTest.waitForFocus(selectionScrollCheck, otherWindow); }, false);
1.206 +}
1.207 +
1.208 +function runCaptureTest(element, callback)
1.209 +{
1.210 + var expectedTarget = null;
1.211 +
1.212 + var win = element.ownerDocument.defaultView;
1.213 +
1.214 + function mouseMoved(event) {
1.215 + is(event.originalTarget, expectedTarget,
1.216 + expectedTarget.id + " target for point " + event.clientX + "," + event.clientY);
1.217 + }
1.218 + win.addEventListener("mousemove", mouseMoved, false);
1.219 +
1.220 + expectedTarget = element;
1.221 +
1.222 + var basepoint = element.localName == "frameset" ? 50 : 2;
1.223 + synthesizeMouse(element, basepoint, basepoint, { type: "mousedown" }, win);
1.224 +
1.225 + // in setCapture(true) mode, all events should fire on custom5. In
1.226 + // setCapture(false) mode, events can fire at a descendant
1.227 + if (expectedTarget == $("custom5") && !captureRetargetMode)
1.228 + expectedTarget = $("custom5spacer");
1.229 +
1.230 + // releaseCapture should do nothing for an element which isn't capturing
1.231 + $("splitterbox").releaseCapture();
1.232 +
1.233 + synthesizeMouse(element, basepoint + 2, basepoint + 2, { type: "mousemove" }, win);
1.234 + if (callback)
1.235 + callback(2);
1.236 +
1.237 + if (expectedTarget == $("custom5spacer") && !captureRetargetMode)
1.238 + expectedTarget = $("custom5inner");
1.239 +
1.240 + if (element.id == "b") {
1.241 + var tooltip = document.getElementById("tooltip");
1.242 + tooltip.openPopup();
1.243 + tooltip.hidePopup();
1.244 + }
1.245 +
1.246 + synthesizeMouse(element, basepoint + 25, basepoint + 25, { type: "mousemove" }, win);
1.247 + if (callback)
1.248 + callback(25);
1.249 +
1.250 + expectedTarget = element.localName == "b" ? win.document.documentElement : element;
1.251 + synthesizeMouse(element, basepoint + 4000, basepoint + 4000, { type: "mousemove" }, win);
1.252 + if (callback)
1.253 + callback(4000);
1.254 + synthesizeMouse(element, basepoint - 12, basepoint - 12, { type: "mousemove" }, win);
1.255 + if (callback)
1.256 + callback(-12);
1.257 +
1.258 + expectedTarget = element.localName == "frameset" ? element : win.document.documentElement;
1.259 + synthesizeMouse(element, basepoint + 30, basepoint + 30, { type: "mouseup" }, win);
1.260 + synthesizeMouse(win.document.documentElement, 2, 2, { type: "mousemove" }, win);
1.261 + if (callback)
1.262 + callback(0);
1.263 +
1.264 + win.removeEventListener("mousemove", mouseMoved, false);
1.265 +}
1.266 +
1.267 +SimpleTest.waitForFocus(runTests);
1.268 +
1.269 +]]>
1.270 +</script>
1.271 +
1.272 +<tooltip id="tooltip">
1.273 + <label value="Test"/>
1.274 +</tooltip>
1.275 +
1.276 +<hbox id="splitterbox" style="margin-top: 5px;" onmousedown="this.setCapture()">
1.277 + <hbox id="leftbox" width="100" flex="1"/>
1.278 + <splitter id="splitter" height="5"/>
1.279 + <hbox id="rightbox" width="100" flex="1"/>
1.280 +</hbox>
1.281 +
1.282 +<vbox id="custom" width="10" height="10" onmousedown="this.setCapture(); cachedMouseDown = event;"/>
1.283 +<vbox id="custom2" width="10" height="10" onmousedown="this.setCapture(); document.releaseCapture();"/>
1.284 +<vbox id="custom3" width="10" height="10" onmousedown="this.setCapture(); this.releaseCapture();"/>
1.285 +<vbox id="custom4" width="10" height="10" onmousedown="this.setCapture();"
1.286 + onmousemove="this.releaseCapture();"/>
1.287 +<hbox id="custom5" width="40" height="40"
1.288 + onmousedown="this.setCapture(captureRetargetMode);">
1.289 + <spacer id="custom5spacer" width="5"/>
1.290 + <hbox id="custom5inner" width="35" height="35"/>
1.291 +</hbox>
1.292 +<vbox id="custom6" width="10" height="10"
1.293 + onmousedown="document.createElement('hbox').setCapture();"/>
1.294 +
1.295 +<hbox>
1.296 + <iframe width="100" height="100"
1.297 + src="data:text/html,%3Cbody style%3D'font-size%3A 40pt%3B'%3E.%3Cb id%3D'b'%3EThis%3C/b%3E is some text%3Cdiv id='fixed' style='position: fixed; left: 55px; top: 5px; width: 10px; height: 10px'%3E.%3C/div%3E%3C/body%3E"/>
1.298 +
1.299 + <iframe width="100" height="100"
1.300 + src="data:text/html,%3Cframeset cols='50%, 50%'%3E%3Cframe src='about:blank'%3E%3Cframe src='about:blank'%3E%3C/frameset%3E"/>
1.301 +
1.302 + <iframe width="100" height="100"
1.303 + src="data:text/html,%3Cinput id='input' onfocus='this.style.display = "none"' style='float: left;'>"/>
1.304 +
1.305 + <select id="select" xmlns="http://www.w3.org/1999/xhtml" size="4">
1.306 + <option id="option1">One</option>
1.307 + <option id="option2">Two</option>
1.308 + <option id="option3">Three</option>
1.309 + <option id="option4">Four</option>
1.310 + <option id="option5">Five</option>
1.311 + <option id="option6">Six</option>
1.312 + <option id="option7">Seven</option>
1.313 + <option id="option8">Eight</option>
1.314 + <option id="option9">Nine</option>
1.315 + <option id="option10">Ten</option>
1.316 + </select>
1.317 +</hbox>
1.318 +
1.319 +<hbox>
1.320 + <img id="image" xmlns="http://www.w3.org/1999/xhtml"
1.321 + onmousedown="this.setCapture();" onmouseup="this.releaseCapture();"
1.322 + ondragstart="ok(false, 'should not get a drag when a setCapture is active');"
1.323 + src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAAG0lEQVR42mP8z0A%2BYKJA76jmUc2jmkc1U0EzACKcASfOgGoMAAAAAElFTkSuQmCC"/>
1.324 +</hbox>
1.325 +
1.326 +<body id="body" xmlns="http://www.w3.org/1999/xhtml">
1.327 + <p id="display"/><div id="content" style="display: none"/><pre id="test"/>
1.328 +</body>
1.329 +
1.330 +</window>
