commit d8693f22a8603dd04384fc03117e97e08b09a8c0
parent 6512e4bc6cd74a0d933f2df54ec45f7b83b669a7
Author: Mustaq Ahmed <mustaq@google.com>
Date: Thu, 6 Nov 2025 21:33:42 +0000
Bug 1997597 [wpt PR 55788] - Deflake mouseenter-mouseleave-on-drag.html: end each test with a click, a=testonly
Automatic update from web-platform-tests
Deflake mouseenter-mouseleave-on-drag.html: end each test with a click
The test has been flaky for a while. The root cause seems to be the
condition that the mouse pointer must move over the body element to
end each promise_test. We recently encountered that an unrelated
experiment with event timing change occasionally exposes a system
mousemove event right after the test page is loaded, fulfilling the
the test end condition before any test action is considered!
We fix the problem here by using a click to end each test.
Fixed: 444170116
Change-Id: I87b842b028a842bf6da7b6de07d32831fadb7745
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7101582
Reviewed-by: Kevin Ellis <kevers@chromium.org>
Auto-Submit: Mustaq Ahmed <mustaq@chromium.org>
Commit-Queue: Kevin Ellis <kevers@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1538594}
--
wpt-commits: 6b81b18bc25fa212e0a1c7281128facc16ddbf4f
wpt-pr: 55788
Diffstat:
1 file changed, 33 insertions(+), 26 deletions(-)
diff --git a/testing/web-platform/tests/uievents/mouse/mouseenter-mouseleave-on-drag.html b/testing/web-platform/tests/uievents/mouse/mouseenter-mouseleave-on-drag.html
@@ -11,20 +11,22 @@
<style>
#outer {
background: grey;
- position: absolute;
- left: 100px;
- top: 100px;
width: 100px;
height: 100px;
}
#inner {
background: red;
- position: absolute;
+ position: relative;
left: 30px;
top: 30px;
width: 40px;
height: 40px;
}
+#done {
+ background: green;
+ width: 40px;
+ height: 40px;
+}
</style>
<body>
@@ -33,6 +35,7 @@
<div id="outer">
<div id="inner"></div>
</div>
+ <div id="done"></div>
</body>
<script>
let eventLog = [];
@@ -84,39 +87,39 @@ function addEventListeners(test) {
});
}
-// At the end of each action sequence we move the mouse over the root element.
-// Once this event is detected, all other upstream events must be logged and
-// we can proceed with the checks.
-async function mousemoveOverRootElement() {
+// A click on `done` marks the end of actions in each promise_test.
+async function getClick(target, test) {
return new Promise(resolve => {
- const listener = (e) => {
- if (e.eventPhase == Event.AT_TARGET) {
- document.documentElement.removeEventListener('mousemove', listener);
- resolve();
- }
- };
- document.documentElement.addEventListener('mousemove', listener);
+ const listener = e => resolve(e);
+ target.addEventListener('click', listener, { once: true });
+ if (test) {
+ test.add_cleanup(() =>
+ target.removeEventListener('click', listener, { once: true }));
+ }
});
}
window.onload = async () => {
const outer = document.getElementById('outer');
const inner = document.getElementById('inner');
- const leftOuter = 100;
- const rightOuter = 200;
- const leftInner = 130;
- const rightInner = 170;
- const centerY = 150;
+ const done = document.getElementById('done');
+ const leftOuter = 0;
+ const rightOuter = 100;
+ const leftInner = 30;
+ const rightInner = 70;
+ const centerY = 50;
promise_test(async t => {
addEventListeners(t);
- const completionPromise = mousemoveOverRootElement();
+ const completionPromise = getClick(done, t);
const actions =new test_driver.Actions();
actions.pointerMove(leftOuter + 10, centerY)
.pointerDown({button: actions.ButtonType.LEFT})
.pointerMove(rightOuter - 10, centerY)
.pointerUp({button: actions.ButtonType.LEFT})
- .pointerMove(0, 0)
+ .pointerMove(0, 0, {origin: done})
+ .pointerDown()
+ .pointerUp()
.send();
await actions;
await completionPromise;
@@ -132,13 +135,15 @@ window.onload = async () => {
promise_test(async t => {
addEventListeners(t);
- const completionPromise = mousemoveOverRootElement();
+ const completionPromise = getClick(done, t);
const actions =new test_driver.Actions();
actions.pointerMove(leftOuter + 10, centerY)
.pointerDown({button: actions.ButtonType.LEFT})
.pointerMove(leftInner + 10, centerY)
.pointerUp({button: actions.ButtonType.LEFT})
- .pointerMove(0, 0)
+ .pointerMove(0, 0, {origin: done})
+ .pointerDown()
+ .pointerUp()
.send();
await actions;
await completionPromise;
@@ -159,13 +164,15 @@ window.onload = async () => {
promise_test(async t => {
addEventListeners(t);
- const completionPromise = mousemoveOverRootElement();
+ const completionPromise = getClick(done, t);
const actions =new test_driver.Actions();
actions.pointerMove(leftInner + 10, centerY)
.pointerDown({button: actions.ButtonType.LEFT})
.pointerMove(rightInner + 10, centerY)
.pointerUp({button: actions.ButtonType.LEFT})
- .pointerMove(0, 0)
+ .pointerMove(0, 0, {origin: done})
+ .pointerDown()
+ .pointerUp()
.send();
await actions;
await completionPromise;
