236561 2022-02-13 05:48:29 -0800 REGRESSION?: overflow:hidden on documentElement behaves inconsistently in iOS Safari 15.3.1 2022-05-24 13:24:45 -0700 1 1 1 Unclassified WebKit Scrolling Safari 15 iPhone / iPad iOS 15 NEW https://bugs.webkit.org/show_bug.cgi?id=199693 https://bugs.webkit.org/show_bug.cgi?id=240859 InRadar P2 Normal --- 1 ik webkit-unassigned ik simon.fraser webkit-bug-importer oldest_to_newest 1840979 0 ik 2022-02-13 05:48:29 -0800 When I set `overflow: hidden;` on documentElement and/or scrollingElement, it only prevents scrolling when the scrollTop = 0 and the Safari UI is visible. If I scroll first, then set `overflow: hidden;`, I can scroll until scrollTop = 0 and Safari UI becomes visible - *then* it locks. Note: Only tested this on iPad Mini, iOS 15.3.1 I think this is a regression, #153852 covers overflow on body and was marked as fixed: https://bugs.webkit.org/show_bug.cgi?id=153852 Related tickets (regarding overflow in standalone / home screen apps): * https://bugs.webkit.org/show_bug.cgi?id=220908 * https://bugs.webkit.org/show_bug.cgi?id=214781 1840980 1 ik 2022-02-13 06:05:36 -0800 For people stumbling across this: My current workaround after a bit of testing and weighing the pros and cons is to detect iOS and force the scrollTop = 0. This is not a solution, however, as it's going to become annoying for users very quickly when the page jumps to the top. The alternative, however, may feel even buggier. Added bonus: Setting scrollbarGutter will prevent layout shifts when the scrollbar dis-/reappears. // Lock if (__isIOS) documentElement.scrollTop = 0; http://documentElement.style.overflow = 'hidden'; http://documentElement.style.scrollbarGutter = 'stable'; // Unlock http://documentElement.style.overflow = ''; http://documentElement.style.scrollbarGutter = ''; 1841147 2 webkit-bug-importer 2022-02-13 23:56:04 -0800 <rdar://problem/88890931> 1841345 3 simon.fraser 2022-02-14 12:00:25 -0800 We allow scrolling when the visual viewport is smaller than the layout viewport (this is necessary to avoid getting locked in when zoomed), but we allow scrolling to the entire document. Ideally we'd only allow panning around in the layout viewport. 1848051 4 simon.fraser 2022-03-03 13:27:47 -0800 scrollbarGutter is not implemented in WebKit so I'm not sure what that has any impact.