50 lines
1.8 KiB
HTML
50 lines
1.8 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<meta charset=utf-8>
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<script src="../../resources/testharness.js"></script>
|
||
|
|
<script src="../../resources/testharnessreport.js"></script>
|
||
|
|
<script src="../utils.js"></script>
|
||
|
|
<script>
|
||
|
|
|
||
|
|
'use strict';
|
||
|
|
|
||
|
|
async_test(test => {
|
||
|
|
const firstTarget = makeTarget(test, { x: "100px", y: "100px", width: "100px", height: "100px" });
|
||
|
|
firstTarget.id = "one";
|
||
|
|
|
||
|
|
const secondTarget = makeTarget(test, { x: "200px", y: "100px", width: "100px", height: "100px" });
|
||
|
|
secondTarget.id = "two";
|
||
|
|
|
||
|
|
const eventsLog = [];
|
||
|
|
const logger = event => eventsLog.push(`${event.type}@${event.currentTarget.id}`);
|
||
|
|
for (let eventType of ["pointerover", "pointerenter", "pointerout", "pointerleave"]) {
|
||
|
|
firstTarget.addEventListener(eventType, logger);
|
||
|
|
secondTarget.addEventListener(eventType, logger);
|
||
|
|
}
|
||
|
|
|
||
|
|
// Ensure we get pointer events for all touch events.
|
||
|
|
document.body.style.touchAction = "none";
|
||
|
|
|
||
|
|
// Ensure we disable pointer capture.
|
||
|
|
document.body.addEventListener("pointerdown", event => event.currentTarget.releasePointerCapture(event.pointerId));
|
||
|
|
|
||
|
|
const one = ui.finger();
|
||
|
|
ui.sequence([
|
||
|
|
one.begin({ x: 50, y: 150 }),
|
||
|
|
one.move({ x: 150, y: 150 }),
|
||
|
|
one.move({ x: 250, y: 150 }),
|
||
|
|
one.move({ x: 350, y: 150 }),
|
||
|
|
one.end()
|
||
|
|
]).then(() => {
|
||
|
|
assert_array_equals(eventsLog, ["pointerover@one", "pointerenter@one", "pointerout@one", "pointerleave@one", "pointerover@two", "pointerenter@two", "pointerout@two", "pointerleave@two"]);
|
||
|
|
test.done();
|
||
|
|
});
|
||
|
|
}, `Testing that "pointerover", "pointerenter", "pointerout" and "pointerleave" events are dispatched correctly with capture disabled as a touch moves between elements.`);
|
||
|
|
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|