helper_drag_root_scrollbar.html (2089B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width; initial-scale=1.0"> 6 <title>Dragging the mouse on the viewport's scrollbar</title> 7 <script type="application/javascript" src="apz_test_native_event_utils.js"></script> 8 <script type="application/javascript" src="apz_test_utils.js"></script> 9 <script src="/tests/SimpleTest/paint_listener.js"></script> 10 <style> 11 .content { 12 width: 1000px; 13 height: 5000px; 14 } 15 </style> 16 <script type="text/javascript"> 17 18 async function test() { 19 let scrollPromise = new Promise(resolve => { 20 window.addEventListener("scroll", resolve, {once: true}); 21 }); 22 23 // Do the scroll in one increment so that when the scroll event fires 24 // we're done all the scrolling we're going to do. 25 var dragFinisher = await promiseVerticalScrollbarDrag(window, 20, 20); 26 if (!dragFinisher) { 27 ok(true, "No scrollbar, can't do this test"); 28 return; 29 } 30 31 // the events above might be stuck in APZ input queue for a bit until the 32 // layer is activated, so we wait here until the scroll event listener is 33 // triggered. 34 await scrollPromise; 35 36 await dragFinisher(); 37 38 // Flush everything just to be safe 39 await promiseOnlyApzControllerFlushed(); 40 41 // After dragging the scrollbar 20px on a 1000px-high viewport, we should 42 // have scrolled approx 2% of the 5000px high content. There might have been 43 // scroll arrows and such so let's just have a minimum bound of 50px to be safe. 44 ok(window.scrollY > 50, "Scrollbar drag resulted in a vertical scroll position of " + window.scrollY); 45 46 // Check that we did not get spurious horizontal scrolling, as we might if the 47 // drag gesture is mishandled by content as a select-drag rather than a scrollbar 48 // drag. 49 is(window.scrollX, 0, "Scrollbar drag resulted in a horizontal scroll position of " + window.scrollX); 50 } 51 52 waitUntilApzStable() 53 .then(test) 54 .then(subtestDone, subtestFailed); 55 56 </script> 57 </head> 58 <body> 59 <div class="content">Some content to ensure the root scrollframe is scrollable</div> 60 </body> 61 </html>