single-touch-vertical-rl.html (2244B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>Touch events with vertical-rl writing mode</title> 5 <meta name="viewport" content="width=device-width"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <script src="/resources/testdriver.js"></script> 9 <script src="/resources/testdriver-actions.js"></script> 10 <script src="/resources/testdriver-vendor.js"></script> 11 12 <script> 13 setup({explicit_done: true}); 14 15 function onEvent(target, eventName, validator) { 16 return new Promise((resolve) => { 17 const listener = (event) => { 18 validator(event); 19 resolve(); 20 }; 21 target.addEventListener(eventName, listener, { once: true }); 22 }); 23 } 24 25 async function run() { 26 promise_test(async () => { 27 const touchstart_promise = onEvent(document.documentElement, 28 "touchstart", (event) => { 29 assert_equals(event.changedTouches[0].clientX, 10, 30 "touchstart clientX coordinates are correct in vertical-rl"); 31 assert_equals(event.changedTouches[0].clientY, 20, 32 "touchstart clientX coordinates are correct in vertical-rl"); 33 }); 34 35 const click_promise = onEvent(document.documentElement, 36 "click", (event) => { 37 assert_equals(event.clientX, 10, 38 "click clientX coordinates are correct in vertical-rl"); 39 assert_equals(event.clientY, 20, 40 "click clientY coordinates are correct in vertical-rl"); 41 }); 42 43 const actions = new test_driver.Actions() 44 .addPointer("touchPointer1", "touch") 45 .pointerMove(10, 20) 46 .pointerDown() 47 .pointerUp(); 48 49 const actions_promise = actions.send(); 50 await Promise.all([actions_promise, click_promise, touchstart_promise]); 51 done(); 52 }, "touch & click events in vertical-rl mode have correct coordinates"); 53 } 54 </script> 55 <style> 56 body { 57 margin: 0; 58 writing-mode: vertical-rl; 59 } 60 .forcescroll { 61 width: 5000px; 62 height: 20px; 63 } 64 </style> 65 </head> 66 <body onload="run()"> 67 <div class="forcescroll"></div> 68 </body> 69 </html>