1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/dom/events/test/bug656379-1.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,180 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html>
1.6 +<!--
1.7 +https://bugzilla.mozilla.org/show_bug.cgi?id=656379
1.8 +-->
1.9 +<head>
1.10 + <title>Test for Bug 656379</title>
1.11 + <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
1.12 + <script type="application/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
1.13 + <script type="application/javascript" src="/tests/SimpleTest/WindowSnapshot.js"></script>
1.14 + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
1.15 + <style>
1.16 + canvas {
1.17 + display: none;
1.18 + }
1.19 + input[type=button] {
1.20 + -moz-appearance: none;
1.21 + padding: 0;
1.22 + border: none;
1.23 + color: black;
1.24 + background: white;
1.25 + }
1.26 + input[type=button]::-moz-focus-inner { border: none; }
1.27 +
1.28 + /* Make sure that normal, focused, hover+active, focused+hover+active
1.29 + buttons all have different styles so that the test keeps moving along. */
1.30 + input[type=button]:hover:active {
1.31 + background: red;
1.32 + }
1.33 + input[type=button]:focus {
1.34 + background: green;
1.35 + }
1.36 + input[type=button]:focus:hover:active {
1.37 + background: purple;
1.38 + }
1.39 + </style>
1.40 +</head>
1.41 +<body onload="runTests()">
1.42 +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=656379">Mozilla Bug 656379</a>
1.43 +<p id="display"></p>
1.44 +<div id="content" style="display: none">
1.45 +
1.46 +</div>
1.47 +<pre id="test">
1.48 +<script type="application/javascript;version=1.8">
1.49 +
1.50 +
1.51 +var normalButtonCanvas, pressedButtonCanvas, normalFocusedButtonCanvas,
1.52 + pressedFocusedButtonCanvas, currentSnapshot, button, label, outside;
1.53 +
1.54 +function runTests() {
1.55 + button = $("button");
1.56 + label = $("label");
1.57 + outside = $("outside");
1.58 + SimpleTest.executeSoon(executeTests);
1.59 +}
1.60 +
1.61 +function isRectContainedInRectFromRegion(rect, region) {
1.62 + return Array.some(region, function (r) {
1.63 + return rect.left >= r.left &&
1.64 + rect.top >= r.top &&
1.65 + rect.right <= r.right &&
1.66 + rect.bottom <= r.bottom;
1.67 + });
1.68 +}
1.69 +
1.70 +function paintListener(e) {
1.71 + if (isRectContainedInRectFromRegion(buttonRect(), SpecialPowers.wrap(e).clientRects)) {
1.72 + gNeedsPaint = false;
1.73 + currentSnapshot = takeSnapshot();
1.74 + }
1.75 +}
1.76 +
1.77 +var gNeedsPaint = false;
1.78 +function executeTests() {
1.79 + var testYielder = tests();
1.80 + function execNext() {
1.81 + try {
1.82 + if (!gNeedsPaint) {
1.83 + testYielder.next();
1.84 + button.getBoundingClientRect(); // Flush.
1.85 + gNeedsPaint = true;
1.86 + }
1.87 + SimpleTest.executeSoon(execNext);
1.88 + } catch (e) {}
1.89 + }
1.90 + execNext();
1.91 +}
1.92 +
1.93 +function tests() {
1.94 + window.addEventListener("MozAfterPaint", paintListener, false);
1.95 + normalButtonCanvas = takeSnapshot();
1.96 + // Press the button.
1.97 + sendMouseEvent("mousemove", button);
1.98 + sendMouseEvent("mousedown", button);
1.99 + yield undefined;
1.100 + pressedFocusedButtonCanvas = takeSnapshot();
1.101 + compareSnapshots_(normalButtonCanvas, pressedFocusedButtonCanvas, false, "Pressed focused buttons should look different from normal buttons.");
1.102 + // Release.
1.103 + sendMouseEvent("mouseup", button);
1.104 + yield undefined;
1.105 + // make sure the button is focused as this doesn't happen on click on Mac
1.106 + button.focus();
1.107 + normalFocusedButtonCanvas = takeSnapshot();
1.108 + compareSnapshots_(normalFocusedButtonCanvas, pressedFocusedButtonCanvas, false, "Pressed focused buttons should look different from normal focused buttons.");
1.109 + // Unfocus the button.
1.110 + sendMouseEvent("mousedown", outside);
1.111 + sendMouseEvent("mouseup", outside);
1.112 + yield undefined;
1.113 +
1.114 + // Press the label.
1.115 + sendMouseEvent("mousemove", label);
1.116 + sendMouseEvent("mousedown", label);
1.117 + yield undefined;
1.118 + compareSnapshots_(normalButtonCanvas, currentSnapshot, false, "Pressing the label should have pressed the button.");
1.119 + pressedButtonCanvas = takeSnapshot();
1.120 + // Move the mouse down from the label.
1.121 + sendMouseEvent("mousemove", outside);
1.122 + yield undefined;
1.123 + compareSnapshots_(normalButtonCanvas, currentSnapshot, true, "Moving the mouse down from the label should have unpressed the button.");
1.124 + // ... and up again.
1.125 + sendMouseEvent("mousemove", label);
1.126 + yield undefined;
1.127 + compareSnapshots_(pressedButtonCanvas, currentSnapshot, true, "Moving the mouse back on top of the label should have pressed the button.");
1.128 + // Release.
1.129 + sendMouseEvent("mouseup", label);
1.130 + yield undefined;
1.131 + compareSnapshots_(normalFocusedButtonCanvas, currentSnapshot, true, "Releasing the mouse over the label should have unpressed (and focused) the button.");
1.132 + // Press the label and remove it.
1.133 + sendMouseEvent("mousemove", label);
1.134 + sendMouseEvent("mousedown", label);
1.135 + yield undefined;
1.136 + label.parentNode.removeChild(label);
1.137 + yield undefined;
1.138 + compareSnapshots_(normalButtonCanvas, currentSnapshot, true, "Removing the label should have unpressed the button.");
1.139 + sendMouseEvent("mouseup", label);
1.140 + window.removeEventListener("MozAfterPaint", paintListener, false);
1.141 + window.opener.finishTests();
1.142 + }
1.143 +
1.144 +function sendMouseEvent(t, elem) {
1.145 + var r = elem.getBoundingClientRect();
1.146 + synthesizeMouse(elem, r.width / 2, r.height / 2, {type: t});
1.147 +}
1.148 +
1.149 +function compareSnapshots_(c1, c2, shouldBeIdentical, msg) {
1.150 + var [correct, c1url, c2url] = compareSnapshots(c1, c2, shouldBeIdentical);
1.151 + if (correct) {
1.152 + if (shouldBeIdentical) {
1.153 + window.opener.ok(true, msg + " - expected " + c1url);
1.154 + } else {
1.155 + window.opener.ok(true, msg + " - got " + c1url + " and " + c2url);
1.156 + }
1.157 + } else {
1.158 + if (shouldBeIdentical) {
1.159 + window.opener.ok(false, msg + " - expected " + c1url + " but got " + c2url);
1.160 + } else {
1.161 + window.opener.ok(false, msg + " - expected something other than " + c1url);
1.162 + }
1.163 + }
1.164 +}
1.165 +
1.166 +function takeSnapshot(canvas) {
1.167 + var r = buttonRect();
1.168 + adjustedRect = { left: r.left - 2, top: r.top - 2,
1.169 + width: r.width + 4, height: r.height + 4 };
1.170 + return SpecialPowers.snapshotRect(window, adjustedRect);
1.171 +}
1.172 +
1.173 +function buttonRect() {
1.174 + return button.getBoundingClientRect();
1.175 +}
1.176 +</script>
1.177 +</pre>
1.178 +<p><input type="button" value="Button" id="button"></p>
1.179 +<p><label for="button" id="label">Label</label></p>
1.180 +<p id="outside">Something under the label</p>
1.181 +
1.182 +</body>
1.183 +</html>
