I was doing a little web-work, and came across a bug in my javascript code. I spent a couple minutes trying to find it using the javascript console in Safari, but quickly gave up and decided to give Apple’s Javascript debugger (Drosera) a try. I tried it a couple months ago but couldn’t get it to work, but I decided to download the latest nightly build and see if it had improved. It did.

Drosera attached to the webkit browser fine, and inspected any page that I looked at in the webkit browser. I visited the page that I was having problems with and bang, the webkit browser froze (the page seems to indefinitely load until you continue the JS execution), and the line of code that was causing problems was highlighted (as shown in the screenshot to the right) showing me the exact position of my bug in the JS code. You can view variables in the runtime, set breakpoints, pause execution; most normal debugging operations.

There is also a console where you can (when the runtime is paused) execute arbitrary JS code and see the results.

The biggest annoyance I had with Javascript is that there was no way to inspect the runtime and easily find the line of code where your bug was hiding; Drosera fills this gaping hole in Javascript development wonderfully!

There is one gripe I have with it though, as far as I can tell there is no way to get the actual Javascript error from inside Drosera, you have to go back to the webkit build and look as the JS console. I hope they integrate the JS console into Drosera in the final release.