moebius#195: DOM - PointerEvent - improvements

https://github.com/MoonchildProductions/moebius/pull/195

dom/events/Event.cpp

@@ -855,6 +855,25 @@ Event::GetEventPopupControlState(WidgetEvent* aEvent, nsIDOMEvent* aDOMEvent)
       }
     }
     break;
+  case ePointerEventClass:
+    if (aEvent->IsTrusted() &&
+        aEvent->AsPointerEvent()->button == WidgetMouseEvent::eLeftButton) {
+      switch(aEvent->mMessage) {
+      case ePointerUp:
+        if (PopupAllowedForEvent("pointerup")) {
+          abuse = openControlled;
+        }
+        break;
+      case ePointerDown:
+        if (PopupAllowedForEvent("pointerdown")) {
+          abuse = openControlled;
+        }
+        break;
+      default:
+        break;
+      }
+    }
+    break;
   case eFormEventClass:
     // For these following events only allow popups if they're
     // triggered while handling user input. See

dom/events/test/pointerevents/mochitest.ini

@@ -6,6 +6,14 @@ support-files =
   pointerevent_styles.css
   pointerevent_support.js
 
+[test_bug1285128.html]
+[test_bug1293174_implicit_pointer_capture_for_touch_1.html]
+  support-files = bug1293174_implicit_pointer_capture_for_touch_1.html
+[test_bug1293174_implicit_pointer_capture_for_touch_2.html]
+  support-files = bug1293174_implicit_pointer_capture_for_touch_2.html
+[test_bug1323158.html]
+[test_empty_file.html]
+  disabled = disabled # Bug 1150091 - Issue with support-files
 [test_pointerevent_attributes_mouse-manual.html]
   support-files = pointerevent_attributes_mouse-manual.html
 [test_pointerevent_capture_mouse-manual.html]
@@ -143,11 +151,5 @@ support-files =
     pointerevent_touch-action-span-test_touch-manual.html
     pointerevent_touch-action-svg-test_touch-manual.html
     pointerevent_touch-action-table-test_touch-manual.html
-[test_bug1285128.html]
+[test_trigger_fullscreen_by_pointer_events.html]
-[test_bug1293174_implicit_pointer_capture_for_touch_1.html]
+[test_trigger_popup_by_pointer_events.html]
-  support-files = bug1293174_implicit_pointer_capture_for_touch_1.html
-[test_bug1293174_implicit_pointer_capture_for_touch_2.html]
-  support-files = bug1293174_implicit_pointer_capture_for_touch_2.html
-[test_bug1323158.html]
-[test_empty_file.html]
-  disabled = disabled # Bug 1150091 - Issue with support-files

dom/events/test/pointerevents/test_trigger_fullscreen_by_pointer_events.html

@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test for triggering Fullscreen by pointer events</title>
+  <script src="/tests/SimpleTest/SimpleTest.js"></script>
+  <script src="/tests/SimpleTest/EventUtils.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+</head>
+<body>
+<script>
+
+SimpleTest.waitForExplicitFinish();
+
+function startTest() {
+  let win = window.open("data:text/html,<body><div id='target' style='width: 50px; height: 50px; background: green'></div></body>", "_blank");
+  win.addEventListener("load", () => {
+    let target = win.document.getElementById("target");
+    target.addEventListener("pointerdown", () => {
+      target.requestFullscreen();
+      target.addEventListener("pointerdown", () => {
+        win.document.exitFullscreen();
+      }, {once: true});
+    }, {once: true});
+
+    win.document.addEventListener("fullscreenchange", () => {
+      if (win.document.fullscreenElement) {
+        ok(win.document.fullscreenElement, target, "fullscreenElement should be the div element");
+        // synthesize mouse events to generate pointer events and leave full screen.
+        synthesizeMouseAtCenter(target, { type: "mousedown" }, win);
+        synthesizeMouseAtCenter(target, { type: "mouseup" }, win);
+      } else {
+        win.close();
+        SimpleTest.finish();
+      }
+    });
+    // Make sure our window is focused before starting the test
+    SimpleTest.waitForFocus(() => {
+      // synthesize mouse events to generate pointer events and enter full screen.
+      synthesizeMouseAtCenter(target, { type: "mousedown" }, win);
+      synthesizeMouseAtCenter(target, { type: "mouseup" }, win);
+    }, win);
+  });
+}
+
+SimpleTest.waitForFocus(() => {
+  SpecialPowers.pushPrefEnv({
+    "set": [
+      ["full-screen-api.unprefix.enabled", true],
+      ["full-screen-api.allow-trusted-requests-only", false],
+      ["dom.w3c_pointer_events.enabled", true]
+    ]
+  }, startTest);
+});
+</script>
+</body>
+</html>

