Mit dem neuen Kontextmenü im DOM-Steuerfeld können Sie Knoten effizient bearbeiten. Sie können Dienstarbeiter direkt über den Bereich „Ressourcen“ debuggen. Wählen Sie in der Farbauswahl eine der Material Design-Farben aus. Blackbox-JS-Bibliotheken einfacher analysieren.
Das neue, verbesserte Kontextmenü im DOM-Bereich
Wir haben die am häufigsten verwendeten Aktionen im DOM-Steuerfeld analysiert und festgestellt, dass das Kontextmenü für das Klicken mit der rechten Maustaste übersichtlich gestaltet und neu organisiert werden sollte.
Es ist jetzt viel einfacher, Elemente schnell auszublenden oder zu löschen, einen bestimmten Status wie :aktiv oder :hover auszulösen oder die HTML-Datei zu bearbeiten. Wenn Sie ein Touchpad verwenden und nicht mit der rechten Maustaste klicken möchten, klicken Sie stattdessen auf die drei kleinen Punkte neben dem ausgewählten Element.
Service Worker über den Bereich „Ressourcen“ debuggen
Service Worker sind fantastisch, sobald sie eingerichtet sind, aber es kann schwierig sein, sich am Anfang damit vertraut zu machen. Das Problem wurde noch dadurch verschärft, dass zum Debuggen die Entwicklertools verlassen und chrome://serviceworker-internals/ in einem neuen Browserfenster geöffnet werden musste.
Das ist jetzt vorbei. Sie können jetzt Service Worker für die aktuelle Domain direkt im Bereich „Ressourcen“ debuggen. Die Funktion ist noch nicht fertig, aber schon jetzt eine deutliche Verbesserung gegenüber dem bisherigen Status quo.
Alle Farben: Material Design-Nuancen in der Farbauswahl
Vor ein paar Wochen haben wir der Farbauswahl die Material Design-Palette hinzugefügt, damit Sie direkt mit auffälligen Primärfarben loslegen können. Wenn Sie eine vollständige Seite entwerfen möchten, benötigen Sie unbedingt vollen Zugriff auf alle Material Design-Farbtöne. Deshalb haben wir sie integriert.
Wenn Sie die Farbtöne aufrufen möchten, halten Sie eine der Grundfarben gedrückt und klicken Sie stattdessen auf einen Farbton.
Blackbox-JavaScript-Bibliotheken jetzt einfacher in den Einstellungen verwalten
JavaScript-Blackboxing gibt es schon länger, war aber nicht sehr leicht zu erkennen. Mit dieser Funktion können Sie ein Script auf einer Seite als Blackbox behandeln, um sich nur auf den von Ihnen erstellten Code zu konzentrieren und den gesamten Umschließenden-Code auszublenden.
Wir haben sie jetzt in die Einstellungen verschoben. Probieren Sie es aus:
Das Beste vom Rest
- Zugriff auf die Schaltflächen für die Rendering-Optionen fehlt? Die Rendering-Einstellungen wurden in das Hauptmenü der DevTools verschoben (unter „Weitere Tools“). Neben den üblichen Verdächtigen (z.B. dem FPS-Messgerät) wurde auch „Druckmedien emulieren“ dorthin verschoben.
- Sie haben keine Lust mehr, „chrome://inspect“ in die Omnibox einzugeben? Geräte prüfen finden Sie jetzt auch im neuen Hauptmenü unter „Weitere Tools“.
- Haben Sie versehentlich einen der Tabulatoren in der Seitenleiste geschlossen, z. B. „Rendering“ oder „Suchen“? Sie können sie jetzt über das neue Menü links wieder öffnen.
Wie immer könnt ihr uns auf Twitter oder in den Kommentaren unten Feedback geben und Fehler unter crbug.com/new melden.
Bis zum nächsten Monat!
Paul Bakaus und das DevTools-Team