How to control the user interface of a WKWebView using WKUIDelegate

Swift version: 5.10

Paul Hudson @twostraws May 28th 2019

By default WKWebView works sort of like Safari, albeit in a single view rather than having tabs. If you want something more advanced – being able to monitor opening and closing windows, override behavior for JavaScript user interface, and so on – then the WKUIDelegate protocol is for you.

First, make your view controller conform to it by adding WKUIDelegate to its list of protocols. Second, assign your view controller to the uiDelegate property of your web view:

yourWebView.uiDelegate = self

Finally, implement whichever of the optional methods of WKUIDelegate takes your interest. For example, you can make WKWebView show a custom alert controller when any web page uses the alert() JavaScript function:

func webView(_ webView: WKWebView, runJavaScriptAlertPanelWithMessage message: String, initiatedByFrame frame: WKFrameInfo, completionHandler: @escaping () -> Void) {
    let ac = UIAlertController(title: "Hey, listen!", message: message, preferredStyle: .alert)
    ac.addAction(UIAlertAction(title: "OK", style: .default, handler: nil))
    present(ac, animated: true)
    completionHandler()
}

There’s also runJavaScriptConfirmPanelWithMessage for showing confirm and deny UI, runJavaScriptTextInputPanelWithPrompt for requesting user text input, and so on.

Note: You must call the completion handler. JavaScript’s alerts are blocking, which means JavaScript execution will not continue until the alert finishes. As a result, WebKit will complain if you don’t let it know when you’re done.