WKWebView scrolling issue on iOS 13

Looks like iOS 13 caused an issue in some of our pages we load using WKWebView. The issue is that you can't scroll vertically on the page as the screen jumps around back and forth while you try. Sometimes you can scroll slowly down the page, but eventually the screen gets stuck in a loop and the page jumps back and forth just a small amout vertically.


A few more interesting notes:

- Not all of our WKWebView screens are having this issue. Only certain ones that come from a specific source.

- Changing to UIWebView fixes the problem.

- This is affecting our production app version with was built with Xcode 10.3 as well as if we build with Xcode 11.

- Same web host application works fine in Safari directly.


Most likely not a native SDK issue, but some interaction of the javascript/css has problems when running in the WKWebView engine? Or could it at all be related to the modal swipe down functionality in iOS 13?


I'm looking into the JS/CSS on this page to try and eliminate some possibilities. But any other things I should try/do? Any other suggestions?

Looks like we found the root cause somewhat. Still a bit more to fully understand it, but setting certain CSS values from javascript was causing the page to resize. This caused a continuous loop to happen which resulted in the scroll offset getting changed over and over again. AKA: Page jumps up and down.


This is only a problem in iOS 13 and WKWebView. But I suspect this is a low likelyhood to happen to others. We haven't isolated the single line of code that behaves differently in iOS 13/WKWebView, but something there is different. Anyway, we found a workaround so moving on to other issues. 🙂

how did you solve it?

We had this issue as well.

The fix was removing "overflow:hidden" from the body style.

In my case, after reading I try this:


func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) { insertCSSString(into: webView) }
func insertCSSString(into webView: WKWebView) {
let cssString = "body { overflow: scroll !important }"
let jsString = "var style = document.createElement('style'); style.innerHTML = '\(cssString)'; document.head.appendChild(style);"
webView.evaluateJavaScript(jsString, completionHandler: nil)
}

Or this:

func insertCSSString(into webView: WKWebView) { 
let jsString = "document.querySelectorAll('*[style]').forEach(el => el.style.overflow = 'scroll');" webView.evaluateJavaScript(jsString, completionHandler: nil)
}

maybe it's helpful.

Hi,

I tried applying the sollutions it still did not work for us.Is there any other way we can try making scroll work in wkwebview for ios 13.


Thanks

Sindhu

We use SAP Lumira Designer apps mobile on iPads and also have the problem that we cannot scroll in crosstabs after the IOS 13 upgrade. SAP set up a note (2877466, unable to scroll Lumira Designer dashboards) that says that a solution from apple is currently awaited. Does anyone know what that means? How can I make sure that one of the next IOS 13 upgrades will fix the problem?

I'm having a WKWebview crash issue just scrolling a simple .pdf file from a url. Seems to have just started out of the blue. I wonder if it's related.

WKWebView scrolling issue on iOS 13
 
 
Q