dom/events/test/pointerevents/test_trigger_popup_by_pointer_events.html

@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test for triggering popup by pointer events</title>
+  <script src="/tests/SimpleTest/SimpleTest.js"></script>
+  <script src="/tests/SimpleTest/EventUtils.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+</head>
+<body>
+<div id="target" style="width: 50px; height: 50px; background: green"></div>
+<script>
+
+SimpleTest.waitForExplicitFinish();
+
+function sendMouseEvent(element, eventName, listenEventName, handler) {
+  element.addEventListener(listenEventName, handler, {once: true});
+  synthesizeMouseAtCenter(element, {type: eventName});
+}
+
+function checkAllowOpenPopup(e) {
+  let w = window.open("about:blank");
+  ok(w, "Should allow popup in the " + e.type + " listener");
+  if (w) {
+    w.close();
+  }
+}
+
+function checkBlockOpenPopup(e) {
+  let w = window.open("about:blank");
+  ok(!w, "Should block popup in the " + e.type + " listener");
+  if (w) {
+    w.close();
+  }
+}
+
+function startTest() {
+  let target = document.getElementById("target");
+  // By default, only allow opening popup in the pointerup listener.
+  sendMouseEvent(target, "mousemove", "pointermove", checkBlockOpenPopup);
+  sendMouseEvent(target, "mousedown", "pointerdown", checkBlockOpenPopup);
+  sendMouseEvent(target, "mousemove", "pointermove", checkBlockOpenPopup);
+  sendMouseEvent(target, "mouseup", "pointerup", checkAllowOpenPopup);
+  SpecialPowers.pushPrefEnv({"set": [["dom.popup_allowed_events",
+                                      "pointerdown pointerup"]]}, () => {
+    // Adding pointerdown to preference should work
+    sendMouseEvent(target, "mousemove", "pointermove", checkBlockOpenPopup);
+    sendMouseEvent(target, "mousedown", "pointerdown", checkAllowOpenPopup);
+    sendMouseEvent(target, "mousemove", "pointermove", checkBlockOpenPopup);
+    sendMouseEvent(target, "mouseup", "pointerup", checkAllowOpenPopup);
+    SpecialPowers.pushPrefEnv({"set": [["dom.popup_allowed_events",
+                                        "pointerdown pointerup pointermove"]]}, () => {
+      // Adding pointermove to preference should be no effect.
+      sendMouseEvent(target, "mousemove", "pointermove", checkBlockOpenPopup);
+      sendMouseEvent(target, "mousedown", "pointerdown", checkAllowOpenPopup);
+      sendMouseEvent(target, "mousemove", "pointermove", checkBlockOpenPopup);
+      sendMouseEvent(target, "mouseup", "pointerup", checkAllowOpenPopup);
+      SimpleTest.finish();
+    });
+  });
+}
+
+const DENY_ACTION = SpecialPowers.Ci.nsIPermissionManager.DENY_ACTION;
+
+SimpleTest.waitForFocus(() => {
+  SpecialPowers.pushPermissions([{'type': 'popup', 'allow': DENY_ACTION,
+                                  'context': document}], () => {
+    SpecialPowers.pushPrefEnv({
+      "set": [["dom.w3c_pointer_events.enabled", true]]
+    }, startTest);
+  });
+});
+
+</script>
+</body>
+</html>

layout/base/nsPresShell.cpp

@@ -8191,6 +8191,8 @@ PresShell::HandleEventInternal(WidgetEvent* aEvent,
       }
       case eMouseDown:
       case eMouseUp:
+      case ePointerDown:
+      case ePointerUp:
         isHandlingUserInput = true;
         break;
 

modules/libpref/init/all.js

@@ -1161,7 +1161,7 @@ pref("dom.require_user_interaction_for_beforeunload", true);
 
 pref("dom.disable_open_during_load",                false);
 pref("dom.popup_maximum",                           20);
-pref("dom.popup_allowed_events", "change click dblclick mouseup notificationclick reset submit touchend");
+pref("dom.popup_allowed_events", "change click dblclick mouseup pointerup notificationclick reset submit touchend");
 pref("dom.disable_open_click_delay", 1000);
 
 pref("dom.storage.enabled", true);

testing/marionette/element.js

@@ -953,6 +953,12 @@ element.getContainer = function (el) {
  * pointer-interactable, if it is found somewhere in the
  * |elementsFromPoint| list at |el|'s in-view centre coordinates.
  *
+ * Before running the check, we change |el|'s pointerEvents style property
+ * to "auto", since elements without pointer events enabled do not turn
+ * up in the paint tree we get from document.elementsFromPoint.  This is
+ * a specialisation that is only relevant when checking if the element is
+ * in view.
+ *
  * @param {Element} el
  *     Element to check if is in view.
  *
@@ -960,8 +966,14 @@ element.getContainer = function (el) {
  *     True if |el| is inside the viewport, or false otherwise.
  */
 element.isInView = function (el) {
-  let tree = element.getPointerInteractablePaintTree(el);
+  let originalPointerEvents = el.style.pointerEvents;
+  try {
+    el.style.pointerEvents = "auto";
+    const tree = element.getPointerInteractablePaintTree(el);
     return tree.includes(el);
+  } finally {
+    el.style.pointerEvents = originalPointerEvents;
+  }
 };
 
 /**

testing/marionette/error.js

@@ -260,10 +260,23 @@ class ElementClickInterceptedError extends WebDriverError {
     if (obscuredEl && coords) {
       const doc = obscuredEl.ownerDocument;
       const overlayingEl = doc.elementFromPoint(coords.x, coords.y);
+
+      switch (obscuredEl.style.pointerEvents) {
+        case "none":
+          msg = error.pprint`Element ${obscuredEl} is not clickable ` +
+              `at point (${coords.x},${coords.y}) ` +
+              `because it does not have pointer events enabled, ` +
+              error.pprint`and element ${overlayingEl} ` +
+              `would receive the click instead`;
+          break;
+
+        default:
           msg = error.pprint`Element ${obscuredEl} is not clickable ` +
               `at point (${coords.x},${coords.y}) ` +
               error.pprint`because another element ${overlayingEl} ` +
               `obscures it`;
+          break;
+      }
     }
 
     super(msg);

testing/marionette/harness/marionette_harness/tests/unit/test_click.py

@@ -252,3 +252,20 @@ class TestClick(TestLegacyClick):
         with self.assertRaises(errors.ElementClickInterceptedException):
             obscured.click()
         self.assertFalse(self.marionette.execute_script("return window.clicked", sandbox=None))
+
+    def test_pointer_events_none(self):
+        self.marionette.navigate(inline("""
+            <button style="pointer-events: none">click me</button>
+            <script>
+              window.clicked = false;
+              let button = document.querySelector("button");
+              button.addEventListener("click", () => window.clicked = true);
+            </script>
+        """))
+        button = self.marionette.find_element(By.TAG_NAME, "button")
+        self.assertEqual("none", button.value_of_css_property("pointer-events"))
+
+        with self.assertRaisesRegexp(errors.ElementClickInterceptedException,
+                                     "does not have pointer events enabled"):
+            button.click()
+        self.assertFalse(self.marionette.execute_script("return window.clicked", sandbox=None))

testing/marionette/test_error.js

@@ -209,15 +209,25 @@ add_test(function test_ElementClickInterceptedError() {
         return otherEl;
       },
     },
+    style: {
+      pointerEvents: "auto",
+    }
   };
 
-  let err = new ElementClickInterceptedError(obscuredEl, {x: 1, y: 2});
+  let err1 = new ElementClickInterceptedError(obscuredEl, {x: 1, y: 2});
-  equal("ElementClickInterceptedError", err.name);
+  equal("ElementClickInterceptedError", err1.name);
   equal("Element <b> is not clickable at point (1,2) " +
       "because another element <a> obscures it",
-      err.message);
+      err1.message);
-  equal("element click intercepted", err.status);
+  equal("element click intercepted", err1.status);
-  ok(err instanceof WebDriverError);
+  ok(err1 instanceof WebDriverError);
+
+  obscuredEl.style.pointerEvents = "none";
+  let err2 = new ElementClickInterceptedError(obscuredEl, {x: 1, y: 2});
+  equal("Element <b> is not clickable at point (1,2) " +
+      "because it does not have pointer events enabled, " +
+      "and element <a> would receive the click instead",
+      err2.message);
 
   run_next_test();
 });