WKWebView javascript quirks

WKWebView is the more performant webview control introduced by Apple for iOS and OSX apps. You can read more about this in my previous post.  But as the post mentions there are many features missing that are present in the UIWebView control. One such quirk is related to how WKWebView handles javascript actions that result in an alert, prompt (or) request to open a new url in a new window(tab). If we dont correctly handle, all of these clicks will result in no-op in WKWebView.

  • WKWebView does not open any <a> links that have target=”_blank”. ( For eg: From inside a WKWebview, if you click on the trailers in http://www.tomcruise.com website , nothing happens).  In desktop browser, if target is “_blank”, a new tab is opened. In the in-app browser, we usually want the page to load on top of the current one. In order to achieve that in WKWebView, the following steps need to be followed.
    • Make your view controller that handles the webView callbacks to implement WKUIDelegate
    • In the view controller add the following code. This code verifies if the navigationAction’s target frame is nil(happens when target=”_blank”) and calls loadRequest on the navigationAction.request using current webview. The method ends with returning nil as we did not create a webView and used the existing one instead

  • WKWebView does not display the following Javascript prompts that are requested by web page.
    • Javascript prompt that shows a message that user can dismiss by a button pressWKWebView does not render any of the following prompts that are initiated by javascript code inside the WKWebView
    • Javascript prompt with OK and Cancel buttons, asking for user to make a choice of further action
    • Javascript prompt that asks for text input from user with an OK and Cancel buttons

To ensure all these three different javascript prompts show up, ensure that you have implemented the following three WKUIDelegate methods. The delegate methods give us access to the completion handler and which type of Javascript prompt to create. We need to create an iOS alert in the delegate method and render it modally for users to interact with.

I dont know why Apple’s Webkit could not have included a default implementation for these delegate methods with the creation and displaying alert controller

WKWebView javascript quirks