CSS Scroll Snap

[johannesodland]

Description

Improve support for CSS Scroll Snap 1.

Scrolling was a part of Interop 2022 and 2023, and although we've seen great improvements there are still many open issues with scroll-snap, particularly when used on :root/viewport.

Many bugs occur in combination with other APIs such as scrollIntoView(), scroll-to-top gestures, search, Voice Over and more. Improving the test score would go a long way, but it might be necessary to improve the WPT tests.

Specification

https://www.w3.org/TR/css-scroll-snap-1/

Open Issues

No response

Tests

https://wpt.fyi/results/css/css-scroll-snap?label=experimental&label=master&aligned

Current Implementations

• Blink
• Gecko
• WebKit

Standards Positions

No response

Browser bug reports

https://bugs.webkit.org/show_bug.cgi?id=251003
https://bugs.webkit.org/show_bug.cgi?id=218709
https://bugs.webkit.org/show_bug.cgi?id=245722
https://bugs.webkit.org/show_bug.cgi?id=253056
https://bugs.webkit.org/show_bug.cgi?id=255592
https://bugs.webkit.org/show_bug.cgi?id=255592
https://bugs.chromium.org/p/chromium/issues/detail?id=953285
https://bugs.chromium.org/p/chromium/issues/detail?id=1404006
https://bugs.chromium.org/p/chromium/issues/detail?id=1245459
https://bugs.chromium.org/p/chromium/issues/detail?id=1154509
https://bugs.chromium.org/p/chromium/issues/detail?id=1423359
https://bugzilla.mozilla.org/show_bug.cgi?id=1848917
+++

Developer discussions

No response

Polls & Surveys

No response

Existing Usage

scroll-snap-type: 7.87% of page loads as of Sep 1 2023
https://chromestatus.com/metrics/css/timeline/popularity/499

Workarounds

No response

Accessibility Impact

Some issues affect accessibility:
https://bugs.webkit.org/show_bug.cgi?id=251003

Privacy Impact

No response

Other

No response

[foolip]

@johannesodland is it fair to say the proposal is to keep the Scrolling focus area in 2024 but to add more tests for scroll snap? #471 is for evaluating whether we should keep Scrolling, and we're doing that separately from completely new focus areas. (You had no way of knowing this of course, and thank you for filing this proposal!)

[johannesodland]

@johannesodland is it fair to say the proposal is to keep the Scrolling focus area in 2024 but to add more tests for scroll snap?

Absolutely. If possible, improve test coverage for when scroll snap is used on root, and when interacting with other apis.

I find that a lot of the issues are related to the “dynamic” mobile viewport, and “external” functionality such as search, screen readers and gestures such as scroll-to-top. These issues might be hard to test in WPT?

[foolip]

We discussed in #578 and decided to close this in favor of #471.

@johannesodland can you comment on that proposal with any additional tests you'd like to be added to the existing Scrolling focus area?

[johannesodland]

@johannesodland can you comment on that proposal with any additional tests you'd like to be added to the existing Scrolling focus area?

I'm not sure there are any existing WPT tests that cover these issues. Most occur on mobile devices and in combination with gestures and the browser interface.

[foolip]

@johannesodland I see, can you instead paste the list of bugs?