Source code

Revision control

Copy as Markdown

Other Tools

Test Info: Warnings

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale:1">
<title>Pointer capture state should be updated before `pointerrawupdate`</title>
<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>
"use strict";
/**
* "fire a pointer event" defines:
* > If the event is not a gotpointercapture, lostpointercapture, click,
* > auxclick or contextmenu event, run the process pending pointer capture
* > steps for this PointerEvent.
*
* This test checks whether `pointerrawupdate` event dispatcher processes
* the pending pointer capture state.
*/
addEventListener("DOMContentLoaded", () => {
promise_test(async () => {
let events = [];
function logEvent(event) {
events.push(`${event.type}@${event.target.id ? event.target.id : event.target.nodeName}`);
}
const initialDiv = document.getElementById("init");
await new test_driver.Actions()
.pointerMove(0, 0, {origin: initialDiv})
.send();
const target = document.getElementById("target");
const dest = document.getElementById("dest");
for (const type of ["pointerdown", "pointerup", "pointermove",
"pointerrawupdate",
"gotpointercapture", "lostpointercapture"]) {
target.addEventListener(type, logEvent);
dest.addEventListener(type, logEvent);
}
dest.addEventListener("pointerover", logEvent);
target.addEventListener("pointerdown", event => {
event.target.setPointerCapture(event.pointerId);
});
await new test_driver.Actions()
.pointerMove(0, 0, {origin: target})
.pointerDown()
.pointerMove(0, 0, {origin: dest})
.pointerUp()
.send();
assert_equals(
events.join(", "),
[
"pointerrawupdate@target", "pointermove@target", "pointerdown@target",
// "gotpointercapture" should be fired before "pointerrawupdate"
"gotpointercapture@target", "pointerrawupdate@target", "pointermove@target",
"pointerup@target", "lostpointercapture@target",
// Finally, "pointerover" should be fired on the destination
"pointerover@dest",
].join(", ")
);
});
}, {once: true});
</script>
<style>
div {
min-height: 64px;
}
</style>
</head>
<body>
<div id="init"></div>
<div id="target"></div>
<div id="dest"></div>
</body>
</html>