scrollend-fires-to-text-input.html (3920B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 </head> 7 <body> 8 <style> 9 #inputscroller { 10 width: 100px; 11 height: 50px; 12 } 13 </style> 14 <input type="text" id="inputscroller" 15 value="qwertyuiopasddfghjklzxcvbnmqwertyuiopasddfghjklzxcvbnmqwer"> 16 <script> 17 const inputscroller = document.getElementById("inputscroller"); 18 19 function register_cleanup(t) { 20 t.add_cleanup(() => { 21 return new Promise(resolve => { 22 inputscroller.addEventListener("scrollend", resolve, { once: true }); 23 inputscroller.scrollLeft = 0; 24 }); 25 }); 26 } 27 28 promise_test(async t => { 29 register_cleanup(t); 30 assert_equals(inputscroller.scrollLeft, 0, 31 "text input field is not initially scrolled."); 32 33 const scrollend_promise = new Promise((resolve) => { 34 inputscroller.addEventListener("scrollend", resolve, { once: true }); 35 }); 36 inputscroller.scrollLeft = 10; 37 await scrollend_promise; 38 assert_equals(inputscroller.scrollLeft, 10, 39 "text input field is scrolled by the correct amount"); 40 }, "scrolled input field should receive scrollend when setting scrollLeft."); 41 42 promise_test(async t => { 43 register_cleanup(t); 44 assert_equals(inputscroller.scrollLeft, 0, 45 "text input field is not initially scrolled."); 46 47 const scrollend_promise = new Promise((resolve) => { 48 inputscroller.addEventListener("scrollend", resolve, { once: true }); 49 }); 50 inputscroller.scrollBy({ left: 10, behavior: "smooth" }); 51 await scrollend_promise; 52 assert_equals(inputscroller.scrollLeft, 10, 53 "text input field is scrolled by the correct amount"); 54 }, "scrolled input field should receive scrollend with scrollBy({ behavior: 'smooth' })."); 55 56 promise_test(async t => { 57 register_cleanup(t); 58 assert_equals(inputscroller.scrollLeft, 0, 59 "text input field is not initially scrolled."); 60 61 const scrollend_promise = new Promise((resolve) => { 62 inputscroller.addEventListener("scrollend", resolve, { once: true }); 63 }); 64 inputscroller.scrollBy({ left: 10, behavior: "instant" }); 65 await scrollend_promise; 66 assert_equals(inputscroller.scrollLeft, 10, 67 "text input field is scrolled by the correct amount"); 68 }, "scrolled input field should receive scrollend with scrollBy({ behavior: 'instant' })."); 69 70 promise_test(async t => { 71 register_cleanup(t); 72 assert_equals(inputscroller.scrollLeft, 0, 73 "text input field is not initially scrolled."); 74 75 const scrollend_promise = new Promise((resolve) => { 76 inputscroller.addEventListener("scrollend", resolve, { once: true }); 77 }); 78 inputscroller.scrollTo({ left: 10, behavior: "smooth" }); 79 await scrollend_promise; 80 assert_equals(inputscroller.scrollLeft, 10, 81 "text input field is scrolled by the correct amount"); 82 }, "scrolled input field should receive scrollend with scrollTo({ behavior: 'smooth' })."); 83 84 promise_test(async t => { 85 register_cleanup(t); 86 assert_equals(inputscroller.scrollLeft, 0, 87 "text input field is not initially scrolled."); 88 89 const scrollend_promise = new Promise((resolve) => { 90 inputscroller.addEventListener("scrollend", resolve, { once: true }); 91 }); 92 inputscroller.scrollTo({ left: 10, behavior: "instant" }); 93 await scrollend_promise; 94 assert_equals(inputscroller.scrollLeft, 10, 95 "text input field is scrolled by the correct amount"); 96 }, "scrolled input field should receive scrollend with scrollTo({ behavior: 'instant' })."); 97 </script> 98 </body> 99 </html>