Neuerungen in den Entwicklertools (Chrome 94)

Entwicklertools in deiner bevorzugten Sprache verwenden

Die Chrome-Entwicklertools unterstützen jetzt mehr als 80 Sprachen, sodass du in deiner bevorzugten Sprache arbeiten kannst.

Öffnen Sie die Einstellungen und wählen Sie unter Einstellungen die gewünschte Sprache aus. Sprache und aktualisieren Sie die Entwicklertools.

Einstellungen“ width="800" Höhe="494">

Chromium-Problem: 1163928

Neue Nest Hub-Geräte in der Geräteliste

Im Gerätemodus können Sie jetzt die Abmessungen von Nest Hub und Nest Hub Max simulieren.

Klicken Sie auf Gerätesymbolleiste ein-/ausblenden   Gerätesymbolleiste ein-/ausblenden und wählen Sie in der Geräteliste „Nest Hub“ oder „Nest Hub Max“ aus.

Nest Hub im Gerätemodus

Chromium-Problem: 1223525

Ursprungstests in der Frame-Detailansicht

Informationen zu den Ursprungstests einer Website finden Sie jetzt in der Ansicht „Frame-Details“ im Bereich „Anwendung“.

Mit Ursprungstests erhalten Sie Zugriff auf eine neue oder experimentelle Funktion, mit der Ihre Nutzer für eine begrenzte Zeit Funktionen erstellen können, bevor die Funktion für alle Nutzer verfügbar ist.

Öffnen Sie eine Seite mit Ursprungstests (z.B. Demoseite). Scrollen Sie im Steuerfeld Anwendung nach unten zum Abschnitt Frames und wählen Sie den obersten Frame aus.

Ursprungstests in der Frame-Detailansicht

Chromium-Problem: 607555

Logo für neue Preisvergleichsportal-Containerabfragen

Neben den Containerelementen (den Ancestor-Elementen, die den Kriterien der @container-At-Regeln entsprechen) wird ein neues container-Logo hinzugefügt. Klicken Sie auf das Badge, um ein Overlay des ausgewählten Containers und aller untergeordneten Elemente, die abgefragt werden, auf der Seite einzublenden.

Logo für Preisvergleichsportal-Containerabfragen

Chromium-Problem: 1146422

Neues Kästchen zum Umkehren der Netzwerkfilter

Verwenden Sie das neue Kästchen Invertieren, um die Filter im Steuerfeld „Netzwerk“ umzukehren.

Sie können beispielsweise „status-code: 404“ eingeben. um die Netzwerkanfragen mit dem Status 404 zu filtern. Klicken Sie das Kästchen Invertieren an, um den Filter zu negieren. Damit werden alle Netzwerkanfragen angezeigt, die nicht den Status 404 haben.

Netzwerkfilter umkehren

Chromium-Problem: 1054464

Anstehende Einstellung der Console-Seitenleiste

Die Seitenleiste der Konsole wird entfernt, um die Filter-UI in die Symbolleiste zu verschieben. Hast du Fragen oder Feedback? Hier kannst du uns Probleme melden.

Nachricht zur Einstellung der Seitenleiste der Konsole

Chromium-Problem: 1232937

Auf dem Tab „Probleme“ und im Bereich „Netzwerk“ RAW-Header für Set-Cookie anzeigen

In den Entwicklertools werden auf dem Tab Issues (Probleme) jetzt Rohheader von Set-Cookie angezeigt.

Bisher wurden in den Entwicklertools im Bereich „Netzwerk“ keine fehlerhaften Cookies (falscher Set-Cookie-Header) angezeigt. Mit dem neuen Filter response-header-set-cookie im Bereich Netzwerk können Nutzer die Rohdaten des Headers Set-Cookie filtern. Die Entwicklertools verknüpft die Set-Cookie-Standardheader auf dem Tab Issues (Probleme) mit dem Bereich Network (Netzwerk).

„Set-Cookie“-Rohdaten auf dem Tab „Probleme“ und im Bereich „Netzwerk“

Chromium-Problem: 1179186

Native Zugriffsfunktionen werden in der Console einheitlich als eigene Attribute angezeigt

In der Console werden native Zugriffsfunktionen jetzt einheitlich als ihre eigenen Properties angezeigt.

Bei der Auswertung des Ausdrucks new Int8Array([1, 2, 3]) in der Console wurden beispielsweise native Zugriffsfunktionen wie length, byteOffset in der Vorschau nicht angezeigt. Mit diesem neuesten Update werden native Zugriffsfunktionen in der Vorschau angezeigt und die Werte werden beim Erweitern sorgfältig ausgewertet.

Native Zugriffsfunktionen werden in der Console einheitlich als eigene Attribute angezeigt

Chromium-Probleme: 1076820, 1199247

Ordnungsgemäße Fehler-Stacktraces für Inline-Skripts mit #sourceURL

In den Entwicklertools werden Inline-Skripts jetzt korrekt mit #sourceURL aufgelöst und die Fehler-Stacktraces für die Fehlerbehebung werden korrekt angezeigt.

Bisher wurde in den Entwicklertools mit #sourceURL die falsche Position für Inline-Skripts angezeigt, und zwar relativ zum umgebenden Dokument und nicht relativ zum öffnenden <script>-Tag.

Ordnungsgemäße Fehler-Stacktraces für Inline-Skripts mit #sourceURL

Chromium-Probleme: 1183990, 578269

Farbformat im Bereich „Berechnet“ ändern

Sie können jetzt das Farbformat jedes Elements im Bereich „Berechnet“ ändern, indem Sie bei gedrückter Umschalttaste auf die Farbvorschau klicken.

Bei gedrückter Umschalttaste auf die Farbvorschau klicken, um das Farbformat zu ändern

Chromium-Problem: 1226371

Benutzerdefinierte Kurzinfos durch native HTML-Kurzinfos ersetzen

In den Entwicklertools werden jetzt native HTML-Kurzinfos für alle Komponenten verwendet. In den Entwicklertools gibt es schon lange eine benutzerdefinierte Kurzinfo-Implementierung, da eine native HTML-Kurzinfo fehlt.

Leider ist die Pflege einer benutzerdefinierten Kurzinfo-Implementierung kompliziert und wir stoßen regelmäßig auf komplizierte Fehler.

Nach der Neugewichtung der Vorteile der benutzerdefinierten Implementierungen stellen wir fest, dass die nativen HTML-Kurzinfos für die Entwicklertools ausreichen. Durch die Einführung der Kurzinfos können wir eine Vielzahl von Problemen für unsere Nutzer vermeiden.

Kurzinfo zu Entwicklertools

Chromium-Problem: 1223391

[Experimentell] Probleme auf dem Tab „Probleme“ ausblenden

Aktiviere das Test Menü „Probleme ausblenden“, um Probleme auf dem Tab Probleme auszublenden. So können Sie sich auf die wichtigen Themen konzentrieren.

Bewegen Sie den Mauszeiger auf dem Tab Problem auf ein Problem, klicken Sie rechts auf das Problemmenü Mehr und wählen Sie Probleme wie dieses ausblenden aus, um es auszublenden.

Experimentelle Funktion zum Ausblenden des Kontextmenüs für Probleme

Chromium-Problem: 1175722

Vorschaukanäle herunterladen

Sie können Canary, Dev oder Beta als Standardbrowser für die Entwicklung verwenden. Über diese Vorschaukanäle erhältst du Zugriff auf die neuesten Entwicklertools, kannst hochmoderne Webplattform-APIs testen und Probleme auf deiner Website erkennen, bevor deine Nutzer es tun.

Kontaktaufnahme mit dem Team für Chrome-Entwicklertools

Mit den folgenden Optionen kannst du die neuen Funktionen und Änderungen des Beitrags oder andere Aspekte der Entwicklertools besprechen.

  • Senden Sie uns über crbug.com einen Vorschlag oder Feedback.
  • Problem mit den Entwicklertools über Weitere Optionen melden Mehr > Hilfe > Hier kannst du Probleme mit den Entwicklertools in den Entwicklertools melden.
  • Twittern Sie unter @ChromeDevTools.
  • Hinterlasse Kommentare in den YouTube-Videos mit den Neuerungen in den Entwicklertools oder in YouTube-Videos mit Tipps zu den Entwicklertools.

Neu in den Entwicklertools

Eine Liste mit allen Themen der Reihe Neuerungen bei den Entwicklertools