Hacking Mountain Lion: Bringing the old Web Inspector back

The problem

In Mountain Lion, Apple introduced a new Web Inspector for Safari. However, the new inspector comes with a horrible UI. It features many small icons that are hard to differentiate. Compared to the old inspector, it takes two more clicks to open the console and two more clicks to look at HTTP requests (after having successfully deciphered the icons). By default, the new inspector also unexpectedly breaks on exceptions, which is very confusing. The network requests pane does not let you see what request method was used for a particular request and does not show you the request body that was sent, making it very hard to find a POST request and debug it.

Hacking around

It turns out that the WebKit Nightly builds have an option in the Developer menu, called Use WebKit Web Inspector. Selecting this option solves the problem and brings the old inspector back. However, this only works in the nightly Safari. Not helpful for my case, because I was developing a Cocoa application and wanted to use the WebKit inspector in one of its WebViews.

Naturally, I used dtrace to see what was going on:

% cat inspector.d
pid$target::*nspector*:entry {}
pid$target::*nspector*:return {}

% sudo dtrace -s inspector.d -F -c /Applications/Safari.app/Contents/MacOS/SafariForWebKitDevelopment

The basic syntax of the dtrace script is pid:class-name:method-name:entry/return, and details can be found in man dtrace. Here, the command launches Safari and listens on any Objective-C messages that contain the string nspector.

After clicking around, here's what it found:

  0  <- -[NSWindow(NSInspectorBarSupport) inspectorBar] 
  0  -> -[DevelopMenuController useWebKitWebInspector] 
  0    -> Safari::WK::Preferences::inspectorUsesWebKitUserInterface() const 
  0      -> WKPreferencesGetInspectorUsesWebKitUserInterface 
  0        -> WebKit::WebPreferences::inspectorUsesWebKitUserInterface() const 
  0          -> WebKit::WebPreferencesKey::inspectorUsesWebKitUserInterfaceKey() 
  0          <- WebKit::WebPreferencesKey::inspectorUsesWebKitUserInterfaceKey() 
  0        <- WebKit::WebPreferences::inspectorUsesWebKitUserInterface() const 
  0      <- WKPreferencesGetInspectorUsesWebKitUserInterface 
  0    <- Safari::WK::Preferences::inspectorUsesWebKitUserInterface() const 
  0  <- -[DevelopMenuController useWebKitWebInspector] 
  0  -> Safari::BrowserContentViewController::canShowInspector() const 
  0  <- Safari::BrowserContentViewController::canShowInspector() const 
  0  -> -[NSWindow(NSInspectorBarSupport) inspectorBar] 

Now we need to find a way for other Cocoa applications to use the the old inspector. Thankfully, WebKit is open source. After searching for the keywords, an interesting code file came up which contains the following eye-catching function:

static bool useWebKitWebInspector()
{
    // Call the soft link framework function to dlopen it, then [NSBundle bundleWithIdentifier:] will work.
    WebInspectorLibrary();

    if (![[NSBundle bundleWithIdentifier:@"com.apple.WebInspector"] pathForResource:@"Main" ofType:@"html"])
        return true;

    if (![[NSBundle bundleWithIdentifier:@"com.apple.WebCore"] pathForResource:@"inspector" ofType:@"html" inDirectory:@"inspector"])
        return false;

    return [[NSUserDefaults standardUserDefaults] boolForKey:@"UseWebKitWebInspector"];
}

After trying the obvious things, which is was defaults write -g UseWebKitWebInspector -bool YES, which didn't do anything, as well as moving /System/Library/PrivateFrameworks/WebInspector.framework/Resources/Main.html to a different place, which broke Safari, I figured that I needed to install a newer version of WebKit on my computer.

The solution

Installing the new WebKit from the nightly build system-wide wasn't too difficult. After a bit of trial and error (mainly using grep to identify missing symbols in the frameworks based on Safari's crash tracebacks), the following sequence did the trick:

% cd /System/Library/Frameworks
% sudo mv WebKit.framework WebKit.framework.old
% sudo cp  -a /Applications/WebKit.app/Contents/Frameworks/10.8/WebKit.framework .
% sudo mkdir -p WebKit.framework/Versions/A/Frameworks
% sudo cp -a /Applications/WebKit.app/Contents/Frameworks/10.8/WebCore.framework WebKit.framework/Versions/A/Frameworks
% sudo mv JavaScriptCore.framework JavaScriptCore.framework.old
% sudo cp -a /Applications/WebKit.app/Contents/Frameworks/10.8/JavaScriptCore.framework .
% cd /System/Library/PrivateFrameworks
% sudo mv WebKit2.framework WebKit2.framework.old
% sudo cp  -a /Applications/WebKit.app/Contents/Frameworks/10.8/WebKit2.framework .

After that, all that needed to be done was setting the global preference:

% defaults write -g UseWebKitWebInspector -bool YES

Now every Cocoa app uses the old WebKit inspector, including the original Safari. Problem solved.

What are other things in Mountain Lion that annoy you and that you would like to hack?

Comments (19)