Opera Dragonfly alpha for Presto 2.5
By David Storeydstorey. Monday, March 1, 2010 4:26:35 PM
Opera 10.50 has been released as a final version, which brings with it a new rendering engine — Opera Presto 2.5 — and a new version of Opera Dragonfly, featuring some important new features and fixes. In this post I will take you through these Dragonfly updates.
The biggest change is an upgrade to the STP/1 version of Scope. This, combined with Carakan, Vega and other speed optimisations in Presto, make Opera Dragonfly noticeably faster, giving us a solid foundation to build more features on to in the future.
Next, Opera Dragonfly now includes the initial implementation of a storage inspector. The initial implementation supports inspecting cookies and Web Storage data (localStorage and sessionStorage — for more details on these, read Shwetank's Web Storage article). The storage inspector shows the currently stored data, along with the option of creating, deleting or editing a record. This feature will also eventually allow for the inspection of Web SQL Databases, which is also supported in Opera Presto 2.5.
The next major new feature is the colour picker. This is the first tool in the new utilities panel. The feature zooms the area of the page under the mouse pointer and reports the colour value in three different formats: HSL, RGB and Hex. The area and scale of the magnification can be customised, and the colour returned can be the exact pixel selected or an average of the surrounding pixels. Once the colour is selected, it can be stored (using localStorage) for later use. This can be handy for creating colour palettes of commonly used colours.
It is also worth pointing out the new element highlight again, as Opera 10.50 is the first desktop browser to support this feature. The metrics are highlighted on the page in the element highlight. Hovering the different parts of the box model in the Layout panel of the DOM inspector changes the highlight focus. Multiple elements can be highlighted by enabling the button labelled draw a border on to selected elements
in the DOM panel’s toolbar. Once this is enabled each element that is clicked on retains a light highlight and border, similar to the hover highlight. This can be useful for testing how elements align.


dacuan # Tuesday, March 2, 2010 7:31:30 AM
I really like new highlighting
But is there any chance to see AJAX response data in Dragonfly? Currently I can see only headers
FataL # Tuesday, March 2, 2010 8:02:14 AM
But too bad that Opera decided to undermine CSS outline standard and made outline visible over all page elements (even with higher z-index). Much better solution would be using -o-outline for that and keep outline behaviour in line with standard and all other browsers.
Daniel HendrycksDanielHendrycks # Tuesday, March 2, 2010 12:14:50 PM
Originally posted by FataL:
Ditto.
Charles SchlossChas4 # Tuesday, March 2, 2010 2:53:29 PM
setsutekh # Tuesday, March 2, 2010 6:37:48 PM
Leoleo42 # Wednesday, March 3, 2010 2:38:48 PM
I heard this was supposed to be the case, but it seems it's not working for me... anytime I start inspecting (and pointing elements with the mouse), if I decide to switch to another browser tab, dragonfly will stick to the previous tab unless I select it by hand in dragonfly.
I'm using Opera 10.50 final. Maybe there is something to update to have this feature ?
bmd # Wednesday, March 3, 2010 6:22:21 PM
"The protocol version of Opera does not match the one which Opera Dragonfly is using.
Try to load a compatible version?"
No matter if I press OK or Cancel, I still get this error every time. Does anybody have an idea on how I can fix this?
Thanks for the really nice tool.
FransFrenzie # Wednesday, March 3, 2010 8:21:49 PM
Originally posted by Leo:
10.50 bug. Used to be fine in 10.10. I believe I reported it.
Rafald.i.z. # Thursday, March 4, 2010 12:10:55 AM
Leo: If I understand correctly, you want debugging context to change automatically on switching tabs. That's not the way DF works and it would be very confusing IMO. You would easily loose debugging information because you just wanted to lookup some informations in other tab or something.
Frans: There is a bug yes but it's not happening on inspecting with right click so I guess Leo meant other thing.
FransFrenzie # Thursday, March 4, 2010 10:32:23 AM
Originally posted by Rafal:
Yeah, it happens with loading DragonFly from menu/keyboard shortcut and it doesn't occur with inspect element. On rereading the message I believe you're right and I would not consider this particular behavior a bug.
Leoleo42 # Thursday, March 4, 2010 10:45:26 AM
This is how all other Firebug-like tools work: firebug itself, and the one included in Safari/Chrome... And it's definitely an important feature. Having to change the context by hand doesn't sound logical.
FransFrenzie # Thursday, March 4, 2010 11:56:35 AM
Originally posted by Leo:
For me Firebug attaches itself to one particular tab and doesn't show up in other tabs unless you activate it in another tab. If you detach it then you can activate it for the tab (and then it will automatically change around between activated tabs). This behavior is fine with me. Better, it'd be great. However, in DragonFly it lost the debugging state (or at least it did a few months ago) when switching between tabs, and as such it would be undesired.
I regard the current behavior as a temporary fix for the losing of state, with Firebug's behavior as the way things should be.
So we probably are in agreement, just miscommunicating.
Leoleo42 # Thursday, March 4, 2010 1:01:40 PM
Do you see what I mean ? So the wrong behaviour would be that opening a new tab, bringing dragonfly, then switching tab, will let dragonbird oepened (and inspecting the previous tab), instead of closing it
FransFrenzie # Thursday, March 4, 2010 2:22:12 PM
Regardless, I definitely prefer DragonFly, although it copied a few Firebug features I like less recently (like writing out all properties instead of using shorthand).
FataL # Monday, March 8, 2010 8:22:04 PM
Personally, I would prefer shorthand notation where it's possible.
FransFrenzie # Tuesday, March 9, 2010 10:38:14 AM
Originally posted by FataL:
I think it used to use shorthand when I used it in the original code? At any rate, I definitely prefer shorthand. The longer notation makes it a lot harder to see what's going on.
Matheusnom4d3br # Wednesday, March 10, 2010 12:09:49 PM
Originally posted by dacuan:
+10000
that's exactly what i want to nevermore use firefox/firebug
zocario # Wednesday, March 10, 2010 4:41:06 PM
DavidSchalandra # Wednesday, March 10, 2010 11:14:58 PM
You would have to integrate an FTP/SFTP client in Dragonfly and I kinda doubt that this will be even possible.
@Leo
I'm not sure if I understood you right, but do you really want that Dragonfly closes when you switch the tab and restarts when going back to the first tab? I'm working with two displays - one with Opera in full screeen, one with Dragonfly in full screen. So the behaviour would be an opening and closing debugging window all the time? I don't think I would like that.
Leoleo42 # Monday, March 15, 2010 3:49:29 PM
1. Here is what happens in Firebug (and any firebug like tool, like in Safari/Chrome,...).
Imagine you have two tabs opened. You're displaying the first one. You decide to bring firebug, and do your stuff... Then, you switch to the second tab. Firebug won't be opened. If you decide to bring it, it will inspect the current tab. And so on...
2. Here is what happens in Dragonfly...
You have two tabs, and decide to bring Dragonfly. You do your stuff. Then decide to switch to the second tab. Dragonfly will remain opened (even though you don't wanna use it on this tab...), but will be stick to the previous tab, unless you change it by hand.
I thought the problem was that it didn't automatically inspect the current active tab, but as pointed out, the problem is rather that it stays opened when switching tab.
DavidSchalandra # Tuesday, March 16, 2010 8:23:22 AM
Often I strangely exprience the opposite: I start Dragonfly and when switching to a different tab the highlighting of Dragonfly seems to be active on the new tab too. So the behaviour that you want to have is most disturbing for me.
edit:
I just had a look at Dragonfly, Firebug and IEDevTools. I started the Debugger in 1 windows then switched it to fullscreen mode and opened another website. This is what happened:
Dragonfly: Within the same domain DF switches the debugged website back and forward automatically. Any website outside of the domain will not be accessed without switching manually (or using "Inspect element", which is my preferred way doing it).
Firebug: Firebug doesn't switch. You can click "Activate Firebug for selected Firefox tab", then it debugs the current tab, too. Switching the tab takes a bit of time (around 1-2 seconds here) but works perfectly.
IEDevTools: The IEDT can't switch at all. You open a new tab, activate "Select element by click" and nothing happens. If you switch back to the first tab you will be in selection mode. There seems no direct way to switch, so you have to close IEDT and restart it with the new tab open.
EdBJedbj # Thursday, March 25, 2010 3:47:36 AM
When I try to launch Dragonfly, I get its home page instead of the app. My 10.51 config file shows Dragonfly URL as <https://dragonfly.opera.com/app/>.
EdBJedbj # Thursday, March 25, 2010 4:55:31 AM
Originally posted by edbj:
Solved. I had Opera identifying as FF, so it wouldn't load.
Maksmegaupload # Thursday, April 15, 2010 3:41:29 PM
LITWINLITWINCZUK # Sunday, April 25, 2010 7:20:27 PM
On right: "Think open and free"
and link: "Opera Dragonfly repository" - is broken.
gigimon # Saturday, May 1, 2010 8:24:42 PM
Daniel HendrycksDanielHendrycks # Saturday, August 21, 2010 3:06:26 PM
mrssmithmrssmith88 # Friday, October 15, 2010 12:15:10 PM