Take an early look at Opera’s new developer tools (DOM Inspector, CSS Editor)
Published November 15th, 2006 11:59 AM EST By Daniel GoldmanOn Opera’s developer site, Dev.Opera, they posted some of the new developer toolbars for the Opera browser.
The toolbars, which are still considered an alpha release, include a DOM Inspector, Real-time CSS editor, and DOM Snapshot. These capabilities have long been requested by developers, and now Opera is adding it.
Hopefully these Opera toolbars (and the more powerful ones still to come), will be able to successfully compete against Firefox’s popular Web Developer toolbar extension.
What we at Opera want is for developers to use the Opera browser as part of their development environment. By using Opera, which is the most standard compliant browser, their sites will likely work the same way across all platforms (desktop, mobile phones, gaming consoles – Nintendo Wii, and other devices) and screen sizes.
Head over to Dev.Opera for more details on these new developer tools and make sure to download them too.
If you enjoyed this post, then make sure you subscribe to my RSS Feed.
using
ok folks,
even with javascript enabled, it didn’t work…
actions taken:
click on link
click ‘ok’ to msg asking to add button & script
add button to toolbar of preference (personal)
click on button
what am i missing?
using
Wel great work Opera, I put them all on my toolbar to try them out.
@Ebola: try them first on the mainbar to try them out.
using
Same here
using
It only doesn’t work on some sites it seems.
using
Nice! I like it!
using
Great! I’ll have to check these out!
using
alpha - that’s right
Nothing beats Firefox’s slew of tools, not limited to simply the Web Developer Toolbar - check out all the others there, too.
You could probably even catch mistakes on any site with the HTML Validator, which has lots of great features built in (like Tidy).
If Opera would open this door to developers (who actually love Opera and want to see it become the next big thing) they’ll do more than just barely survive…
using
as someone who doesn’t know anything about website coding, the tools do look nice and seem to be very comprehensive.
using
@EC:Opera has a validator for years(ctrl+alt+v)
I also used other validators in Opera so Firefox isn’t needed.
using
Not impressed.
I was expecting an integrated solution (maybe in Opera 10?), but this is just a half-hearted attempt that relies on remote files (and hence being online, useless for many dial-up users in the world).
domConsole_2.js has a typo: “cssProperies”
Seriously, Opera, get your act together and include the devtools natively in the next version. Only then can you get some attention from web developers.
using
@Blah:indeed maybe in Opera 10, you can’t expect opera to put everything in 9.
futher when installed(it’s very little) it also works of-line.
As a web developer Opera has my attention so why shouldn’t other developers isntall and use it?
using
This is definitely a step in the right direction. However web developper toolbars (using external tools) have always existed for Opera, it would be nice to see an integrated version of this (which I’m hoping will be the case). As for competing with Firefox, Opera would need an equivalent of Firebug, that extension is worth installing Firefox for alone. If Opera could innovate in this area and produce something better than Firebug (and Web Dev Toolbar), then you would see alot of web developers using Opera, which would cause alot more people to use Opera (increased site compatibility and increased advertising).
Normally I just read the articles and comments here but I thought this was worth making a comment about.
using
Huh? Who just barely survives?
Yeah, I’m sure it’s just a matter of throwing something native together. It probably takes just five minutes to write. Right?
using
In fact, it takes two minutes!
Stop being a fanboy.
using
hey berend ytsma,
thanks for the tip, but placing the icons on the main toolbar didn’t make a difference. HOWEVER, you got me to try some other things, and the following fixed it:
i was blocking all popups, but when i blocked only the unwanted ones, all the scripts worked beautifully!
way to go, opera!
ei
using
I’ll try to do a video demo of the new developer tools with one of the Opera desktop people. A video speaks a million words.
using
One (somewhat unrelated) suiggestion: could we get line numbers in the source viewer? That would be great
I’ve been trying to fix some validation errors and it’s a real pain to copy the source to another editor so I can see line numbers.
using
Few quick tests I did seemed cool.
One thing I really liked was the ‘metrics’ option for elements, to see how big they actually were, and the padding/margin on them
Very useful for a lot of the stuff I do
using
I’m a bit confused by the wording. I don’t consider custom-buttons / power-buttons as toolbars. Did I miss anything?
using
ResearchWizard, now they’re being released in the form of buttons. But once they go out of alpha/beta testing, they will be part of a toolbar.
using
Daniel, thanks for the clarification. I suppose it will be one toolbar.
Have a nice weekend
Christian
using
Aren’t these Aleto’s bookmarklets with a new look? I guess that’s the alpha part: they’re just bookmarklets now but will eventually be included in the browser.
A more user-friendly DOM Console would be nice, btw (e.g., why do I have to move to the far right of the screen after selecting an element on the left only to choose whether I want to see the element’s dimensions or attributes?).
I had never tried FF’s WebDevToolbar before and I must say I wasn’t impressed. It’s certainly useful, but I thought it would have lots of things that Opera doesn’t have. Most things I saw are already available in Opera. What do people who know FF’s toolbar better miss in Opera?