222654 2021-03-03 07:39:29 -0800 Scrolling in home screen apps incorrectly latches to document 2024-06-04 10:20:05 -0700 1 1 1 Unclassified WebKit Scrolling Safari 14 Unspecified Unspecified NEW https://bugs.webkit.org/show_bug.cgi?id=214781 https://bugs.webkit.org/show_bug.cgi?id=240860 InRadar P2 Normal --- 1 ldebeasi webkit-unassigned alex lincolnbaxter pi.coderman simon.fraser tgels webkit-bug-importer oldest_to_newest 1735268 0 422079 ldebeasi 2021-03-03 07:39:29 -0800 Created attachment 422079 Code reproduction When using an app added to the home screen, scrolling incorrectly latches to #document, making it impossible for users to interact with the app. Steps to reproduce: 1. Open the attached code reproduction on an iOS device. 2. Add the code reproduction to the home screen and then launch it. 3. Verify that you can scroll the main content. 4. Tap the input and then close the keyboard. 5. Swipe up on the header element. 6. Immediately after this, attempt to scroll on the main content. You should not be able to. If you were to inspect this using Safari Dev Tools and add a scroll listener, you should notice that the scroll event's target during step 6 is "#document". Sometimes I can get WebKit to re-latch to the main content, but I am not sure what causes that to happen. Expected Behavior: I would expect WebKit to never latch to #document for scrolling and continue to latch to the main content. Actual Behavior: WebKit latches to the #document for scrolling. Additional Information: - This was tested on iOS 14.5, but I can reproduce this on earlier versions of iOS 14. - This only happens when the app is installed to the homescreen. Running this in Safari does not reproduce the issue. - This does not happen when running the app inside of WKWebView in a Capacitor or Cordova application. 1735339 1 simon.fraser 2021-03-03 10:12:50 -0800 I believe there are two issues here: 1. the document is scrollable on home screen web apps when it should not be (bug 214781) 2. UIKit has a bug where, if an ancestor scroll view is rubber banding, you have to wait for it to stop before you can scroll the inner scroll view (tracked internally). 1738056 2 webkit-bug-importer 2021-03-10 07:40:16 -0800 <rdar://problem/75264303> 1873874 3 lincolnbaxter 2022-06-03 06:24:50 -0700 Any updates on this? We are struggling to control the very strange user interactions this causes on our full-page website. 1879702 4 tgels 2022-07-01 03:04:36 -0700 This bug is impacting the user experience for many webkit users worldwide that are using PWA's. Can we expect any progress on fixing this issue in the (near) future? 1963612 5 alex 2023-06-26 07:35:18 -0700 Hi there! This impact me, too. Video here: https://github.com/ionic-team/ionic-framework/issues/27697 1965441 6 alex 2023-07-06 15:00:30 -0700 Hi there. Sorry for the dupe comment. I just wanted to relay that this issue has been reported to me more times than I can count *just in the past 48 hours* by users of wefwef (https://wefwef.app). It's even worse that I previously thought. Any time the user tries to swipe during a page transition where pointer events are disabled, Safari will latch scroll to the document. Users then try to scroll the feed once the animation is complete, but they're stuck! The latching time is also juuuust long enough that users don't wait enough for it to unlatch, and they think the page is frozen. Here's a few users in the wild complaining about this very specific bug from the last *60 minutes*: > Scrolling also sometimes gets “frozen” briefly when returning to my feed. This happen to anyone else? > Yes to the freezing. It needs a second or two before you can scroll. Resolving this is really important for webapps installed to the homescreen. 1967196 7 lincolnbaxter 2023-07-18 09:38:34 -0700 Yep, this is still a major issue in 2023. We've implemented a number of hacks to make this occur less frequently, but they are indeed hacks. 2039683 8 pi.coderman 2024-06-04 10:20:05 -0700 body { overflow: hidden; width: 100%; height: 100%; overscroll-behavior: none; } 422079 2021-03-03 07:39:29 -0800 2021-03-03 07:39:29 -0800 Code reproduction index.html text/html 5310 ldebeasi PCFET0NUWVBFIGh0bWw+CjxodG1sPgogIDxoZWFkPgogICAgPHRpdGxlPlNjcm9sbCBMYXRjaGlu ZzwvdGl0bGU+CiAgICA8bWV0YSBuYW1lPSJ2aWV3cG9ydCIgY29udGVudD0idmlld3BvcnQtZml0 PWNvdmVyLCB3aWR0aD1kZXZpY2Utd2lkdGgsIGluaXRpYWwtc2NhbGU9MS4wLCBtaW5pbXVtLXNj YWxlPTEuMCwgbWF4aW11bS1zY2FsZT0xLjAsIHVzZXItc2NhbGFibGU9bm8iPgogICAgPG1ldGEg bmFtZT0iYXBwbGUtbW9iaWxlLXdlYi1hcHAtY2FwYWJsZSIgY29udGVudD0ieWVzIiAvPgogICAg PG1ldGEgbmFtZT0iYXBwbGUtbW9iaWxlLXdlYi1hcHAtc3RhdHVzLWJhci1zdHlsZSIgY29udGVu dD0iYmxhY2siIC8+CiAgICA8c3R5bGU+CiAgICAgIGJvZHkgewogICAgICAgIG1hcmdpbjogMDsK ICAgICAgICAKICAgICAgICBvdmVyZmxvdzogaGlkZGVuOwogICAgICAgIAogICAgICAgIHBvc2l0 aW9uOiBmaXhlZDsKICAgICAgICB3aWR0aDogMTAwJTsKICAgICAgICBoZWlnaHQ6IDEwMCU7CiAg ICAgICAgdG91Y2gtYWN0aW9uOiBtYW5pcHVsYXRpb247CiAgICAgIH0KICAgICAgCiAgICAgIGhl YWRlciB7CiAgICAgICAgd2lkdGg6IDEwMCU7CiAgICAgICAgaGVpZ2h0OiA2MHB4OwogICAgICAg ICAgCiAgICAgICAgZGlzcGxheTogZmxleDsKICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyOwog ICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyOwogICAgICAgIAogICAgICAgIGJvcmRlci1i b3R0b206IDAuNTVweCBzb2xpZCBncmF5OwogICAgICB9CiAgICAgIAogICAgICBtYWluIHsgIAog ICAgICAgIGhlaWdodDogMTAwJTsKICAgICAgICB3aWR0aDogMTAwJTsKICAgICAgICAKICAgICAg ICBwb3NpdGlvbjogYWJzb2x1dGU7CiAgICAgICAgdG9wOiA2MHB4OwogICAgICAgIGxlZnQ6IDA7 CiAgICAgICAgcmlnaHQ6IDA7CiAgICAgICAgYm90dG9tOiAwOwogICAgICAgIAogICAgICAgIHRv dWNoLWFjdGlvbjogcGFuLXk7CiAgICAgICAgb3ZlcmZsb3cteTogc2Nyb2xsOwogICAgICAgIAog ICAgICAgIHBhZGRpbmctdG9wOiAxMHB4OwogICAgICB9CiAgICAgIAogICAgICBpbnB1dCB7CiAg ICAgICAgZm9udC1zaXplOiAxNnB4OwogICAgICB9CiAgICA8L3N0eWxlPgogIDwvaGVhZD4KICA8 Ym9keT4KICAgIDxoZWFkZXI+SGVhZGVyPC9oZWFkZXI+CiAgICA8bWFpbj4KICAgICA8aW5wdXQg cGxhY2Vob2xkZXI9IlRleHQgSW5wdXQiIC8+IDxiciAvPgogICAgIAogICAgIExvcmVtIGlwc3Vt IGRvbG9yIHNpdCBhbWV0LCBjb25zZWN0ZXR1ciBhZGlwaXNjaW5nIGVsaXQsIHNlZCBkbyBlaXVz bW9kIHRlbXBvciBpbmNpZGlkdW50IHV0IGxhYm9yZSBldCBkb2xvcmUgbWFnbmEgYWxpcXVhLiBB bWV0IGp1c3RvIGRvbmVjIGVuaW0gZGlhbSB2dWxwdXRhdGUuIFNlZCB0ZW1wdXMgdXJuYSBldCBw aGFyZXRyYSBwaGFyZXRyYSBtYXNzYS4gU2NlbGVyaXNxdWUgZmVybWVudHVtIGR1aSBmYXVjaWJ1 cyBpbiBvcm5hcmUgcXVhbSB2aXZlcnJhIG9yY2kgc2FnaXR0aXMuIE9ybmFyZSBsZWN0dXMgc2l0 IGFtZXQgZXN0IHBsYWNlcmF0IGluIGVnZXN0YXMgZXJhdC4gTWFzc2EgbWFzc2EgdWx0cmljaWVz IG1pIHF1aXMgaGVuZHJlcml0IGRvbG9yIG1hZ25hIGVnZXQuIFR1cnBpcyBlZ2VzdGFzIGludGVn ZXIgZWdldCBhbGlxdWV0IG5pYmggcHJhZXNlbnQuIFZlc3RpYnVsdW0gbGVjdHVzIG1hdXJpcyB1 bHRyaWNlcyBlcm9zIGluIGN1cnN1cy4gUGhhc2VsbHVzIGZhdWNpYnVzIHNjZWxlcmlzcXVlIGVs ZWlmZW5kIGRvbmVjIHByZXRpdW0uIElkIGN1cnN1cyBtZXR1cyBhbGlxdWFtIGVsZWlmZW5kLiBO dW5jIHB1bHZpbmFyIHNhcGllbiBldCBsaWd1bGEgdWxsYW1jb3JwZXIuIE1vcmJpIGxlbyB1cm5h IG1vbGVzdGllIGF0LiBTZWQgZXVpc21vZCBuaXNpIHBvcnRhIGxvcmVtIG1vbGxpcyBhbGlxdWFt LiBOb24gb2RpbyBldWlzbW9kIGxhY2luaWEgYXQgcXVpcy4gVXQgZXUgc2VtIGludGVnZXIgdml0 YWUganVzdG8gZWdldCBtYWduYSBmZXJtZW50dW0uIEEgY29uZGltZW50dW0gdml0YWUgc2FwaWVu IHBlbGxlbnRlc3F1ZSBoYWJpdGFudCBtb3JiaS4KICAgICAKICAgPGJyIC8+PGJyIC8+CiAgIAog ICBBdWd1ZSB1dCBsZWN0dXMgYXJjdSBiaWJlbmR1bSBhdCB2YXJpdXMgdmVsIHBoYXJldHJhLiBW ZW5lbmF0aXMgYSBjb25kaW1lbnR1bSB2aXRhZSBzYXBpZW4uIEFsaXF1YW0gbWFsZXN1YWRhIGJp YmVuZHVtIGFyY3Ugdml0YWUgZWxlbWVudHVtIGN1cmFiaXR1ciB2aXRhZS4gTGliZXJvIGp1c3Rv IGxhb3JlZXQgc2l0IGFtZXQgY3Vyc3VzIHNpdCBhbWV0IGRpY3R1bS4gSWQgbGVvIGluIHZpdGFl IHR1cnBpcyBtYXNzYSBzZWQuIENvbnNlY3RldHVyIGEgZXJhdCBuYW0gYXQgbGVjdHVzIHVybmEg ZHVpcyBjb252YWxsaXMuIFNlZCBhcmN1IG5vbiBvZGlvIGV1aXNtb2QgbGFjaW5pYS4gVGVtcHVz IGlhY3VsaXMgdXJuYSBpZCB2b2x1dHBhdCBsYWN1cyBsYW9yZWV0IG5vbi4gRWdldCBlZ2VzdGFz IHB1cnVzIHZpdmVycmEgYWNjdW1zYW4gaW4gbmlzbCBuaXNpLiBOZXF1ZSBsYW9yZWV0IHN1c3Bl bmRpc3NlIGludGVyZHVtIGNvbnNlY3RldHVyLiBWZWxpdCBhbGlxdWV0IHNhZ2l0dGlzIGlkIGNv bnNlY3RldHVyIHB1cnVzIHV0IGZhdWNpYnVzIHB1bHZpbmFyLiBGZWxpcyBpbXBlcmRpZXQgcHJv aW4gZmVybWVudHVtIGxlbyB2ZWwgb3JjaSBwb3J0YS4gQmliZW5kdW0gYXJjdSB2aXRhZSBlbGVt ZW50dW0gY3VyYWJpdHVyIHZpdGFlIG51bmMuIFB1bHZpbmFyIHNhcGllbiBldCBsaWd1bGEgdWxs YW1jb3JwZXIgbWFsZXN1YWRhLiBEaWduaXNzaW0gZW5pbSBzaXQgYW1ldCB2ZW5lbmF0aXMgdXJu YSBjdXJzdXMgZWdldC4gRWxlaWZlbmQgbWkgaW4gbnVsbGEgcG9zdWVyZSBzb2xsaWNpdHVkaW4g YWxpcXVhbSB1bHRyaWNlcyBzYWdpdHRpcy4gRWdlc3RhcyBpbnRlZ2VyIGVnZXQgYWxpcXVldCBu aWJoIHByYWVzZW50LiBPZGlvIGV1aXNtb2QgbGFjaW5pYSBhdCBxdWlzIHJpc3VzIHNlZCB2dWxw dXRhdGUgb2RpbyB1dC4KICAgCiAgIDxiciAvPjxiciAvPgogICAgIAogICBGYWNpbGlzaXMgbWFn bmEgZXRpYW0gdGVtcG9yIG9yY2kgZXUgbG9ib3J0aXMgZWxlbWVudHVtIG5pYmguIEV1aXNtb2Qg bmlzaSBwb3J0YSBsb3JlbSBtb2xsaXMgYWxpcXVhbS4gUGhhcmV0cmEgcGhhcmV0cmEgbWFzc2Eg bWFzc2EgdWx0cmljaWVzLiBBYyB0dXJwaXMgZWdlc3RhcyBpbnRlZ2VyIGVnZXQgYWxpcXVldCBu aWJoIHByYWVzZW50LiBTdXNwZW5kaXNzZSBpbiBlc3QgYW50ZSBpbiBuaWJoIG1hdXJpcyBjdXJz dXMgbWF0dGlzIG1vbGVzdGllLiBFZ2VzdGFzIHRlbGx1cyBydXRydW0gdGVsbHVzIHBlbGxlbnRl c3F1ZSBldSB0aW5jaWR1bnQuIFBhcnR1cmllbnQgbW9udGVzIG5hc2NldHVyIHJpZGljdWx1cyBt dXMgbWF1cmlzIHZpdGFlIHVsdHJpY2llcyBsZW8uIEFjIHRvcnRvciBkaWduaXNzaW0gY29udmFs bGlzIGFlbmVhbiBldC4gR3JhdmlkYSBpbiBmZXJtZW50dW0gZXQgc29sbGljaXR1ZGluLiBFbGVt ZW50dW0gcHVsdmluYXIgZXRpYW0gbm9uIHF1YW0gbGFjdXMgc3VzcGVuZGlzc2UuIFNlZCB1bGxh bWNvcnBlciBtb3JiaSB0aW5jaWR1bnQgb3JuYXJlLiBDb25ndWUgbWF1cmlzIHJob25jdXMgYWVu ZWFuIHZlbCBlbGl0LiBQb3J0YSBsb3JlbSBtb2xsaXMgYWxpcXVhbSB1dCBwb3J0dGl0b3IgbGVv IGEgZGlhbS4KICAgCiAgIDxiciAvPjxiciAvPgogICAgIAogICBGdXNjZSBpZCB2ZWxpdCB1dCB0 b3J0b3IgcHJldGl1bSB2aXZlcnJhLiBQZWxsZW50ZXNxdWUgaWQgbmliaCB0b3J0b3IgaWQgYWxp cXVldCBsZWN0dXMgcHJvaW4uIFVsbGFtY29ycGVyIHNpdCBhbWV0IHJpc3VzIG51bGxhbSBlZ2V0 IGZlbGlzIGVnZXQgbnVuYy4gUGVsbGVudGVzcXVlIGhhYml0YW50IG1vcmJpIHRyaXN0aXF1ZSBz ZW5lY3R1cy4gVXJuYSBpZCB2b2x1dHBhdCBsYWN1cyBsYW9yZWV0IG5vbiBjdXJhYml0dXIgZ3Jh dmlkYS4gTnVsbGFtIGFjIHRvcnRvciB2aXRhZSBwdXJ1cy4gRWxlbWVudHVtIHNhZ2l0dGlzIHZp dGFlIGV0IGxlbyBkdWlzIHV0LiBVcm5hIG51bmMgaWQgY3Vyc3VzIG1ldHVzIGFsaXF1YW0gZWxl aWZlbmQgbWkgaW4uIEF1Z3VlIG5lcXVlIGdyYXZpZGEgaW4gZmVybWVudHVtLiBFdCBzb2xsaWNp dHVkaW4gYWMgb3JjaSBwaGFzZWxsdXMgZWdlc3RhcyB0ZWxsdXMgcnV0cnVtIHRlbGx1cy4gU2Vk IHB1bHZpbmFyIHByb2luIGdyYXZpZGEgaGVuZHJlcml0IGxlY3R1cyBhLiBGZWxpcyBiaWJlbmR1 bSB1dCB0cmlzdGlxdWUgZXQuIFRlbGx1cyBpbiBtZXR1cyB2dWxwdXRhdGUgZXUuIEJsYW5kaXQg Y3Vyc3VzIHJpc3VzIGF0IHVsdHJpY2VzIG1pIHRlbXB1cyBpbXBlcmRpZXQuCiAgIAogICA8YnIg Lz48YnIgLz4gIAogICAKICAgTmF0b3F1ZSBwZW5hdGlidXMgZXQgbWFnbmlzIGRpcyBwYXJ0dXJp ZW50LiBQZWxsZW50ZXNxdWUgZWxpdCB1bGxhbWNvcnBlciBkaWduaXNzaW0gY3JhcyB0aW5jaWR1 bnQgbG9ib3J0aXMuIFRlbGx1cyBvcmNpIGFjIGF1Y3RvciBhdWd1ZS4gUGhhcmV0cmEgZXQgdWx0 cmljZXMgbmVxdWUgb3JuYXJlIGFlbmVhbi4gQWRpcGlzY2luZyBlbGl0IHBlbGxlbnRlc3F1ZSBo YWJpdGFudCBtb3JiaSB0cmlzdGlxdWUgc2VuZWN0dXMgZXQgbmV0dXMgZXQuIERpcyBwYXJ0dXJp ZW50IG1vbnRlcyBuYXNjZXR1ciByaWRpY3VsdXMgbXVzIG1hdXJpcy4gU2VtIGV0IHRvcnRvciBj b25zZXF1YXQgaWQgcG9ydGEgbmliaCB2ZW5lbmF0aXMgY3Jhcy4gU2NlbGVyaXNxdWUgaW4gZGlj dHVtIG5vbiBjb25zZWN0ZXR1ciBhIGVyYXQgbmFtIGF0LiBGYXVjaWJ1cyBwdWx2aW5hciBlbGVt ZW50dW0gaW50ZWdlciBlbmltIG5lcXVlLiBEaWN0dW0gZnVzY2UgdXQgcGxhY2VyYXQgb3JjaSBu dWxsYSBwZWxsZW50ZXNxdWUgZGlnbmlzc2ltIGVuaW0gc2l0LiBBYyB0b3J0b3Igdml0YWUgcHVy dXMgZmF1Y2lidXMgb3JuYXJlIHN1c3BlbmRpc3NlIHNlZCBuaXNpIGxhY3VzLiBOdW5jIHZlbCBy aXN1cyBjb21tb2RvIHZpdmVycmEgbWFlY2VuYXMgYWNjdW1zYW4gbGFjdXMuIFZlbCBmcmluZ2ls bGEgZXN0IHVsbGFtY29ycGVyIGVnZXQgbnVsbGEgZmFjaWxpc2kgZXRpYW0gZGlnbmlzc2ltLiBF bmltIHRvcnRvciBhdCBhdWN0b3IgdXJuYSBudW5jIGlkIGN1cnN1cy4gU2FnaXR0aXMgYWxpcXVh bSBtYWxlc3VhZGEgYmliZW5kdW0gYXJjdS4gSGFjIGhhYml0YXNzZSBwbGF0ZWEgZGljdHVtc3Qg dmVzdGlidWx1bSByaG9uY3VzIGVzdCBwZWxsZW50ZXNxdWUuCiAgIDwvbWFpbj4KICA8L2JvZHk+ CjwvaHRtbD4K