helper_scrollIntoView_in_nested_fixed_elements.html (1483B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width,initial-scale=1"> 6 <title>Tests that Element.scrollIntoView scrolls visually to an element in nested position: fixed elements</title> 7 <script src="apz_test_native_event_utils.js"></script> 8 <script src="apz_test_utils.js"></script> 9 <script src="/tests/SimpleTest/paint_listener.js"></script> 10 </head> 11 <style> 12 body { 13 margin: 0px; 14 padding: 0px; 15 } 16 #container { 17 position: fixed; 18 width: 100%; 19 height: 100%; 20 top: 0px; 21 left: 0px; 22 } 23 #banner { 24 position: fixed; 25 bottom: 0px; 26 left: 0px; 27 right: 0px; 28 background-color: blue; 29 } 30 </style> 31 <body> 32 <div id="container"> 33 <aside id="banner"></aside> 34 </div> 35 <script> 36 async function test() { 37 is(window.scrollY, 0, "The initial scroll offset should be 0"); 38 is(visualViewport.scale, 2.0, "The document should get scaled by 2.0"); 39 is(visualViewport.pageTop, 0, "The initial visual viewport pageTop should be 0"); 40 41 const scrollPromise = 42 new Promise(resolve => visualViewport.addEventListener("scroll", resolve)); 43 document.querySelector("#banner").scrollIntoView(); 44 await scrollPromise; 45 46 await promiseApzFlushedRepaints(); 47 48 ok(visualViewport.pageTop > 0, 49 `The visual viewport should have been scrolled: ${visualViewport.pageTop}`); 50 } 51 52 SpecialPowers.getDOMWindowUtils(window).setResolutionAndScaleTo(2.0); 53 waitUntilApzStable() 54 .then(test) 55 .then(subtestDone, subtestFailed); 56 </script> 57 </body> 58 </html>