About Drosera

Drosera is a JavaScript debugger for WebKit that can be used with any application that uses WebKit. Like the Web Inspector, over 90% of it is written in HTML, CSS and JavaScript.

Getting Drosera

Drosera is included with all of the WebKit nightly builds, or you can build it yourself by running the build-drosera tool found in WebKitTools/Scripts.

If you use a locally built version of WebKit, you'll need to run the following command in Terminal and restart Safari to enable Drosera debugging:

defaults write com.apple.Safari WebKitScriptDebuggerEnabled -bool true

Using Drosera

Now that you have Drosera, you'll need something to debug. Although Drosera can be used with any application that links against WebKit, it needs to be launched with the current development frameworks. If you're debugging a website in Safari, you do not need to worry about this as long as you're using one of the nightly builds. If you're debugging your own application however, you'll need to make sure the WebKitScriptDebuggerEnabled key is in your bundle identifier and then use the run-webkit-app script located in WebKitTools/Scripts to start your application.

Once Drosera is launched, you're presented with the Attach window, showing all running applications capable of being debugged with Drosera. Select the application you want to debug to load the debugging window.

Breakpoints

Double clicking a line number in the editor window sets a new breakpoint. To delete a breakpoint, simply drag the breakpoint arrow from the line number.

The breakpoint popup allows you to enable/disable the breakpoint, view how many times the code path has been reached, and whether to pause code execution or log output to the console when the breakpoint is reached. When pause is selected, you may enter JavaScript to be evaluated for conditional breaking, while log mode will evaluate any JavaScript and log its output to the console.

Console

Drosera's console is similiar to the JavaScript console in the Safari debug menu and shows the same errors and warnings. Breakpoints set to log mode allow output to be displayed in the console, and while a script is paused, JavaScript can be executed directly in the console.

Function and Variable Stacks

While a script is paused, you can examine the contents of the variables within various scopes of the code.