| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| body { |
| margin: 0; |
| } |
| |
| .box { |
| width: 100vw; |
| height: 100vh; |
| } |
| </style> |
| <script src="../../resources/js-test.js"></script> |
| <script src="../../resources/ui-helper.js"></script> |
| <script> |
| window.jsTestIsAsync = true; |
| |
| async function runTests() |
| { |
| try { |
| await UIHelper.keyDown("pageDown"); |
| await UIHelper.waitForTargetScrollAnimationToSettle(document.scrollingElement); |
| |
| expectTrue(document.scrollingElement.scrollTop != 0, "paging moved body"); |
| let defaultPagePosition = document.scrollingElement.scrollTop; |
| let viewportHeight = document.scrollingElement.clientHeight; |
| let pageProportion = document.scrollingElement.scrollTop / viewportHeight; |
| |
| document.scrollingElement.scrollTop = 0; |
| await UIHelper.waitForTargetScrollAnimationToSettle(document.scrollingElement); |
| |
| document.documentElement.style.scrollPaddingTop = "10px"; |
| await UIHelper.keyDown("pageDown"); |
| await UIHelper.waitForTargetScrollAnimationToSettle(document.scrollingElement); |
| |
| let expected = (viewportHeight - 10) * pageProportion; |
| expectTrue(document.scrollingElement.scrollTop != 0, "paging moved padded body"); |
| shouldBeCloseTo("document.scrollingElement.scrollTop", expected, 1); |
| |
| document.scrollingElement.scrollTop = 0; |
| await UIHelper.waitForTargetScrollAnimationToSettle(document.scrollingElement); |
| |
| document.documentElement.style.scrollPaddingTop = "0px"; |
| document.documentElement.style.scrollPaddingBottom = "10px"; |
| await UIHelper.keyDown("pageDown"); |
| await UIHelper.waitForTargetScrollAnimationToSettle(document.scrollingElement); |
| |
| expectTrue(document.scrollingElement.scrollTop != 0, "paging moved padded body"); |
| shouldBeCloseTo("document.scrollingElement.scrollTop", expected, 1); |
| |
| document.scrollingElement.scrollTop = 0; |
| await UIHelper.waitForTargetScrollAnimationToSettle(document.scrollingElement); |
| |
| document.documentElement.style.scrollPaddingTop = "10px"; |
| document.documentElement.style.scrollPaddingBottom = "10px"; |
| await UIHelper.keyDown("pageDown"); |
| await UIHelper.waitForTargetScrollAnimationToSettle(document.scrollingElement); |
| |
| expected = (viewportHeight - 20) * pageProportion; |
| expectTrue(document.scrollingElement.scrollTop != 0, "paging moved padded body"); |
| shouldBeCloseTo("document.scrollingElement.scrollTop", expected, 2); |
| } catch (e) { |
| console.log(e); |
| } finally { |
| finishJSTest(); |
| } |
| } |
| |
| function onLoad() |
| { |
| if (window.eventSender) { |
| runTests(); |
| } else { |
| var console = document.getElementById('console'); |
| console.innerText = "This test cannot be run manually." |
| } |
| } |
| </script> |
| </head> |
| <body onload="onLoad();"> |
| <div class="box" style="background: green;"><div id="console"></div></div> |
| <div class="box" style="background: red;"></div> |
| <div class="box" style="background: pink;"></div> |
| <div class="box" style="background: yellow;"></div> |
| <div class="box" style="background: orange;"></div> |
| </body> |
| </html> |
