Bug 253399

Summary: Incorrect cropping of fixed position elements taller than viewport on MobileSafari
Product: WebKit Reporter: Luke Deen Taylor <luke>
Component: Layout and RenderingAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Normal CC: bfulgham, simon.fraser, webkit-bug-importer, zalan
Priority: P2 Keywords: InRadar
Version: Safari Technology Preview   
Hardware: iPhone / iPad   
OS: iOS 16   
Attachments:
Description Flags
Showing the buggy behavior (first) and the desired behavior (second) none

Luke Deen Taylor
Reported 2023-03-04 14:47:45 PST
Created attachment 465298 [details] Showing the buggy behavior (first) and the desired behavior (second) On iOS Safari, a fixed position element that is (1) taller than the viewport and (2) non-empty will be visually cropped to 100dvh height even if it is taller than that. This creates awkward jank when scrolling, because the element is visibly too small while the bottom UI is collapsing on scroll (see the first part of the attached video, with the red background). If the element is empty this bug does not occur (see the second part of the attached animation, with the green background—the element is visible behind the bottom bar and no visible jank occurs when the bottom bar collapses). The incorrect behavior can be reproduced with the following reproduction: <!DOCTYPE html> <html lang="en"> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body style="background: blue; margin: 0; padding-bottom: 300vh;"> <div style="display: contents;"> <div style="position: fixed; height: 100lvh; width: 100%; background: red;"> test </div> </div> </body> </html> The bug does not occur if the div is empty, i.e. if “test” is removed or commented out.
Attachments
Showing the buggy behavior (first) and the desired behavior (second) (662.78 KB, video/mp4)
2023-03-04 14:47 PST, Luke Deen Taylor 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Luke Deen Taylor
Comment 1 2023-03-04 14:50:44 PST
I’m not sure how to verify this bug exists in Nightly, since it’s specific to the dynamic viewport behavior of iOS safari; I did verify this bug exists in the most recent iOS 16.4 developer beta, however.
Simon Fraser (smfr)
Comment 2 2023-03-06 11:42:31 PST
We crop position:fixed to viewport size because we assume the rest will never be visible, but we need to use the larger viewport size to do this.
Radar WebKit Bug Importer
Comment 3 2023-03-06 11:42:48 PST
<rdar://problem/106310384>
Note You need to log in before you can comment on or make changes to this bug.