Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Showing
4 changed files
with
412 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,94 @@ | ||
<!DOCTYPE HTML> | ||
<html> | ||
<head> | ||
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1"> | ||
<meta name="timeout" content="long"> | ||
<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="scroll_support.js"></script> | ||
<style> | ||
body { | ||
margin: 0; | ||
padding: 0; | ||
height: 200vh; | ||
} | ||
|
||
.spacer { | ||
width: 100%; | ||
height: 25px; | ||
padding: 0; | ||
margin: 0; | ||
} | ||
|
||
</style> | ||
<head> | ||
<body onload=runTest()> | ||
<div id="initialTarget" class="spacer" style="background: red"></div> | ||
<div id="firstRootSpacer" class="spacer" style="background: green"></div> | ||
<div id="secondRootSpacer" class="spacer" style="background: blue"></div> | ||
</body> | ||
|
||
<script> | ||
|
||
function runTest() { | ||
promise_test(async (t) => { | ||
await waitForCompositorCommit(); | ||
|
||
// Wait some extra time to ensure nothing from prior tests impacts this one. | ||
// At a minimum this should be greater than 500ms to ensure that the wheel events | ||
// in this test are in a new wheel event group | ||
await new Promise(resolve => step_timeout(resolve, 1000)); | ||
|
||
await waitForCompositorCommit(); | ||
|
||
let wheelEventTargets = []; | ||
let movedInitialTarget = false; | ||
|
||
// Move the initial element the wheel event is targetted at once we fire the | ||
// first wheel event, then log the subsequent wheel event targets. | ||
function moveInitialElement(e) { | ||
wheelEventTargets.push(e.target); | ||
if (!movedInitialTarget) { | ||
movedInitialTarget = true; | ||
secondRootSpacer.insertAdjacentElement('afterend', e.target); | ||
} | ||
} | ||
window.addEventListener("wheel", moveInitialElement, {passive: true}); | ||
|
||
await waitForCompositorCommit(); | ||
|
||
await new test_driver.Actions() | ||
.addWheel("wheel1") | ||
.scroll(40, 2, 0, 30, {origin: "viewport"}) | ||
.pause(1) | ||
.scroll(40, 2, 0, 30, {origin: "viewport"}) | ||
.pause(1) | ||
.scroll(40, 2, 0, 30, {origin: "viewport"}) | ||
.send(); | ||
|
||
// TODO(dlrobertson): Use the scrollend event here to wait for the | ||
// wheel scroll to finish instead of waitForAnimationEnd(). | ||
await waitForAnimationEnd(() => { return document.scrollingElement.scrollTop; }); | ||
await waitForCompositorCommit(); | ||
|
||
document.scrollingElement.scrollTo({top: 0, left: 0, behavior: "instant"}); | ||
|
||
// The first wheel event should be targetted at the moved element. | ||
assert_equals(wheelEventTargets.shift(), initialTarget, | ||
"Initial wheel event is has the moved element as the target"); | ||
|
||
// All subsequent wheel events following the removal of the initial target | ||
// should have the same event target. | ||
wheelEventTargets.forEach((wheelEventTarget) => { | ||
assert_equals(wheelEventTarget, firstRootSpacer, | ||
"All following wheel events in the group have the same target"); | ||
}); | ||
|
||
window.removeEventListener("wheel", moveInitialElement, {passive: true}); | ||
}, "Move the initial wheel event target."); | ||
} | ||
</script> | ||
</html> |
96 changes: 96 additions & 0 deletions
96
dom/events/scrolling/wheel-event-groups-target-removal.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,96 @@ | ||
<!DOCTYPE HTML> | ||
<html> | ||
<head> | ||
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1"> | ||
<meta name="timeout" content="long"> | ||
<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="scroll_support.js"></script> | ||
<style> | ||
body { | ||
margin: 0; | ||
padding: 0; | ||
height: 200vh; | ||
} | ||
|
||
.spacer { | ||
width: 100%; | ||
height: 25px; | ||
padding: 0; | ||
margin: 0; | ||
} | ||
|
||
</style> | ||
<head> | ||
<body onload=runTest()> | ||
<div id="initialTarget" class="spacer" style="background: red"></div> | ||
<div id="firstRootSpacer" class="spacer" style="background: green"></div> | ||
<div id="secondRootSpacer" class="spacer" style="background: blue"></div> | ||
</body> | ||
|
||
<script> | ||
|
||
function runTest() { | ||
promise_test(async (t) => { | ||
await waitForCompositorCommit(); | ||
|
||
// Wait some extra time to ensure nothing from prior tests impacts this one. | ||
// At a minimum this should be greater than 500ms to ensure that the wheel events | ||
// in this test are in a new wheel event group | ||
await new Promise(resolve => step_timeout(resolve, 1000)); | ||
|
||
await waitForCompositorCommit(); | ||
|
||
let initialTarget = document.getElementById('initialTarget'); | ||
|
||
let wheelEventTargets = []; | ||
let removedInitialTarget = false; | ||
|
||
// Remove the initial element the wheel event is targetted at once we fire the | ||
// first wheel event, then log the subsequent wheel event targets. | ||
function removeInitialElement(e) { | ||
wheelEventTargets.push(e.target); | ||
if (!removedInitialTarget) { | ||
removedInitialTarget = true; | ||
e.target.remove(); | ||
} | ||
} | ||
window.addEventListener("wheel", removeInitialElement, {passive: true}); | ||
|
||
await waitForCompositorCommit(); | ||
|
||
await new test_driver.Actions() | ||
.addWheel("wheel1") | ||
.scroll(40, 2, 0, 30, {origin: "viewport"}) | ||
.pause(1) | ||
.scroll(40, 2, 0, 30, {origin: "viewport"}) | ||
.pause(1) | ||
.scroll(40, 2, 0, 30, {origin: "viewport"}) | ||
.send(); | ||
|
||
// TODO(dlrobertson): Use the scrollend event here to wait for the | ||
// wheel scroll to finish instead of waitForAnimationEnd(). | ||
await waitForAnimationEnd(() => { return document.scrollingElement.scrollTop; }); | ||
await waitForCompositorCommit(); | ||
|
||
document.scrollingElement.scrollTo({top: 0, left: 0, behavior: "instant"}); | ||
|
||
// The first wheel event should be targetted at the removed element. | ||
assert_equals(wheelEventTargets.shift(), initialTarget, | ||
"Initial wheel event is has the removed element as the target"); | ||
|
||
// All subsequent wheel events following the removal of the initial target | ||
// should have the same event target. | ||
wheelEventTargets.forEach((wheelEventTarget) => { | ||
assert_equals(wheelEventTarget, firstRootSpacer, | ||
"All following wheel events in the group have the same target"); | ||
}); | ||
|
||
window.removeEventListener("wheel", removeInitialElement, {passive: true}); | ||
}, "Remove the initial wheel event target."); | ||
} | ||
</script> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,80 @@ | ||
<!DOCTYPE HTML> | ||
<html> | ||
<head> | ||
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1"> | ||
<meta name="timeout" content="long"> | ||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css"/> | ||
<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="scroll_support.js"></script> | ||
<style> | ||
body { | ||
margin: 0; | ||
padding: 0; | ||
height: 200vh; | ||
} | ||
|
||
.spacer { | ||
width: 100%; | ||
height: 25px; | ||
padding: 0; | ||
margin: 0; | ||
font: 25px/1 Ahem; | ||
} | ||
|
||
</style> | ||
<head> | ||
<body onload=runTest()> | ||
<div id="firstRootSpacer" class="spacer" style="background: green">X</div> | ||
<div id="secondRootSpacer" class="spacer" style="background: blue"></div> | ||
</body> | ||
|
||
<script> | ||
|
||
function runTest() { | ||
promise_test(async (t) => { | ||
await waitForCompositorCommit(); | ||
|
||
// Wait some extra time to ensure nothing from prior tests impacts this one. | ||
// At a minimum this should be greater than 500ms to ensure that the wheel events | ||
// in this test are in a new wheel event group | ||
await new Promise(resolve => step_timeout(resolve, 1000)); | ||
|
||
await waitForCompositorCommit(); | ||
|
||
let wheelEventTargets = []; | ||
|
||
window.addEventListener("wheel", (e) => { | ||
wheelEventTargets.push(e.target); | ||
}, {passive: true}); | ||
|
||
await waitForCompositorCommit(); | ||
|
||
await new test_driver.Actions() | ||
.addWheel("wheel1") | ||
.scroll(12, 12, 0, 30, {origin: "viewport"}) | ||
.pause(1) | ||
.scroll(12, 12, 0, 30, {origin: "viewport"}) | ||
.pause(1) | ||
.scroll(12, 12, 0, 30, {origin: "viewport"}) | ||
.send(); | ||
|
||
// TODO(dlrobertson): Use the scrollend event here to wait for the | ||
// wheel scroll to finish instead of waitForAnimationEnd(). | ||
await waitForAnimationEnd(() => { return document.scrollingElement.scrollTop; }); | ||
await waitForCompositorCommit(); | ||
|
||
document.scrollingElement.scrollTo({top: 0, left: 0, behavior: "instant"}); | ||
|
||
// All of the wheel events should have the first div as their target. | ||
wheelEventTargets.forEach((wheelEventTarget) => { | ||
assert_equals(wheelEventTarget, firstRootSpacer, | ||
"All following wheel events in the group have the same target"); | ||
}); | ||
}, "Wheel event groups do not target the text"); | ||
} | ||
</script> | ||
</html> |
Oops, something went wrong.