Bug 249575 – Safari 16.2 broken by some Flex/Snap CSS

• Component: New Bugs
• Status: RESOLVED FIXED

[Rado]

Created attachment 464101 [details]
Safari 16.2 vs previous versions

On Safari 16.2+ (including TP), when using the following combination of CSS

.n-carousel__content {
  display: flex;
  scroll-snap-type: both;
  width: 0;
  height: 0;
  overflow: auto;
}

.n-carousel__content > * {
  scroll-snap-align: center;
  width: 100%;
}

the browser breaks, saying “This webpage was reloaded because a problem occured. A problem repeatedly occured with index.html”

The CSS snippet is reduced from https://nativecarousel.com

Now multiple sites don't work on latest Safari on all devices. Please fix it. Thanks

[Rado]

Fixed by changing 'scroll-snap-type: both' to a pair of 'x' and 'y' lines

[Sam Sneddon [:gsnedders]]

rdar://103517033

[Rado]

Broken version saved as https://radogado.github.io/n-carousel/safari-16.2/

[Rado]

Happens in TP 161

[Nikos Mouchtaris]

Pull request: https://github.com/WebKit/WebKit/pull/8800

[EWS]

Committed 259095@main (ca36a0985064): <https://commits.webkit.org/259095@main>

Reviewed commits have been landed. Closing PR #8800 and removing active labels.