Bug 235576 – REGRESSION: Element with position: sticky goes past the sticky point before sticking

• Component: Scrolling
• Status: RESOLVED DUPLICATE

[Bruno Stasse]

Created attachment 449918 [details]
Testcase

Since iOS 15, elements with `position: sticky` inside a scroll container other than the page can go past the sticky point "in a flash" (probably just one frame), when scrolling quickly in that direction, then go back to the sticky point.

The expected behaviour would be that the element sticks to the point defined by the `top`/`bottom`/`left`/`right` property value, and not go past that point.

See the attached testcase and video.

The yellow sticky element should not go past the green line (positioned at 100px from the top), but we can see that it crosses it when scrolling (we can see frames with yellow above the green line, and can see that the "Hello" text flashes when the element is supposed to stick).

Steps to reproduce:
- open the testcase
- scroll down to the yellow element
- scroll quickly up and down so that the element touches the green line without lifting your finger
You should see the yellow element cross the green line.

Might be related to:
https://bugs.webkit.org/show_bug.cgi?id=231953
https://bugs.webkit.org/show_bug.cgi?id=234500

[Bruno Stasse]

Created attachment 449919 [details]
Video_testcase

[Radar WebKit Bug Importer]

<rdar://problem/88322415>

[Bruno Stasse]

I can't reproduce this anymore on iOS 15.5 beta, so I suppose this was the same bug as  https://bugs.webkit.org/show_bug.cgi?id=231953 which was fixed and shipped. Thank you!

Not sure if I should myself set the status of this report to "resolved"?

[Simon Fraser (smfr)]

Thanks for testing!

*** This bug has been marked as a duplicate of bug 231953 ***