| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <html> |
| <head> |
| <script src="../resources/accessibility-helper.js"></script> |
| <script src="../resources/js-test.js"></script> |
| </head> |
| <body> |
| |
| <div id="container" style="height: 100px; overflow: scroll"> |
| <button id="upper_target">Upper Target</button> |
| <div style="border: 1px solid #000; height: 5000px;">5000-pixel box</div> |
| <button id="lower_target">Lower Target</button> |
| </div> |
| |
| <script> |
| var output = "Tests that scrolling to make an element visible successfully scrolls an arbitrary HTML element that has CSS overflow set to 'scroll'.\n\n"; |
| |
| var upperTarget = document.getElementById("upper_target"); |
| var lowerTarget = document.getElementById("lower_target"); |
| window.container = document.getElementById("container"); |
| async function scrollToMakeVisibleAndCheck(axElement, domTarget) { |
| axElement.scrollToMakeVisible(); |
| await waitFor(() => { |
| var top = domTarget.offsetTop - container.offsetTop; |
| window.minYOffset = top + domTarget.offsetHeight - container.offsetHeight; |
| window.maxYOffset = top; |
| return container.scrollTop >= minYOffset && container.scrollTop <= maxYOffset; |
| }); |
| |
| output += expect("container.scrollTop >= minYOffset", "true"); |
| output += expect("container.scrollTop <= maxYOffset", "true"); |
| } |
| |
| if (window.accessibilityController) { |
| window.jsTestIsAsync = true; |
| |
| var lowerTargetAccessibleObject; |
| var upperTargetAccessibleObject; |
| setTimeout(async function() { |
| lowerTargetAccessibleObject = await waitForFocus("lower_target"); |
| upperTargetAccessibleObject = await waitForFocus("upper_target"); |
| |
| // Reset the initial scroll position (since calling focus() can scroll the page too). |
| container.scrollTop = 0; |
| output += expect("container.scrollTop", "0"); |
| |
| // Scroll to make lower target visible and check. |
| await scrollToMakeVisibleAndCheck(lowerTargetAccessibleObject, lowerTarget); |
| |
| // Do it again. It shouldn't scroll. |
| await scrollToMakeVisibleAndCheck(lowerTargetAccessibleObject, lowerTarget); |
| |
| // Now do the upper target. |
| await scrollToMakeVisibleAndCheck(upperTargetAccessibleObject, upperTarget); |
| |
| debug(output); |
| finishJSTest(); |
| }, 0); |
| } |
| </script> |
| </body> |
| </html> |
| |
