Diese Seite wurde von der Cloud Translation API übersetzt.

Neu in den Entwicklertools (Chrome 113)

Sofia Emelianova

Jecelyn Yeen

Netzwerkantwortheader überschreiben

Sie können jetzt Antwortheader im Bereich Netzwerk überschreiben. Früher brauchten Sie Zugriff auf den Webserver, um mit HTTP-Antwortheadern zu experimentieren.

Mit Überschreibungen von Antwortheadern können Sie lokale Fehlerkorrekturen für verschiedene Header erstellen, einschließlich, aber nicht beschränkt auf:

Wenn Sie einen Header überschreiben möchten, gehen Sie zu Netzwerk > Headers > Antwortheader, bewegen Sie den Mauszeiger auf den Wert eines Headers, klicken Sie auf und bearbeiten Sie ihn.

CORS-Fehler durch Überschreibung des Headers behoben.

Sie können auch benutzerdefinierte Header hinzufügen.

Benutzerdefinierten Header hinzufügen

Wenn Sie alle Überschreibungen an einem Ort bearbeiten möchten, bearbeiten Sie die Datei .headers unter Quellen > Überschreibungen. Sie können dort auch auf Überschreibungsregel hinzufügen klicken, um mehrere Anfragen mithilfe von Platzhaltern (*) zu überschreiben.

Alle Überschreibungen werden bearbeitet.

Chromium-Problem: 1288023.

Verbesserungen bei Nuxt-, Vite- und Rollup-Debugging

Damit Sie Probleme während der Fehlerbehebung schneller erkennen können, werden im optimierten Stacktrace jetzt Frames ausgeblendet, die aus Quellen stammen, die von Nuxt 3.3 oder höher generiert wurden. Diese Frames werden von den Entwicklertools übersprungen:

Gehen Sie in den Traces der Konsole unter dem Link N weitere Frames anzeigen vor.
Gehen Sie zu Quellen > Aufrufstapel unter Frames auf der Ignorieren-Liste anzeigen.

Der Stacktrace vor und nach der Aktivierung des Ignorieren-Auflisten durch Drittanbieter.

Um diese Verbesserungen umzusetzen, haben die Teams für Entwicklertools, Nuxt, Vite und Rollup gemeinsam die x_google_ignoreList Source Map-Erweiterung eingeführt:

Das DevTools-Team möchte sich bei den Teams von Nuxt, Vite und Rollup für die Unterstützung bedanken. Wir wissen Ihre Bemühungen und die Zusammenarbeit, die für den Erfolg dieser Implementierung entscheidend war, zu schätzen. Nochmals vielen Dank für deine Beiträge!

CSS-Verbesserungen unter „Elemente“ > „Stile“

Ungültige CSS-Eigenschaften und -Werte

Damit Sie CSS-Probleme schneller diagnostizieren können, wird der Bereich Styles jetzt durchgestrichen:

Eine vollständige CSS-Deklaration (Eigenschaft und Wert), wenn die CSS-Eigenschaft ungültig ist.
Nur der Wert, wenn die CSS-Eigenschaft gültig, aber der Wert ungültig ist.

Ungültiger Eigenschaftsname und ungültiger Eigenschaftswert.

Das Entwicklertools-Team möchte sich bei Yisi(Ş丝) für diese Verbesserung bedanken.

Links zu den wichtigsten Frames in der Animationskurzeigenschaft

Die CSS-Eigenschaft animation enthält jetzt Links zu den entsprechenden @keyframes-At-Regeln, sodass Sie im Bereich Styles schneller navigieren können.

Links zu den wichtigsten Frames in der Animationskurzeigenschaft

Chromium-Problem: 1420656.

Neue Konsoleneinstellung: Automatische Vervollständigung beim Drücken der Eingabetaste

Ab der vorherigen Version (112) können Sie die Entwicklertools-Konsole so konfigurieren, dass automatisch ein Vorschlag angewendet wird, wenn Sie Enter drücken.

Standardmäßig können Sie Tab oder Arrow right drücken, um einen automatisch vervollständigten Vorschlag zu übernehmen. Um auch die automatische Vervollständigung mit Enter zu nutzen, aktivieren Sie Einstellungen > Konsole > Automatische Vervollständigung bei Eingabetaste akzeptieren.

Über das entsprechende Kästchen unter „Einstellungen“

Außerdem ist der Text einer weiteren Einstellung jetzt nutzerfreundlicher: Codeauswertung als Nutzeraktion behandeln.

Chromium-Problem: 1276960.

Im Schnellzugriffsdialogfeld im Befehlsmenü werden jetzt die nicht gelisteten Dateien von Drittanbietern ausgegraut, um die von Ihnen erstellten Dateien hervorzuheben.

Ein Skript, das auf der Ignorieren-Liste im Schnellöffnen-Dialogfeld vor und nach der Änderung aufgeführt ist.

Chromium-Problem: 1424345.

Einstellung von JavaScript Profiler: Phase 2

Schon Chrome 58 plante das Entwicklertools-Team, den JavaScript Profiler irgendwann einzustellen und damit Node.js- und Deno-Entwickler über den Bereich Leistung Profile zur JavaScript-CPU-Leistung erstellen können.

Mit Version 113 der Entwicklertools beginnt die Phase 2 der Einstellung des JavaScript Profiler mit vier Phasen. Während dieser Phase können Sie das Steuerfeld weiterhin öffnen, aber seine Benutzeroberfläche ist nicht mehr verfügbar.

Wenn Sie ein Profil der CPU-Leistung erstellen möchten, klicken Sie auf den Bereich Leistung.

Einstellung von JavaScript Profiler.

Chromium-Problem: 1354548.

Verschiedene Highlights

Im Folgenden sind einige wichtige Fehlerkorrekturen in dieser Version aufgeführt:

Es wurde ein Fehler behoben, der dazu führte, dass im Bereich Quellen Variablennamen mit Unicode-Zeichen falsch verarbeitet wurden (1425055).
Auf dem Tab Probleme wurde eine neue Nachricht für Autofill-Probleme mit nicht standardmäßigen HTML-Werten (1399414) hinzugefügt.

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.
Melde ein Problem mit den Entwicklertools über Weitere Optionen > Hilfe > Probleme mit den Entwicklertools melden in den Entwicklertools.
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.