Fix snap fling regression

In the linked bug, flings within large snap areas (constrained native flings) would incorrectly snap based on the last finger position, rather than the position the fling lands at. This patch fixes this by ensuring that we always recompute the snap strategy for a constrained native fling since we cannot know ahead of time where that fling will land. Bug: 340895249 Change-Id: I53dd98238a8ce574f552ccace4ee40427248b9cd Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5555100 Reviewed-by: Robert Flack <[email protected]> Commit-Queue: David Awogbemila <[email protected]> Cr-Commit-Position: refs/heads/main@{#1308128}
web-platform-tests · May 30, 2024 · 35202a4 · 35202a4
1 parent 3fd0c91
commit 35202a4
Show file tree

Hide file tree

Showing 2 changed files with 59 additions and 1 deletion.
diff --git a/css/css-scroll-snap/snap-fling-in-large-area.html b/css/css-scroll-snap/snap-fling-in-large-area.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Fling within a large target is not interrupted by scroll snap</title>
+  <link rel="help" href="https://drafts.csswg.org/css-scroll-snap/"/>
+  <script src="/resources/testharness.js"></script>
+  <script src="/resources/testharnessreport.js"></script>
+  <script src="/resources/testdriver.js"></script>
+  <script src="/resources/testdriver-actions.js"></script>
+  <script src="/resources/testdriver-vendor.js"></script>
+  <script src="/dom/events/scrolling/scroll_support.js"></script>
+</head>
+<body>
+  <style>
+    main {
+      scroll-snap-type: y;
+
+      overflow: auto;
+      height: 100vh;
+    }
+
+    div {
+      scroll-snap-align: start;
+      width: 80vw;
+      height: 800vh;
+      background: yellow;
+      border: solid black 3px;
+    }
+  </style>
+  <main id="scroller">
+    <div></div>
+  </main>
+  <script>
+    promise_test(async (t) => {
+      await waitForCompositorCommit();
+      const scroller = document.getElementById("scroller");
+      assert_equals(scroller.scrollTop, 0, "scroller not initially scrolled");
+
+      let initial_scroll_top = scroller.scrollTop;
+      let last_scroll_top = initial_scroll_top;
+      const scroll_listener = () => {
+        assert_greater_than_equal(scroller.scrollTop, last_scroll_top,
+          "fling did not move backwards.");
+        last_scroll_top = scroller.scrollTop;
+      }
+      scroller.addEventListener("scroll", scroll_listener);
+      const scrollend_promise = waitForScrollendEventNoTimeout(scroller);
+      await touchFlingInTarget(/*pixels_to_scroll*/100, scroller, "down");
+      await scrollend_promise;
+
+      assert_greater_than(last_scroll_top, initial_scroll_top,
+        "received at least one scroll update.");
+      assert_greater_than_equal(scroller.scrollTop, last_scroll_top,
+        "fling did not move backwards at the end of the scroll.");
+    }, "fling within a large area is not interrupted by scroll snap");
+  </script>
+</body>
+</html>
diff --git a/dom/events/scrolling/scroll_support.js b/dom/events/scrolling/scroll_support.js
@@ -220,7 +220,7 @@ function touchScrollInTarget(pixels_to_scroll, target, direction, pause_time_in_
 
 // Trigger fling by doing pointerUp right after pointerMoves.
 function touchFlingInTarget(pixels_to_scroll, target, direction) {
-  touchScrollInTarget(pixels_to_scroll, target, direction, 0 /* pause_time */);
+  return touchScrollInTarget(pixels_to_scroll, target, direction, 0 /* pause_time */);
 }
 
 function mouseActionsInTarget(target, origin, delta, pause_time_in_ms = 100) {