snaps-after-touchpad-scrolling.html

<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../../resources/gesture-util.js"></script>
<style>
#scroller {
  width: 500px;
  height: 500px;
  overflow: scroll;
  scroll-snap-type: x mandatory;

  /* Ensure scroller gets composited scrolling when available. */
  background: white;
  contain: paint;
}
#space {
  width: 2000px;
  height: 2000px;
}
.target {
  position: absolute;
  top: 0;
  width: 100px;
  height: 100px;
  scroll-snap-align: start;
  background-color: blue;
}
</style>

<div id="scroller">
  <div id="space"></div>
  <div class="target" style="left: 0px;"></div>
  <div class="target" style="left: 120px;"></div>
  <div class="target" style="left: 240px;"></div>
</div>

<script>
const scroller = document.getElementById("scroller");

function touchpadScroll(delta, x, y, direction, scroller) {
  const scrollPromise = waitForScrollendEvent(scroller);
  // A touchpad scroll comes from mouse input with precise delta. Sticking with
  // the gpubenchmarking API for now rather than test-driver for symmetry with
  // the snaps-after-wheel-scrolling test.
  const gesturePromise =
      smoothScroll(delta, x ,y , GestureSourceType.MOUSE_INPUT, direction,
                   SPEED_INSTANT, true /* is precise delta */);
  return Promise.all([ gesturePromise, scrollPromise ]);
}

promise_test (async t => {
  await waitForScrollReset(scroller);

  // scroll just 10px so the current snap point remains closest.
  await touchpadScroll(10 /* pixels to scroll */, 50, 50, 'right', scroller);
  assert_approx_equals(scroller.scrollLeft, 0, 1);
}, "Touchpad scrolling (right) should prefer the closest snap area regardless"
   + " of scroll direction.");

promise_test (async t => {
  await waitForScrollReset(scroller, 120, 0);
  assert_approx_equals(scroller.scrollLeft, 120, 1);

  // Scroll passed the last snap point. We should still get a scrollend event
  // since we have scrolled past and are snapping back.
  await touchpadScroll(10 /* pixels to scroll */, 50, 50, 'left', scroller);
  assert_approx_equals(scroller.scrollLeft, 120, 1);
}, "Touchpad scrolling (left) should prefer the closest snap area " +
   "regardless of scroll direction.");

promise_test (async t => {
  await waitForScrollReset(scroller);

  // Scroll so we pass the second snap point and are closest to third.
  await touchpadScroll(220 /* pixels to scroll */, 50, 50, 'right', scroller);
  assert_approx_equals(scroller.scrollLeft, 240, 1);
}, "Touchpad scrolling should prefer the closest snap point in scroll to the"
   + " scroll end position.");
</script>
chromium/third_party/blink/web_tests/fast/scroll-snap/snaps-after-touchpad-scrolling.html
