| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| <script src="../../../resources/gesture-util.js"></script> |
| <style> |
| html { |
| -webkit-writing-mode: vertical-rl; |
| } |
| body { |
| margin: 0px; |
| height: 2000px; |
| width: 2000px; |
| } |
| #changer { |
| background-color: #FF7F7F; |
| width: 10px; |
| } |
| #anchor { |
| width: 1500px; |
| background-color: #84BE6A; |
| } |
| </style> |
| |
| <div id="changer"></div> |
| <div id="anchor"></div> |
| |
| <script> |
| var asyncTest = async_test("Verify smooth scroll interaction with scroll anchoring on page with vertical-lr writing mode"); |
| |
| // The element that will change in height. |
| var ch; |
| // Initital scroll position. |
| var initialX = -10; |
| var initialY = 0; |
| // Amount to smooth scroll by. |
| var userScrollX = -205; |
| // Amount to change the height of the element above the viewport. |
| var changerX = 100; |
| // End position: height of ch + userScroll. |
| var endX = -305; |
| var source = GestureSourceType.MOUSE_INPUT; |
| |
| function scrollListener() { |
| if (window.scrollX == endX) { |
| asyncTest.done(); |
| return; |
| } |
| |
| if (ch.style.width != "100") |
| ch.style.width = changerX; |
| } |
| |
| window.onload = async () => { |
| ch = document.getElementById("changer"); |
| document.addEventListener("scroll", scrollListener); |
| |
| // Smooth scroll. |
| smoothScroll(userScrollX, 100, 100, source, 'right', SPEED_INSTANT, false /* precise_scrolling_deltas */); |
| await raf(); |
| window.scrollTo(initialX, initialY); |
| } |
| </script> |