Tuesday, May 6th, 2008

Opera Dragonfly: New Web Tooling

Category: Debugging, Opera, Utility

Opera Dragonfly

Opera has posted what looks like a great new Web debugging tool Opera Dragonfly which is released in alpha.

Debug JavaScript, inspect CSS and the DOM, and view any errors – Opera Dragonfly makes developing using Opera easier than ever, both on your computer and mobile phone.

Shawn Lauriat has a nice write-up that tells the story:

It offers most of the familiar tools for DOM inspection (along with a nice DOM editing capability), error logging (with the same granularity as before wrapped in a more polished UI), a JavaScript debugger that rivals WebKit’s Drosera, a JavaScript thread logger, and a lot more that I haven’t explored yet.

Time will tell whether Dragonfly can get enough developers to use Opera and keep them there, and how much the developers behind the new developer tools listen to the community in the coming iterations, but so far this looks extremely promising.


  • Reach breaking point step by step: Opera Dragonfly’s fully featured JavaScript debugger makes building sophisticated Ajax applications easier than ever. Step through your code line by line, setting break points along the way. This allows you to make sure your application and scripts are acting as you designed them.
  • Redefine your style: Its not just the DOM you can inspect. Check out what CSS rules apply to which element, and what rules are inherited or set by browser defaults. Overridden rules are highlighted so you can see what styles are or aren’t applied. Support for editing CSS rules will be added in an upcoming version.
  • Spot your errors: An improved error console allows you to see, filter and log any errors in your scripts, pointing to the exact position the error occurred. Use this in combination with the other tools to hunt down and fix your site’s bugs.
  • Debug the DOM: View source isn’t much use if you use DOM Scripting to alter the DOM. Opera Dragonfly allows you to inspect the updated DOM and all it’s properties. Support for editing the DOM will be added in an upcoming version.

The features that are not there yet, but are upcoming, include support for editing of CSS, JavaScript and the DOM, a single window mode, improved JavaScript thread handling, XHR and HTTP monitoring, improved keyboard navigation, and translation into a number of languages.

Have you checked it out? How do you like it?

Posted by Dion Almaer at 2:38 pm

4.7 rating from 37 votes


Comments feed TrackBack URI

I had take a quick view, but as I see it’s not fast enough, and as it may be possible, not really evident how can I dock the window into the webpage’s window I would like to debug.

Comment by AndrasBarthazi — May 6, 2008

While you can’t dock it now, they do have docking the window to the target window in plan for a future version, at least.

Comment by shawn — May 6, 2008

If this is about to succeed, which I *really* hope it will they MUST copy the UI from FireBug since otherwise developers will be lost by things that will feel “un-natural” and “un-intuitive”…
I am afraid though that Opera won’t think in these directions… :(

Comment by polterguy — May 6, 2008

I guess I’ll keep an eye on it but it still only has a fraction of the capabilities firebug has. Once you can actually update stuff on the page like firebug I might use it.

Comment by Smokinn — May 6, 2008

don’t forget people that this is an alpha. In a world used to betas which stay in beta for ever, Opera has launched an alpha which will go into beta and then into release. ;)

So be patient.

The good thing is the source code is free and can be downloaded, since it’s all just javascript you can create your own custom version and use that….so the UI problem could be solved. If they had indeed copied firebugs UI they would have been slammed for it..

Comment by Zsolt — May 7, 2008

I know it’s alpha and it’s probably my fault, but when I upgraded an existing O9.24 install the menu item just opened the developer community site; now that I removed the old one and installed 9.5 into a separate location the window opens but the loading animation doesn’t stop. I guess I should delete out my preferences…

Comment by deadcabbit — May 7, 2008

Very nice, this is what I’ve been waiting for to switch over. Let’s see if dragonfly is any good.

Comment by Anonymous — May 7, 2008

I briefly tried out Dragonfly and am looking forward to see how it develops, but I think the existing web developer toolbar for Opera (that’s been available for at least a couple of years now) has more features that I can use at this point.

Comment by WillPeavy — May 7, 2008

They wouldn’t have been slammed for taking Firebug’s UI.

No one slammed Firebug for taking its layout from the IE Developer Toolbar

Comment by whyisjasontaken — May 7, 2008

Leave a comment

You must be logged in to post a comment.