helper_bug1519339_hidden_smoothscroll.html (2099B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta name="viewport" content="width=device-width; initial-scale=1.0"> 5 <title>Test for bug 1519339</title> 6 <script type="application/javascript" src="apz_test_native_event_utils.js"></script> 7 <script type="application/javascript" src="apz_test_utils.js"></script> 8 <script src="/tests/SimpleTest/paint_listener.js"></script> 9 <style> 10 /* To exercise this bug, the page needs to be overflow:hidden in 11 * only one direction, and have actual room to scroll in the other. 12 * Otherwise we wouldn't try to hand the scroll off to APZ even 13 * before the fix. 14 */ 15 html { 16 overflow-y: hidden; 17 } 18 div { 19 width: 200vw; 20 height: 10000px; 21 background-color: lightblue; 22 } 23 </style> 24 </head> 25 <body> 26 <div></div> 27 <script> 28 async function test() { 29 info("Testing scrollTo() in overflow:hidden direction"); 30 let scrollEndPromise = promiseScrollend(); 31 window.scrollTo({ top: 2000, behavior: 'smooth' }); 32 await scrollEndPromise; 33 await promiseApzFlushedRepaints(); 34 is(window.scrollY, 2000, 35 "scrollTo() in overflow:hidden direction scrolled to destination"); 36 37 info("Testing scrollBy() in overflow:hidden direction"); 38 scrollEndPromise = promiseScrollend(); 39 window.scrollBy({ top: 2000, behavior: 'smooth'}); 40 await scrollEndPromise; 41 await promiseApzFlushedRepaints(); 42 is(window.scrollY, 4000, 43 "scrollBy() in overflow:hidden direction scrolled to destination"); 44 45 info("Testing scrollByLines() in overflow:hidden direction"); 46 scrollEndPromise = promiseScrollend(); 47 window.scrollByLines(5, { behavior: 'smooth' }); 48 await scrollEndPromise; 49 await promiseApzFlushedRepaints(); 50 // Don't try to predict the exact scroll distance, just check we've 51 // scrolled at all. 52 ok(window.scrollY > 4000, 53 "scrollByLines() in overflow:hidden direction performed scrolling"); 54 55 } 56 waitUntilApzStable() 57 .then(test) 58 .then(subtestDone, subtestFailed); 59 </script> 60 </body> 61 </html>