JavaScript exception when calling a function via `evaluateJavaScript` on WKWebView, which has a local .js file

We have a sample HTML page, which just links the .js file:

sample.html:

<html>
    <head>
        <script src="test.js"></script>
    </head>
    <body></body>
</html>

The .js file is literally just:

test.js

function myFunction() {
    return "hello";
}

So All I want is to evaluate that Javascript function (for now). In the Swift file:

let webView = WKWebView(frame: .zero, configuration: WKWebViewConfiguration())
let path = Bundle.main.url(forResource: "sample", withExtension: "html")!
let text = try! String(contentsOf: path, encoding: String.Encoding.utf8)

webView.loadHTMLString(text, baseURL: nil)
webView.evaluateJavaScript("myFunction()") { (any, error) in
    dump(error)
}

Two which we get the error:

Error Domain=WKErrorDomain Code=4 "A JavaScript exception occurred" UserInfo={WKJavaScriptExceptionLineNumber=1, WKJavaScriptExceptionMessage=ReferenceError: Can't find variable: myFunction, WKJavaScriptExceptionSourceURL=about:blank, NSLocalizedDescription=A JavaScript exception occurred, WKJavaScriptExceptionColumnNumber=11}

Am I approaching this totally wrong?

Solution

You're not that far.

First, you can either modify your code by setting the baseURL:

webView.loadHTMLString(text, baseURL: path)

or use an URLRequest instead (better in my opinion).

if let path = Bundle.main.url(forResource: "sample", withExtension: "html"){  
    let myURLRequest:URLRequest = URLRequest(url: path)
    webView.load(myURLRequest)
}

The second thing is you have to wait for the content to be loaded. So you first need to set a delegate for your webview (Make sure you add this line before before loading the html).

webView.navigationDelegate = self

Then, add an extension to your class for the delegate ( My class is named "ViewController" here, but change it to the name of your class ) to call evaluateJavascript when the page is loaded.

extension ViewController: WKNavigationDelegate {

    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        print("Finished navigating to url \(webView.url)")

        webView.evaluateJavaScript("myFunction()") { (any, error) in
            dump(error)
            print(any)
        }

    }
}