| <!doctype html> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script src="../../resources/gesture-util.js"></script> |
| <style> |
| #scroll-div { |
| width:400px; height:100px; |
| overflow: auto; |
| position:relative; |
| } |
| #range-div { |
| width:4194410px; height: 4194410px; |
| border:1px solid red; |
| position:absolute; |
| top: 10px; |
| left: 10px; |
| } |
| </style> |
| <div id="scroll-div"> |
| <div id="range-div"></div> |
| </div> |
| <script> |
| var scroller = document.querySelector("#scroll-div"); |
| // Scroll div to some large offset that is > 0.5*4194410 |
| const LARGE_SCROLL_OFFSET = 2097206; |
| scroller.scrollTop = LARGE_SCROLL_OFFSET; |
| scroller.scrollLeft = LARGE_SCROLL_OFFSET; |
| const SCROLL_PERCENTAGE = 0.1; |
| promise_test(async () => { |
| // Scroll the inner scroller by the SCROLL_PERCENTAGE. |
| var originalTopOffset = scroller.scrollTop; |
| var originalLeftOffset = scroller.scrollLeft; |
| |
| // Use negative scroll percentages because we want to scroll up and left |
| await percentScroll(-SCROLL_PERCENTAGE, |
| -SCROLL_PERCENTAGE, |
| 50, |
| 50, |
| GestureSourceType.MOUSE_INPUT); |
| |
| function isCorrectOffset() { |
| return scroller.scrollTop <= |
| Math.round(originalTopOffset - scroller.clientHeight * SCROLL_PERCENTAGE); |
| } |
| await waitFor(isCorrectOffset, |
| "Scrolling by 10% must scroll the correct amount."); |
| |
| assert_less_than(scroller.scrollTop, originalTopOffset, |
| "Must be able to scroll vertically by percentage even when at large offset"); |
| assert_less_than(scroller.scrollLeft, originalLeftOffset, |
| "Must be able to scroll horizontally by percentage even when at large offset"); |
| |
| |
| }, "Can scroll by percentage at large offset"); |
| |
| |
| </script> |