Opera integriert ab Version 9.20 ein Developer-Tool in den Browser

Im heute veröffentlichten experimentellen »weekly build« des Opera-Browsers ist ein Werkzeug für Webentwickler enthalten, das an Firefox’ äußerst nützliche Firebug-Erweiterung erinnert. Es lässt sich über den Menüpunkt Extras → Weiteres → Developer Console aktivieren und wird in einem PopUp-Fenster dargestellt.

Screenshots

Die Ansicht des DOM (Document Object Model) visualisiert die Struktur des Dokuments und ermöglicht es, Elemente und Attribute einzufügen oder zu löschen:

Opera Developer-Tool DOM

Klickt man auf ein Element, werden unter anderem die darauf angewandten CSS-Eigenschaften und -Werte ausgegeben:

Opera Developer-Tool DOM-Styles

Der Karteireiter JS informiert über JavaScript-Objekte und -Methoden:

Opera Developer-Tool JavaScript

Das bzw. die Stylesheets des Dokuments stehen im Reiter CSS zur Verfügung und lassen sich live bearbeiten. Opera passt hierbei die Darstellung im Browserfenster entsprechend an:

Opera Developer-Tool CSS

Auch hinsichtlich des Datentransfers zeigt sich das Tool auskunftsfreudig:

Opera Developer-Tool HTTP

Download:

Das Werkzeug befindet sich noch in Entwicklung, läuft in Opera 9.20 unter OS X jedoch stabil. Dennoch sei darauf hingewiesen, dass es sich bei den öffentlichen Entwicklerversionen des Browsers um wenig getestete Ausgaben handelt:

The Weekly Builds are snapshots, they are not as thoroughly tested as a Technology Preview or a Public Beta. You should only use these builds if you are not afraid of losing data (e-mail, bookmarks, anything) or crashing your computer.

Über technisches Feedback und Fehlermeldungen freut man sich beim Opera Desktop Team, über ambitionierte Vergleiche mit Firebug vermutlich (noch) nicht.

2 Kommentare » Schreibe einen Kommentar

  1. Das Developer-Tool läuft auch unter Windows sehr gut. Benutze es jetzt fast täglich, besonders die Suchfunktion. Per Mausklick ins Browserfenster der untersuchten Seite verrät einem das Tool auch Details, z.B. erfahre ich eben, während ich hier reinklicke, dass diese textarea die ID "Developer-Tool", den Namen "bl_text", 20 Reihen und 60 Spalten hat. Und das ohne den Quelltext aufrufen zu müssen 🙂

    Danke für den Artikel und die aussagefähigen Screenshots ( Sieht ja im MAC noch schicker aus 😉 )!

  2. Guter Artikel! Hab zwar immer noch keinen Opera auf meinem Rechner, aber dafür den Firefox gleich mit Webdeveloper und Firebug bestückt. Was man da alles über Webseiten herausfinden kann …