| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta name="viewport" content="width=device-width"> |
| <script src="../../../resources/ui-helper.js"></script> |
| <style> |
| body { |
| margin: 0; |
| padding: 0; |
| } |
| |
| .green { |
| background-color: green; |
| } |
| |
| .red { |
| background-color: red; |
| } |
| |
| .hidden { |
| display: none; |
| } |
| </style> |
| <script> |
| if (window.testRunner) |
| testRunner.waitUntilDone(); |
| |
| // UIKit hides the scroll indicator after 1 second. |
| const ScrollIndicatorFlashHideDelay = 1000; // milliseconds |
| |
| function done() |
| { |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| } |
| |
| function swapRedGreenBackground(element) |
| { |
| if (element.classList.contains("red")) { |
| element.classList.remove("red"); |
| element.classList.add("green"); |
| } else if (element.classList.contains("green")) { |
| element.classList.remove("green"); |
| element.classList.add("red"); |
| } |
| } |
| |
| function didEndScroll() |
| { |
| window.onscroll = null; |
| // FIXME: Disable flashing of scroll indicator or find a way know when the flash has finished. |
| window.setTimeout(done, ScrollIndicatorFlashHideDelay); |
| } |
| |
| function handleScroll(event) |
| { |
| if (!window.scrollY) |
| didEndScroll(); |
| } |
| |
| function runTest() |
| { |
| let secondSquare = document.getElementById("secondSquare"); |
| secondSquareMaxY = secondSquare.offsetTop + secondSquare.offsetHeight; |
| |
| function scrollToTop() { |
| console.assert(window.scrollY + window.innerHeight >= secondSquareMaxY); |
| swapRedGreenBackground(document.getElementById("firstSquare")); |
| swapRedGreenBackground(document.getElementById("secondSquare")); |
| window.onscroll = handleScroll; |
| if (window.testRunner) |
| UIHelper.keyDown("upArrow", ["metaKey"]); |
| |
| } |
| window.scrollTo(0, secondSquareMaxY); |
| window.setTimeout(scrollToTop, 0); |
| } |
| |
| window.onload = function () |
| { |
| if (!window.testRunner) { |
| // Show manual instructions. |
| document.getElementById("manual-instructions").classList.remove("hidden"); |
| return; |
| } |
| runTest(); |
| } |
| </script> |
| </head> |
| <body> |
| <p id="description">Tests that pressing <key>Command</key> + <key>↑</key> scrolls to the bottom of the page. This test PASSED if you see a green square. Otherwise, it FAILED.</p> |
| <p id="manual-instructions" class="hidden">To run this test by hand, click <button onclick="runTest()">Run test</button> to first scroll to the bottom of the page. Then press <key>Command</key> + <key>↑</key>.</p> |
| <div id="firstSquare" style="width: 256px; height: 256px" class="red"></div> |
| <div style="height: 2000px"></div> |
| <div id="secondSquare" style="width: 256px; height: 256px" class="green"></div> |
| </body> |
| </html> |
