69 lines
No EOL
2.2 KiB
HTML
69 lines
No EOL
2.2 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<head>
|
|
<title>Touch events with vertical-rl writing mode</title>
|
|
<meta name="viewport" content="width=device-width">
|
|
<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>
|
|
setup({explicit_done: true});
|
|
|
|
function onEvent(target, eventName, validator) {
|
|
return new Promise((resolve) => {
|
|
const listener = (event) => {
|
|
validator(event);
|
|
resolve();
|
|
};
|
|
target.addEventListener(eventName, listener, { once: true });
|
|
});
|
|
}
|
|
|
|
async function run() {
|
|
promise_test(async () => {
|
|
const touchstart_promise = onEvent(document.documentElement,
|
|
"touchstart", (event) => {
|
|
assert_equals(event.changedTouches[0].clientX, 10,
|
|
"touchstart clientX coordinates are correct in vertical-rl");
|
|
assert_equals(event.changedTouches[0].clientY, 20,
|
|
"touchstart clientX coordinates are correct in vertical-rl");
|
|
});
|
|
|
|
const click_promise = onEvent(document.documentElement,
|
|
"click", (event) => {
|
|
assert_equals(event.clientX, 10,
|
|
"click clientX coordinates are correct in vertical-rl");
|
|
assert_equals(event.clientY, 20,
|
|
"click clientY coordinates are correct in vertical-rl");
|
|
});
|
|
|
|
const actions = new test_driver.Actions()
|
|
.addPointer("touchPointer1", "touch")
|
|
.pointerMove(10, 20)
|
|
.pointerDown()
|
|
.pointerUp();
|
|
|
|
const actions_promise = actions.send();
|
|
await Promise.all([actions_promise, click_promise, touchstart_promise]);
|
|
done();
|
|
}, "touch & click events in vertical-rl mode have correct coordinates");
|
|
}
|
|
</script>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
writing-mode: vertical-rl;
|
|
}
|
|
.forcescroll {
|
|
width: 5000px;
|
|
height: 20px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body onload="run()">
|
|
<div class="forcescroll"></div>
|
|
</body>
|
|
</html> |