Opera 11.51 was released on September 1, 2011. It’s a minor update which fixes a known security issue, improves stability and offers full-screen support in Mac Lion.
Of more interest to web developers is Dragonfly 1.1 — Opera’s Firebug-like console. I gave version 1.0 a glowing review in May, but there were a few minor niggles which caused concern. More than 200 bug fixes and interface updates have been implemented in the latest edition, so let’s look at the highlights…
DOM Inspector
Perhaps the biggest problem with Dragonfly 1.0 was the lack of links and line numbers to styles in CSS files. That problem has been addressed and I suspect many developers will be thankful.
The Inspector now supports pseudo classes and pseudo elements. This includes ::before and ::after which now appear as nodes within the DOM tree. It’s a fantastic facility which is yet to appear in competing tools.
A new button is also provided which allows you to toggle states including :link, :visited, :hover, :active, :focus and ::selection. While a similar function exists in Firebug, few developers know about it and Dragonfly’s implementation is superior.
Finally, there’s an new “Search” tab which allows you to locate elements by text, regular expression, CSS selector and XPath (e.g. (e.g. enter //div to find all div elements in the page). Very useful.
JavaScript Debugger
An improved search facility has also been implemented within the Scripts tab. It’s possible to search using text or regular expressions across a single file or all JavaScript files. You can also include or omit dynamically-injected scripts.
Network and Resource Inspectors
It’s now possible to inspect POST data sent via standard or multi-part forms. A new search field is also provided in the Resource Inspector.
One of the primary criticisms of v1.0 was Ajax monitoring. Dragonfly 1.1 is better and, given my limited test, it correctly reported all background XMLHttpRequest calls. Unfortunately, the returned message body is still shown as an encoded base64 string so it’s impossible to directly inspect JSON data. Opera — please, please address it in the next version!
Read entire article at Sitepoint