Flicker and Archiving during scroll/swipe on iOS 10 Cordova 4+
Textras opened this issue · comments
WKWebView Plugin
experienced on iOS 10
Cordova iOS platform version iOS 4.3.1
Hi all.
We see a flicker that we are not sure if it is bounce or inertia caused. Almost like an archiving when the user swipes or keeps finger on the screen for a 'long' swipe.
You can see the issue here and the flash of the messages. I would not personally say it is inertia caused as I see it while keeping my finger on screen, but that certainly exasperates the bug.
https://www.youtube.com/watch?v=pqcUXpEpgec
No idea what is causing this and have done a lot of extensive research. Grateful for any help or ideas?
If it helps we have the following properties on the scrolled element:
-webkit-overflow-scrolling: touch
cordova.plugins.Keyboard.disableScroll(true)
-webkit-backface-visibility: hidden;
transform: translate3d(0,0,0)
No programmatic scrolling or querying scrollTop of the scrolled element or its parent.
So unsure about this that we filed a WebKit possible but, but any ideas would be so appreciated. https://bugs.webkit.org/show_bug.cgi?id=166978
Hi, can you list the plugins you're using?
Hi Eddy. I can version them out too. For the most part, they are all current.
Don't think it's relevant but we also are using https://github.com/tuupola/jquery_lazyload 1.9.4 which I will plan to update today as well. However the bug can occur when there is only a few messages where LL is not
required.
I'm confused.. where's wkwebview?
Crikey, sorry I sent from my Android station without even thinking. Same plugins, but of course without WKWebView. I will post a shot on iOS from home. This bug is only on iOS obviously, I posted that screen grab without thinking.
On iOS:
com.googlemaps.ios 2.1.1 "Google Maps SDK for iOS"
com.telerik.plugins.wkwebview 0.6.10 "WKWebView Polyfill"
com.transistorsoft.cordova.background-geolocation 2.0.0 "BackgroundGeolocation"
cordova-plugin-actionsheet 2.2.2 "ActionSheet"
cordova-plugin-android-permissions 0.8.0 "Permissions"
cordova-plugin-background-fetch 3.0.4 "CDVBackgroundFetch"
cordova-plugin-camera 2.3.0 "Camera"
cordova-plugin-compat 1.0.0 "Compat"
cordova-plugin-console 1.0.3 "Console"
cordova-plugin-contacts 2.2.0 "Contacts"
cordova-plugin-crosswalk-webview 2.1.0 "Crosswalk WebView Engine"
cordova-plugin-datepicker 0.9.3 "DatePicker"
cordova-plugin-device 1.1.2 "Device"
cordova-plugin-dialogs 1.2.0 "Notification"
cordova-plugin-facebook4 1.7.4 "Facebook Connect"
cordova-plugin-file 4.2.0 "File"
cordova-plugin-file-transfer 1.5.1 "File Transfer"
cordova-plugin-googlemaps 1.4.0 "phonegap-googlemaps-plugin"
cordova-plugin-inappbrowser 1.5.0 "InAppBrowser"
cordova-plugin-media-capture 1.4.0 "Capture"
cordova-plugin-network-information 1.2.1 "Network Information"
cordova-plugin-splashscreen 4.0.1 "Splashscreen"
cordova-plugin-webserver 1.0.3 "CordovaWebServer"
cordova-plugin-whitelist 1.2.0 "Whitelist"
cordova-sqlite-storage 1.4.8 "Cordova sqlite storage plugin"
ionic-plugin-keyboard 2.2.1 "Keyboard"
pushwoosh-cordova-plugin 6.2.5 "Pushwoosh"
Thanks. I figured so much: that wkwebview plugin... is not this one. Check the package name and look it up in npm (I'm not at a computer atm).
We had changed to this one actually. I had wrong plugin listed.
However, thank you so much @EddyVerbruggen your work is super appreciated all over the place.
Also, we FINALLY solved this issue.
Turns out it was that the view did not appreciate a long scroll that is one solid element (which is what we did because we were dealing with some old android feed issues at the time) and was the only way to prevent jank and some other long scroll wrapping issues.
so instead of
- scroll parent
- scrolled list
- list item
- list item
- list item
- list item
....
- scrolled list
We did
- scroll parent (which also happens to be the list)
- list item
- list item
- list item
- list item
Thank you again for the timely response!