Bug 1546057 - Use the clamped destination position for overflow checks. r=botond

Differential Revision: https://phabricator.services.mozilla.com/D28578

--HG--
extra : moz-landing-system : lando

layout/generic/ScrollSnap.cpp

@@ -290,19 +290,22 @@ Maybe<nsPoint> ScrollSnapUtils::GetSnapPointForDestination(
     // elements, any points inside the covering area should be valid snap
     // points.
     // https://drafts.csswg.org/css-scroll-snap-1/#snap-overflow
+    // NOTE: |aDestination| sometimes points outside of the scroll range, e.g.
+    // by the APZC fling, so for the overflow checks we need to clamp it.
+    nsPoint clampedDestination = aScrollRange.ClampPoint(aDestination);
     for (auto range : aSnapInfo.mXRangeWiderThanSnapport) {
-      if (range.IsValid(aDestination.x, aSnapInfo.mSnapportSize.width) &&
+      if (range.IsValid(clampedDestination.x, aSnapInfo.mSnapportSize.width) &&
           calcSnapPoints.XDistanceBetweenBestAndSecondEdge() >
               aSnapInfo.mSnapportSize.width) {
-        calcSnapPoints.AddVerticalEdge(aDestination.x);
+        calcSnapPoints.AddVerticalEdge(clampedDestination.x);
         break;
       }
     }
     for (auto range : aSnapInfo.mYRangeWiderThanSnapport) {
-      if (range.IsValid(aDestination.y, aSnapInfo.mSnapportSize.height) &&
+      if (range.IsValid(clampedDestination.y, aSnapInfo.mSnapportSize.height) &&
           calcSnapPoints.YDistanceBetweenBestAndSecondEdge() >
               aSnapInfo.mSnapportSize.height) {
-        calcSnapPoints.AddHorizontalEdge(aDestination.y);
+        calcSnapPoints.AddHorizontalEdge(clampedDestination.y);
         break;
       }
     }

testing/web-platform/tests/css/css-scroll-snap/overflowing-snap-areas.html

@@ -63,6 +63,7 @@ div {
     <div class="target small" style="top: 200px"></div>
     <div class="target small" style="top: 600px"></div>
     <div class="target small" style="top: 1200px"></div>
+    <div class="target large-y" style="top: 2000px"></div>
   </div>
 </div>
 
@@ -143,6 +144,20 @@ test(() => {
 }, "Snap to current scroll position which is a valid snap position, as the " +
    "snap area covers snapport on y and there is no subsequent snap positions.");
 
+test(() => {
+  const maxScrollTop = scroller_y.scrollHeight - scroller_y.clientHeight;
+
+  // Scroll to the bottom edge which is a valid snap position that a large
+  // target element covers the snapport.
+  scroller_y.scrollTo(0, maxScrollTop);
+  assert_equals(scroller_y.scrollTop, maxScrollTop);
+
+  // Scroll to `the bottom edge + 1`.
+  scroller_y.scrollTo(0, maxScrollTop + 1);
+  assert_equals(scroller_y.scrollTop, maxScrollTop);
+}, "Don't snap back even if scrollTo tries to scroll to positions which are " +
+   "outside of the scroll range and if a snap target element covers the snaport");
+
 test(() => {
   two_axes_scroller.scrollTo(10, 100);
   assert_equals(two_axes_scroller.scrollLeft, 10);