Bug 244139

Summary:

position: sticky element is not always re-painted on DOM update

Product:

WebKit

Reporter:

patrick

Component:

Layout and Rendering

Assignee:

Nobody <webkit-unassigned>

Status:

NEW

Severity:

Normal

CC:

bfulgham, malcolmkiano, simon.fraser, webkit-bug-importer, zalan

Priority:

Keywords:

InRadar

Version:

Safari 15

Hardware:

Unspecified

OS:

Unspecified

Attachments:

Description	Flags
Video showing the bug	none
Non-working reduction	none
Working reduction	none

patrick

Reported 2022-08-19 13:42:54 PDT

Created attachment 461737 [details] Video showing the bug Distilled Reproduction Case: https://codepen.io/patrick-mcdougle/pen/QWmYMNz

Attachments
Video showing the bug (29.69 MB, video/quicktime) 2022-08-19 13:42 PDT, patrick	no flags	Details
Non-working reduction (1.34 KB, text/html) 2022-08-19 15:59 PDT, Simon Fraser (smfr)	no flags	Details
Working reduction (1.23 KB, text/html) 2022-08-19 17:11 PDT, malcolm	no flags	Details
View All Add attachment proposed patch, testcase, etc.

Simon Fraser (smfr)

Comment 1 2022-08-19 14:21:27 PDT

Thank you for the report and the clear reproduction. I can reproduce the bug.

Simon Fraser (smfr)

Comment 2 2022-08-19 15:57:26 PDT

My attempt to build a testcase without using React does not reproduce the bug.

Simon Fraser (smfr)

Comment 3 2022-08-19 15:59:09 PDT

Created attachment 461742 [details] Non-working reduction

patrick

Comment 4 2022-08-19 16:56:17 PDT

A colleague of mine created a non-react repro case...I'm working on getting it from him. Might have to wait until Monday.

malcolm

Comment 5 2022-08-19 17:02:33 PDT

I was able to reproduce this with vanilla JS https://replit.com/@kshncodes/fixed-sticky-repaint-bug#index.html

malcolm

Comment 6 2022-08-19 17:11:12 PDT

Created attachment 461745 [details] Working reduction I've attached a working reduction of the issue with vanilla js

Simon Fraser (smfr)

Comment 7 2022-08-19 21:40:30 PDT

We're computing a bad repaint rect, because the layoutDelta is moving the rect to a negative Y offset: (lldb) p view().frameView().layoutContext().layoutDelta() (WebCore::LayoutSize) $0 = { width = 0px (0), height = -57.6875px (-3692) } (lldb) p dirtyRect (WebCore::LayoutRect) $1 = { x = 0px (0), y = -47.6875px (-3052), width = 192px (12288), height = 28px (1792) }

Radar WebKit Bug Importer

Comment 8 2022-08-26 13:43:58 PDT

<rdar://problem/99201177>

Note You need to log in before you can comment on or make changes to this bug.