helper_zoomToFocusedInput_scroll.html (2207B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta name="viewport" content="width=device-width,interactive-widget=resizes-content"> 5 <title>Checking zoomToFocusedInput scrolls that focused input element is visible position</title> 6 <script type="application/javascript" src="apz_test_utils.js"></script> 7 <script type="application/javascript" src="apz_test_native_event_utils.js"></script> 8 <script src="/tests/SimpleTest/paint_listener.js"></script> 9 </head> 10 <body> 11 <div style="height: 8000px;">ABC</div> 12 <input id="input1"> 13 <!-- Leave additional room below the element so it can be scrolled to the center --> 14 <div style="height: 1000px;">ABC</div> 15 <script type="application/javascript"> 16 async function test() { 17 is(0, window.scrollY, "scroll position starts at zero"); 18 input1.focus(); 19 await waitToClearOutAnyPotentialScrolls(window); 20 isnot(0, window.scrollY, "scroll position isn't top"); 21 window.scrollTo(0, 0); 22 await waitToClearOutAnyPotentialScrolls(window); 23 is(0, window.scrollY, "scroll position is top"); 24 25 let utils = SpecialPowers.getDOMWindowUtils(window); 26 let scrollendPromise = promiseScrollend(); 27 utils.zoomToFocusedInput(); 28 isnot(0, window.scrollY, "scroll position isn't top"); 29 30 // Test for bug 1669588: check that the zoom animation did not get 31 // cancelled by a main thread scroll position update triggered by 32 // the ScrollContentIntoView() operation performed by zoomToFocusedInput(). 33 34 await scrollendPromise; 35 await promiseApzFlushedRepaints(); 36 37 // Check that the zoom animation performed additional scrolling 38 // beyond the ScrollContentIntoView(). The ScrollContentIntoView() 39 // just scrolls enough to bring `input1` into the viewport, while 40 // the zoom animation will scroll further to center it. To 41 // distinguish the two cases, check that we scrolled enough that 42 // the element's top is above the middle of the visual viewport. 43 let inputTop = input1.getBoundingClientRect().top; 44 inputTop -= window.visualViewport.offsetTop; 45 ok(inputTop < (window.visualViewport.height / 2), 46 "input was scrolled at least as far as the middle of the viewport"); 47 } 48 49 waitUntilApzStable().then(test).then(subtestDone, subtestFailed); 50 </script> 51 </body> 52 </html>