test_frame_reconstruction_scroll_restore.html (3177B)
1 <html> 2 <!-- 3 https://bugzilla.mozilla.org/show_bug.cgi?id=1268195 4 --> 5 <head> 6 <meta charset="utf-8"> 7 <title>Test for Bug 1268195</title> 8 <script src="/tests/SimpleTest/SimpleTest.js"></script> 9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 10 <style> 11 html, body { 12 margin: 0; 13 padding: 0; 14 } 15 16 .noscroll { 17 overflow: hidden; 18 height: 100%; 19 } 20 21 /* Toggling this on and off triggers a frame reconstruction on the <body> */ 22 html.reconstruct-body::before { 23 top: 0; 24 content: ''; 25 display: block; 26 height: 2px; 27 position: absolute; 28 width: 100%; 29 z-index: 99; 30 } 31 </style> 32 <script type="application/javascript"> 33 SimpleTest.waitForExplicitFinish(); 34 35 function run() { 36 // Make sure we have the right scroll element 37 SimpleTest.is(document.body.scrollTopMax > 0, true, "Body is the scrolling element"); 38 39 // Scroll to the bottom 40 document.body.scrollTop = document.body.scrollTopMax; 41 SimpleTest.is(document.body.scrollTop > 0, true, "Scrolled body"); 42 43 // Do a frame reconstruction on the body while also shortening the 44 // height, but still keep it long enough to be scrollable. 45 document.body.classList.toggle('noscroll'); 46 document.documentElement.classList.toggle('reconstruct-body'); 47 document.getElementById('spacer').style.height = '1000px'; 48 var reducedMax = document.body.scrollTopMax; 49 SimpleTest.isfuzzy(document.body.scrollTop, reducedMax, 1, `Scroll forced to new bottom ${reducedMax}`); 50 51 // Do another frame reconstruction while lengthening the height again. 52 document.body.classList.toggle('noscroll'); 53 document.documentElement.classList.toggle('reconstruct-body'); 54 document.getElementById('spacer').style.height = '5000px'; 55 SimpleTest.isfuzzy(document.body.scrollTop, reducedMax, 1, "Scroll remained at reduced height"); 56 57 // Do a frame reconstruction on the body while also shortening the 58 // height, this time down to a non-scrollable height. 59 document.body.classList.toggle('noscroll'); 60 document.documentElement.classList.toggle('reconstruct-body'); 61 document.getElementById('spacer').style.height = '1px'; 62 SimpleTest.is(document.body.scrollTop, 0, "Scroll forced to top"); 63 64 // Do another frame reconstruction while lengthening the height again. 65 document.body.classList.toggle('noscroll'); 66 document.documentElement.classList.toggle('reconstruct-body'); 67 document.getElementById('spacer').style.height = '5000px'; 68 SimpleTest.is(document.body.scrollTop, 0, "Scroll remained at top"); 69 70 SimpleTest.finish(); 71 } 72 </script> 73 </head> 74 <body onload="setTimeout(run, 0)"> 75 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1268195">Mozilla Bug 1268195</a><br/> 76 The scroll position should end the top of the page. This is the top, yay! 77 <div id="spacer" style="height: 5000px"></div> 78 The scroll position should end the top of the page. This is the bottom! 79 <pre id="test"> 80 </pre> 81 </body> 82 </html>