Bug 1093686 - Add a test to ensure event listeners on the body don't affect event retargeting. r=roc
☠☠ backed out by 6f32afb5f7c2 ☠ ☠
authorKartikaya Gupta <kgupta@mozilla.com>
Thu, 06 Nov 2014 08:05:51 -0500
changeset 214392 f1989cb41965b06f4d3db89764c3606ee136814a
parent 214391 0c95949fef141b5745d06eef4a377e0b774a94ca
child 214393 e2a1f8575950dc6f5a9cdb54ef2b2fa39a043904
push id27780
push userkwierso@gmail.com
push dateFri, 07 Nov 2014 02:25:05 +0000
treeherdermozilla-central@e6d47abb6a7b [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersroc
bugs1093686
milestone36.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1093686 - Add a test to ensure event listeners on the body don't affect event retargeting. r=roc
layout/base/tests/bug1093686_inner.html
layout/base/tests/mochitest.ini
layout/base/tests/test_bug1093686.html
new file mode 100644
--- /dev/null
+++ b/layout/base/tests/bug1093686_inner.html
@@ -0,0 +1,84 @@
+<!DOCTYPE HTML>
+<html id="html" style="height:100%">
+<head>
+  <title>Testing effect of listener on body</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <script type="application/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <style>
+  .target { position:absolute; left:200px; top:200px; width:200px; height:200px; background:blue; }
+  </style>
+</head>
+<body id="body" onload="setTimeout(runTest, 0)" style="margin:0; width:100%; height:100%; overflow:hidden">
+<div id="content">
+  <div id="ruler" style="position:absolute; left:0; top:0; width:1mozmm; height:0;"></div>
+  <div class="target" id="t"></div>
+</div>
+<pre id="test">
+<script type="application/javascript">
+var eventTarget;
+window.onmousedown = function(event) { eventTarget = event.target; };
+
+// Make sure the target div is "clickable" by adding a click listener on it.
+document.getElementById('t').addEventListener('click', function(e) {
+  parent.ok(true, "target was clicked on");
+}, false);
+
+// Helper functions
+
+function testMouseClick(aX, aY, aExpectedId, aMsg) {
+  eventTarget = null;
+  synthesizeMouseAtPoint(aX, aY, {});
+  try {
+    parent.is(eventTarget.id, aExpectedId,
+       "checking offset " + aX + "," + aY + " hit " + aExpectedId + " [" + aMsg + "]");
+  } catch (ex) {
+    parent.ok(false, "checking offset " + aX + "," + aY + " hit " + aExpectedId + " [" + aMsg + "]; got " + eventTarget);
+  }
+}
+
+function testWithAndWithoutBodyListener(aX, aY, aExpectedId, aMsg) {
+  var func = function(e) {
+    // no-op function
+    parent.ok(true, "body was clicked on");
+  };
+  testMouseClick(aX, aY, aExpectedId, aMsg + " without listener on body");
+  document.body.addEventListener("click", func, false);
+  testMouseClick(aX, aY, aExpectedId, aMsg + " with listener on body");
+  document.body.removeEventListener("click", func, false);
+}
+
+// Main tests
+
+var mm;
+function runTest() {
+  mm = document.getElementById("ruler").getBoundingClientRect().width;
+  parent.ok(4*mm >= 10, "WARNING: mm " + mm + " too small in this configuration. Test results will be bogus");
+
+  // Test near the target, check it hits the target
+  testWithAndWithoutBodyListener(200 - 2*mm, 200 - 2*mm, "t", "basic click retargeting");
+  // Test on the target, check it hits the target
+  testWithAndWithoutBodyListener(200 + 15*mm, 200 + 15*mm, "t", "direct click");
+  // Test outside the target, check it hits the root
+  testWithAndWithoutBodyListener(40, 40, "body", "click way outside target");
+
+  SpecialPowers.pushPrefEnv({"set": [["ui.mouse.radius.enabled", false]]}, runTest2);
+}
+
+function runTest2() {
+  // In this test, mouse event retargeting is disabled.
+
+  // Test near the target, check it hits the body
+  testWithAndWithoutBodyListener(200 - 2*mm, 200 - 2*mm, "body", "basic click retargeting");
+  // Test on the target, check it hits the target
+  testWithAndWithoutBodyListener(200 + 15*mm, 200 + 15*mm, "t", "direct click");
+  // Test outside the target, check it hits the root
+  testWithAndWithoutBodyListener(40, 40, "body", "click way outside target");
+
+  parent.finishTest();
+}
+
+</script>
+</pre>
+</body>
+</html>
--- a/layout/base/tests/mochitest.ini
+++ b/layout/base/tests/mochitest.ini
@@ -501,8 +501,10 @@ support-files =
 [test_bug1070851.html]
 [test_bug1080360.html]
 support-files = bug1080360_inner.html
 [test_bug1078327.html]
 support-files = bug1078327_inner.html
 [test_bug1080361.html]
 support-files = bug1080361_inner.html
 [test_touchcaret_visibility.html]
+[test_bug1093686.html]
+support-files = bug1093686_inner.html
new file mode 100644
--- /dev/null
+++ b/layout/base/tests/test_bug1093686.html
@@ -0,0 +1,41 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=1093686
+-->
+  <head>
+    <meta charset="utf-8">
+    <title>Testing effect of listener on body with respect to event retargeting</title>
+    <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+    <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+    <script type="text/javascript">
+      var iframe = undefined;
+      function prepareTest() {
+        SimpleTest.waitForExplicitFinish();
+        iframe = document.getElementById("testFrame");
+        turnOnEventRetargeting(startTest);
+      }
+      function turnOnEventRetargeting(callback) {
+        SpecialPowers.pushPrefEnv({
+          "set": [
+            ["ui.mouse.radius.enabled", true],
+            ["ui.mouse.radius.inputSource.touchOnly", false],
+            ["ui.mouse.radius.leftmm", 8],
+            ["ui.mouse.radius.topmm", 12],
+            ["ui.mouse.radius.rightmm", 8],
+            ["ui.mouse.radius.bottommm", 4]
+          ]
+        }, callback);
+      }
+      function startTest() {
+        iframe.src = "bug1093686_inner.html";
+      }
+      function finishTest() {
+        SimpleTest.finish();
+      }
+    </script>
+  </head>
+  <body onload="prepareTest()">
+    <iframe id="testFrame" height="700" width="700"></iframe>
+  </body>
+</html>