How to debug javascript code inside WKWebView

Question

I had problems launching webapp in WKWebView (in particular: some buttons do not respond). I used this tutorial as a guide and succeeded in having a web view display my webapp. So now I want to debug javascript code.

I know that webapp works, since I tried it both in the Android browser and in countless browsers (including safari on the iPad simulator that I use). After some quick searching, I learned how to debug javascript inside a UIWebView using Safari . Unfortunately, this is not like the new WKWebView.

When I go to Develop->iPad Simulator , they tell me that there is "There are no verified applications." I tried the same thing with a simple application with UIWebView, and safari debugging works great there.

Is there a way to debug javascript code in WKWebView?

To reproduce my problems (using fast), start a new single-screen project in xCode 6, copy the code (kindly provided by kinderas ) below in your ViewController.swift file, and drag the outlet into the View under the View Controller in the document outline in the Main.storyboard file Main.storyboard . Refer to the manual that I linked above in case of confusion.

 import UIKit import WebKit class ViewController: UIViewController { @IBOutlet var containerView : UIView! = nil var webView: WKWebView? override func loadView() { super.loadView() self.webView = WKWebView() self.view = self.webView! } override func viewDidLoad() { super.viewDidLoad() var url = NSURL(string:"http://www.kinderas.com/") var req = NSURLRequest(URL:url) self.webView!.loadRequest(req) } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() } } 

Answer 1

UPDATE: 2017/09/11

Recent versions of Safari can do this. Just enable the development menu in Safari - developer.apple.com

OLD:

You need to install Safari nightly build and use this. I had the same problem with the application that I am developing. Once I installed the nightly build, I now use this and all of my WKWebViews are displayed in the development menu.

Hope you miss this part!

Answer 2

You can try http://jsconsole.com/

Run: Listen and give you script tags to insert into your web page.

Each console.log file that you have on this page will output to this page.

If you close the jsconsole page, next time you should change the src script in the html code, but you can also listen to this src script:

 :listen XXXXX-XXXXX-XXXX-XXXXX 

Hope this helps.

Answer 3

open the website or html page in your web browser, then open safari. click "Develop", then go to the simulator, and there you will find your title. after opening it, you will see the javascript debugger, the console and everything else you can dream of.