How to show the inspector within your WKWebView based desktop app?

Question

I\'m looking for a way to show the inspector for a WKWebView inside my Mac app.

With WebKit1 and WebView it was easy to show the inspector inside your Mac app, by ju

Answer 1

Based on what Koen found, an easier way to set this property is to use Key Value Coding, no bridging headers required.

Swift:

preferences.setValue(true, forKey: "developerExtrasEnabled")

Or in Objective-C:

[preferences setValue:@YES forKey:@"developerExtrasEnabled"];

Key Value Coding will look for methods and instance variables that match the key, including private ones prefixed by an underscore.

Answer 2

Building on Koen Bok's answer, for Swift, confer this gist. Using those files, you'll need to add the following line to your bridging header:

#import "WKPreferences+DevExtras.h"

Usage looks like

let webView = WKWebView(frame: window.frame)
webView.configuration.preferences.enableDevExtras();

Answer 3

This was patched here: https://lists.webkit.org/pipermail/webkit-dev/2014-August/026790.html

Just expose the private property like this and you can use it.

@interface WKPreferences (WKPrivate)
@property (nonatomic, setter=_setDeveloperExtrasEnabled:) BOOL _developerExtrasEnabled;
@end

Now you get the "Inspect Element" menu on right click.

The only thing I still need to find out is how to show the inspector directly from code.

Answer 4

For Swift, instead of building a bridging header you can set it directly

self.webView.configuration.preferences.setValue(true, forKey: "developerExtrasEnabled")