Bug 223021 – CSS scroll snap should allow scrolling to the middle of snap areas that overflow the snapport

• Component: Scrolling
• Status: RESOLVED FIXED

[Martin Robinson]

In the "Snapping Boxes that Overflow the Scrollport" section [1] of the CSS Scroll Snap specification, it reads:

  If the snap area is larger than the snapport in a particular axis, then any scroll
  position in which the snap area covers the snapport, and the distance between the
  geometrically previous and subsequent snap positions in that axis is larger than
  size of the snapport in that axis, is a valid snap position in that axis. The UA 
  may use the specified alignment as a more precise target for certain scroll operations
  (e.g. explicit paging).

In order to implement this behavior, the scroll snap selection code needs to know the size of snap areas when choosing snap points during scrolling. This is perhaps a good moment to rework the scroll snap data structure so that it will be able to support masonry layouts as well.

1. https://drafts.csswg.org/css-scroll-snap-1/#snap-overflow

[Radar WebKit Bug Importer]

<rdar://problem/75518606>

[Martin Robinson]

Created attachment 423466 [details]
Patch

Here's some background on these changes as they are a bit larger and more complicated than normal:

Before this change when snap points were calculated after a layout and a ScrollSnapOffsetsInfo was created with both the offsets of the snap points and a set of ranges of offsets where no snapping occurred. These ranges were useful because it made it simple to determine if a particular offset was subject to snapping. With the implementation of this part of the specification, the range-based approach is not as suitable because snap areas (which may overlap) now affect whether or not a scroll will snap to a snap point.

Instead, this change take a lazier approach. During scrolling, we walk through each potential snap offset and look at the associated snap area. This information to determine if the destination scroll offset falls onto a snap area that overflows the snapport or if it is subject to proximity snapping.

[Martin Robinson]

*** Bug 223175 has been marked as a duplicate of this bug. ***

[Martin Robinson]

Created attachment 423486 [details]
Patch

[Martin Robinson]

Created attachment 424004 [details]
Patch

[Martin Robinson]

Comment on attachment 424004 [details]
Patch

This patch is a little bit, so my plan is to split it up into very simple parts to make it easier to review.

[Martin Robinson]

Created attachment 428925 [details]
Patch

[Martin Robinson]

Created attachment 432249 [details]
Patch

[EWS]

Committed r279364 (239230@main): <https://commits.webkit.org/239230@main>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 432249 [details].