Opera Dragonfly - Some Suggestions
Posted on by Steve Workman About 2 min reading time
Opera Dragonfly, the opera web browser's developer tools, were released into alpha yesterday. It features tools like a DOM inspector, CSS style tracing, Javascript console with breakpoints and step-through inspection, and support for debugging other opera browsers (opera mobile and opera tv, though not opera mini). However, it's not all roses.
First off, I like opera. I use it every day as my primary browser because it's fast, standards-compliant and has great time-saving features like search shortcuts, speed dial and a great password saving facility. So, I'm the type of person that the announcement of an this is aimed at. I've been using the tools today and there are some very good things.
First-off, the CSS inspector is pretty good. It's not as clear as firebug as if you switch the shorthand styles off there's just a mass of styles and along with the initial browser styles it gets a bit too much. Whilst I'm being picky, I'm finding the buttons hard to use, and it's hard to tell what's going on at first. The difference in on and off positions for active buttons isn't clear enough and will flummox most users.
The DOM inspector is pretty good, though the element highlighting doesn't select "invisible" elements i.e. anytihng that's "visibility:hidden;" which is something that I really value in firebug.
There's a good javascript debugging facility available, though finding the right script is a bit of a mission as any inline scripts are named the same with line numbers. If you're debugging an ASP .NET site, there's javascript everywhere and that makes it very difficult to find what you're after. I also found it quite hard to tell what line I was on when stepping through a simple AJAX call as there was no visible line highlighting; something that will need to be fixed before I use it again.
This alpha's big downfall is that it's not dockable i.e. it has to be in a separate window. For those of us on laptops or without large monitors it's hard to see what's going on when you have to flick between the two. This is coming in a new release in a few weeks time, which will update itself, thanks to the way Dragonfly is built.
There are some other niggles too, some of which are bugs:
- Searching the DOM is case sensitive
- Lots of different consoles, though only javascript and CSS have produced results so far
- The console thinks that CSS3 styles (rgba) and mozilla/webkit specific styles are errors
- The close button keeps disappearing on the settings menu
- It badly needs header inspection. Debugging AJAX isn't worth much without it
All in all, a very good start which I'm certain will improve. It's not going to change the way I work as almost anything that's wrong in opera is also wrong in firefox. It's better than IE6/7's debugger, though not as good as firebug. With the addition of mobile browser debugging, a useful feature I've not had time to test, Dragonfly could be amazing. We'll wait and see...