Add a test for crbug.com/453586392
This snippet causes problems, only on touchscreen:
<button id="lock" popover popovertarget="lock" style="display: inline">
lock
</button>
This adds a test for this case, which unfortunately does not hang
like on an actual touchscreen, but also does not toggle the popover.
Bug: 453586392
Change-Id: I9e2516e52e2d710a21556f71383e094bb8e07704
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7083814
Commit-Queue: Joey Arhar <jarhar@chromium.org>
Auto-Submit: Mason Freed <masonf@chromium.org>
Reviewed-by: Joey Arhar <jarhar@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1536809}
diff --git a/html/semantics/popovers/popover-self-invoke.html b/html/semantics/popovers/popover-self-invoke.html
new file mode 100644
index 0000000..d1c3544
--- /dev/null
+++ b/html/semantics/popovers/popover-self-invoke.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" href="mailto:masonf@chromium.org">
+<link rel=help href="https://html.spec.whatwg.org/multipage/popover.html">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="resources/popover-utils.js"></script>
+
+<button popover id="lock" popovertarget="lock" style="display: inline">
+ Tapping this should not hang
+</button>
+
+<script>
+const button = document.getElementById('lock');
+function runTest(activator, description) {
+ promise_test(async t => {
+ assert_false(button.matches(':popover-open'), 'Button should not be open initially');
+ await activator();
+ assert_true(button.matches(':popover-open'), 'Button should be open after touch');
+ button.hidePopover(); // Cleanup
+ assert_false(button.matches(':popover-open'), 'Cleanup should close the popover');
+ }, `${description} on a popover button that is its own target should open it.`);
+}
+// Try with both mouse and touchscreen, via test_driver.Actions()
+['mouse','touch'].forEach((method) => {
+ runTest(() => clickOn(button, method === 'touch'), method);
+});
+// Also try programmatic click.
+runTest(() => button.click(), 'click');
+</script>
diff --git a/html/semantics/popovers/resources/popover-utils.js b/html/semantics/popovers/resources/popover-utils.js
index 2790e7e..5d7f1ea 100644
--- a/html/semantics/popovers/resources/popover-utils.js
+++ b/html/semantics/popovers/resources/popover-utils.js
@@ -2,12 +2,15 @@
return new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve)));
}
-async function clickOn(element) {
+async function clickOn(element, useTouch) {
await waitForRender();
let rect = element.getBoundingClientRect();
let actions = new test_driver.Actions();
// FIXME: Switch to pointerMove(0, 0, {origin: element}) once
// https://github.com/web-platform-tests/wpt/issues/41257 is fixed.
+ if (useTouch) {
+ actions.addPointer('touch1', 'touch');
+ }
await actions
.pointerMove(Math.round(rect.x + rect.width / 2), Math.round(rect.y + rect.height / 2), {})
.pointerDown({button: actions.ButtonType.LEFT})