mirror of
https://repo.dactyloidae.xyz/Dactyloidae/UXP.git
synced 2026-10-04 22:37:29 +09:00
moebius#195: DOM - PointerEvent - improvements
https://github.com/MoonchildProductions/moebius/pull/195
This commit is contained in:
parent
3d237024d5
commit
a968f1d6c2
10 changed files with 228 additions and 20 deletions
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -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_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_trigger_fullscreen_by_pointer_events.html]
|
||||
[test_trigger_popup_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>
|
||||
|
|
@ -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>
|
||||
|
|
@ -8191,6 +8191,8 @@ PresShell::HandleEventInternal(WidgetEvent* aEvent,
|
|||
}
|
||||
case eMouseDown:
|
||||
case eMouseUp:
|
||||
case ePointerDown:
|
||||
case ePointerUp:
|
||||
isHandlingUserInput = true;
|
||||
break;
|
||||
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
|
|
|||
|
|
@ -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))
|
||||
|
|
|
|||
|
|
@ -209,15 +209,25 @@ add_test(function test_ElementClickInterceptedError() {
|
|||
return otherEl;
|
||||
},
|
||||
},
|
||||
style: {
|
||||
pointerEvents: "auto",
|
||||
}
|
||||
};
|
||||
|
||||
let err = new ElementClickInterceptedError(obscuredEl, {x: 1, y: 2});
|
||||
equal("ElementClickInterceptedError", err.name);
|
||||
let err1 = new ElementClickInterceptedError(obscuredEl, {x: 1, y: 2});
|
||||
equal("ElementClickInterceptedError", err1.name);
|
||||
equal("Element <b> is not clickable at point (1,2) " +
|
||||
"because another element <a> obscures it",
|
||||
err.message);
|
||||
equal("element click intercepted", err.status);
|
||||
ok(err instanceof WebDriverError);
|
||||
err1.message);
|
||||
equal("element click intercepted", err1.status);
|
||||
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();
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue