Bug 1162990 - Add test for check pointerleave event behavior. r=smaug
authorMaksim Lebedev <alessarik@gmail.com>
Wed, 17 Jun 2015 01:54:00 -0400
changeset 249361 bc38e13fab2ee5bd3547928a463836f8dcbbb3ec
parent 249360 f5fbae5bbe34a924d3a082efe62edf4503c94fb6
child 249362 dbb334e7ebebae1408c0d03f2baad227a340e7aa
push id28923
push userryanvm@gmail.com
push dateWed, 17 Jun 2015 18:57:11 +0000
treeherdermozilla-central@099d6cd6725e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerssmaug
bugs1162990
milestone41.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 1162990 - Add test for check pointerleave event behavior. r=smaug
layout/base/tests/bug1162990_inner_1.html
layout/base/tests/bug1162990_inner_2.html
layout/base/tests/mochitest.ini
layout/base/tests/test_bug1162990.html
new file mode 100644
--- /dev/null
+++ b/layout/base/tests/bug1162990_inner_1.html
@@ -0,0 +1,145 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=1162990
+-->
+<head>
+  <meta charset="utf-8">
+  <title>Test for Bug 1162990</title>
+  <meta name="author" content="Maksim Lebedev" />
+  <script type="application/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <style>
+    div#basket {
+      background: red;
+      padding: 10px;
+      margin: 10px;
+    }
+    div#target {
+      background: lightgreen;
+      padding: 10px;
+      margin: 10px;
+    }
+    div#child {
+      background: lightblue;
+      padding: 10px;
+      margin: 10px;
+    }
+    div#listener {
+      background: yellow;
+      padding: 10px;
+      margin: 10px;
+    }
+  </style>
+  <script type="application/javascript">
+    var basket;
+    var target;
+    var child;
+    var listener;
+
+    var test_basketLeave = 0;
+    var test_targetGotCapture = 0;
+    var test_targetLostCapture = 0;
+    var test_targetLeave = 0;
+    var test_childLeave = 0;
+    var test_listenerDown = 0;
+    var test_listenerLeave = 0;
+
+    function basketLeaveHandler(event) {
+      logger("basket: " + event.type);
+      test_basketLeave++;
+    }
+    function targetGotHandler(event) {
+      logger("target: " + event.type);
+      test_targetGotCapture++;
+    }
+    function targetLostHandler(event) {
+      logger("target: " + event.type);
+      test_targetLostCapture++;
+    }
+    function targetLeaveHandler(event) {
+      logger("target: " + event.type);
+      test_targetLeave++;
+    }
+    function childLeaveHandler(event) {
+      logger("child: " + event.type);
+      test_childLeave++;
+    }
+    function listenerDownHandler(event) {
+      logger("listener: " + event.type);
+      target.setPointerCapture(event.pointerId);
+      test_listenerDown++;
+    }
+    function listenerLeaveHandler(event) {
+      logger("listener: " + event.type);
+      test_listenerLeave++;
+    }
+
+    function prepareTest() {
+      parent.turnOnPointerEvents(executeTest);
+    }
+
+    function setEventHandlers() {
+      basket = document.getElementById("basket");
+      target = document.getElementById("target");
+      child = document.getElementById("child");
+      listener = document.getElementById("listener");
+
+      basket.addEventListener("pointerleave",       basketLeaveHandler,   false);
+      target.addEventListener("gotpointercapture",  targetGotHandler,     false);
+      target.addEventListener("lostpointercapture", targetLostHandler,    false);
+      target.addEventListener("pointerleave",       targetLeaveHandler,   false);
+      child.addEventListener("pointerleave",        childLeaveHandler,    false);
+      listener.addEventListener("pointerdown",      listenerDownHandler,  false);
+      listener.addEventListener("pointerleave",     listenerLeaveHandler, false);
+    }
+
+    function executeTest()
+    {
+      logger("executeTest");
+      setEventHandlers();
+      var rectCd = child.getBoundingClientRect();
+      var rectLr = listener.getBoundingClientRect();
+      synthesizePointer(listener, rectLr.width/3, rectLr.height/2,  {type: "pointerdown"});
+      synthesizePointer(child,    rectCd.width/3, rectCd.height/2,  {type: "pointermove"});
+      synthesizePointer(listener, rectLr.width/3, rectLr.height/2,  {type: "pointermove"});
+      synthesizePointer(child,    rectCd.width/3, rectCd.height/2,  {type: "pointermove"});
+      synthesizePointer(listener, rectLr.width/3, rectLr.height/2,  {type: "pointermove"});
+      synthesizePointer(listener, rectLr.width/3, rectLr.height/2,  {type: "pointerup"});
+      synthesizePointer(listener, rectLr.width/3, rectLr.height/3,  {type: "pointermove"});
+      finishTest();
+    }
+
+    function finishTest() {
+      parent.is(test_basketLeave,       0, "Part1: basket should not receive pointerleave event after pointer capturing");
+      parent.is(test_targetGotCapture,  1, "Part1: target should receive gotpointercapture event");
+      parent.is(test_targetLostCapture, 1, "Part1: target should receive lostpointercapture event");
+      parent.is(test_targetLeave,       2, "Part1: target should receive pointerleave event two times");
+      parent.is(test_childLeave,        0, "Part1: child should not receive pointerleave event after pointer capturing");
+      parent.is(test_listenerDown,      1, "Part1: listener should receive pointerdown event");
+      parent.is(test_listenerLeave,     1, "Part1: listener should receive pointerleave event only one time");
+      logger("finishTest");
+      parent.finishTest();
+    }
+
+    function logger(message) {
+      var log = document.getElementById('log');
+      log.innerHTML = message + "<br>" + log.innerHTML;
+    }
+  </script>
+</head>
+<body onload="prepareTest()">
+  <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1162990">Mozilla Bug 1162990 Test 1</a>
+  <p id="display"></p>
+  <div id="content" style="display: none">
+  </div>
+  <div id="basket">div id=basket
+    <div id="target">div id=target
+      <div id="child">div id=child</div>
+    </div>
+  </div>
+  <div id="listener">div id=listener</div>
+  <pre id="log">
+  </pre>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/base/tests/bug1162990_inner_2.html
@@ -0,0 +1,146 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=1162990
+-->
+<head>
+  <meta charset="utf-8">
+  <title>Test for Bug 1162990</title>
+  <meta name="author" content="Maksim Lebedev" />
+  <script type="application/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <style>
+    div#basket {
+      background: red;
+      padding: 10px;
+      margin: 10px;
+    }
+    div#target {
+      background: lightgreen;
+      padding: 10px;
+      margin: 10px;
+    }
+    div#child {
+      background: lightblue;
+      padding: 10px;
+      margin: 10px;
+    }
+    div#listener {
+      background: yellow;
+      padding: 10px;
+      margin: 10px;
+    }
+  </style>
+  <script type="application/javascript">
+    var basket;
+    var target;
+    var child;
+    var listener;
+
+    var test_basketLeave = 0;
+    var test_targetDown = 0;
+    var test_targetGotCapture = 0;
+    var test_targetLostCapture = 0;
+    var test_targetLeave = 0;
+    var test_childLeave = 0;
+    var test_listenerLeave = 0;
+
+    function basketLeaveHandler(event) {
+      logger("basket: " + event.type);
+      test_basketLeave++;
+    }
+    function targetDownHandler(event) {
+      logger("target: " + event.type);
+      target.setPointerCapture(event.pointerId);
+      test_targetDown++;
+    }
+    function targetGotHandler(event) {
+      logger("target: " + event.type);
+      test_targetGotCapture++;
+    }
+    function targetLostHandler(event) {
+      logger("target: " + event.type);
+      test_targetLostCapture++;
+    }
+    function targetLeaveHandler(event) {
+      logger("target: " + event.type);
+      test_targetLeave++;
+    }
+    function childLeaveHandler(event) {
+      logger("child: " + event.type);
+      test_childLeave++;
+    }
+    function listenerLeaveHandler(event) {
+      logger("listener: " + event.type);
+      test_listenerLeave++;
+    }
+
+    function prepareTest() {
+      parent.turnOnPointerEvents(executeTest);
+    }
+
+    function setEventHandlers() {
+      basket = document.getElementById("basket");
+      target = document.getElementById("target");
+      child = document.getElementById("child");
+      listener = document.getElementById("listener");
+
+      basket.addEventListener("pointerleave",       basketLeaveHandler,   false);
+      target.addEventListener("pointerdown",        targetDownHandler,    false);
+      target.addEventListener("gotpointercapture",  targetGotHandler,     false);
+      target.addEventListener("lostpointercapture", targetLostHandler,    false);
+      target.addEventListener("pointerleave",       targetLeaveHandler,   false);
+      child.addEventListener("pointerleave",        childLeaveHandler,    false);
+      listener.addEventListener("pointerleave",     listenerLeaveHandler, false);
+    }
+
+    function executeTest()
+    {
+      logger("executeTest");
+      setEventHandlers();
+      var rectTg = target.getBoundingClientRect();
+      var rectCd = child.getBoundingClientRect();
+      var rectLr = listener.getBoundingClientRect();
+      synthesizePointer(target,   rectTg.width/3, rectTg.height/7,  {type: "pointerdown"});
+      synthesizePointer(child,    rectCd.width/3, rectCd.height/2,  {type: "pointermove"});
+      synthesizePointer(listener, rectLr.width/3, rectLr.height/2,  {type: "pointermove"});
+      synthesizePointer(child,    rectCd.width/3, rectCd.height/2,  {type: "pointermove"});
+      synthesizePointer(target,   rectTg.width/3, rectTg.height/7,  {type: "pointermove"});
+      synthesizePointer(target,   rectTg.width/3, rectTg.height/7,  {type: "pointerup"});
+      synthesizePointer(target,   rectTg.width/3, rectTg.height/9,  {type: "pointermove"});
+      finishTest();
+    }
+
+    function finishTest() {
+      parent.is(test_basketLeave,       0, "Part2: basket should not receive pointerleave event after pointer capturing");
+      parent.is(test_targetDown,        1, "Part2: target should receive pointerdown event");
+      parent.is(test_targetGotCapture,  1, "Part2: target should receive gotpointercapture event");
+      parent.is(test_targetLostCapture, 1, "Part2: target should receive lostpointercapture event");
+      parent.is(test_targetLeave,       1, "Part2: target should receive pointerleave event");
+      parent.is(test_childLeave,        0, "Part2: child should not receive pointerleave event after pointer capturing");
+      parent.is(test_listenerLeave,     0, "Part2: listener should not receive pointerleave event after pointer capturing");
+      logger("finishTest");
+      parent.finishTest();
+    }
+
+    function logger(message) {
+      var log = document.getElementById('log');
+      log.innerHTML = message + "<br>" + log.innerHTML;
+    }
+  </script>
+</head>
+<body onload="prepareTest()">
+  <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1162990">Mozilla Bug 1162990 Test 2</a>
+  <p id="display"></p>
+  <div id="content" style="display: none">
+  </div>
+  <div id="basket">div id=basket
+    <div id="target">div id=target
+      <div id="child">div id=child</div>
+    </div>
+  </div>
+  <div id="listener">div id=listener</div>
+  <pre id="log">
+  </pre>
+</body>
+</html>
--- a/layout/base/tests/mochitest.ini
+++ b/layout/base/tests/mochitest.ini
@@ -258,8 +258,12 @@ support-files = bug1080361_inner.html
 [test_frame_reconstruction_for_pseudo_elements.html]
 [test_touchcaret_visibility.html]
 [test_bug1093686.html]
 support-files = bug1093686_inner.html
 [test_bug1120705.html]
 skip-if = buildapp == 'android' || buildapp == 'b2g' || buildapp == 'b2g-debug' || os == 'mac' || toolkit == 'gtk2' || toolkit == 'gtk3' # android and b2g do not have clickable scrollbars, mac does not have scrollbar down and up buttons, gtk may or may not have scrollbar buttons depending on theme
 [test_bug1153130.html]
 support-files = bug1153130_inner.html
+[test_bug1162990.html]
+support-files =
+  bug1162990_inner_1.html
+  bug1162990_inner_2.html
new file mode 100644
--- /dev/null
+++ b/layout/base/tests/test_bug1162990.html
@@ -0,0 +1,39 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=1162990
+-->
+  <head>
+    <meta charset="utf-8">
+    <title>Test for Bug 1162990</title>
+    <meta name="author" content="Maksim Lebedev" />
+    <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;
+      var number = 0;
+      function prepareTest() {
+        SimpleTest.waitForExplicitFinish();
+        iframe = document.getElementById("testFrame");
+        turnOnPointerEvents(finishTest);
+      }
+      function turnOnPointerEvents(callback) {
+        SpecialPowers.pushPrefEnv({
+          "set": [
+            ["dom.w3c_pointer_events.enabled", true]
+          ]
+        }, callback);
+      }
+      function finishTest() {
+        // Try to run several tests named as bug1162990_inner_<number>.html
+        if(++number < 3)
+          iframe.src = "bug1162990_inner_" + number + ".html";
+        else
+          SimpleTest.finish();
+      }
+    </script>
+  </head>
+  <body onload="prepareTest()">
+    <iframe id="testFrame" height="700" width="700"></iframe>
+  </body>
+</html>