Neues in den Entwicklertools: Chrome 127

Sofia Emelianova

CSS-Ankerpositionierung im Bereich „Elemente“ prüfen

Damit Sie die Funktion Ankerpositionierung leichter debuggen können, werden auf dem Tab Stile jetzt explizite Anker-IDs und implizite Anker mit ihren Knoten verknüpft.

Außerdem ist der Attributwert popovertarget jetzt mit dem zugehörigen popover-Element im DOM verknüpft.

Verbesserungen am Bereich „Quellen“

Diese Version enthält mehrere Verbesserungen am Bereich Quellen.

Verbesserte Funktion „Hier nie pausieren“

Mit der Option „Hier nie pausieren“ können Sie verhindern, dass der Debugger immer wieder in derselben Zeile pausiert. So lassen sich irrelevante Haltepunkte, die wiederholt ausgelöst werden, leichter bearbeiten. Diese Version erweitert die Funktion und sie funktioniert jetzt für:

• Ausnahmen oder Promise-Ablehnungen von integrierten Funktionen.
• DOM-, Abruf-/XHR- und CSP-Verstoß-Haltepunkte werden abgebrochen.
• In der Wasm-Disassemblierung.

Workflow in Aktion ansehen:

Chromium-Problem: 40924349.

Neue Event-Listener für Scroll Snap

Die Liste Quellen > Haltepunkte für Ereignis-Listener > Steuerung enthält zwei Listener, die sich auf Scroll Snap beziehen: scrollsnapchange und scrollsnapchanging. Diese Ereignisse werden ausgelöst, wenn Sie den Scrollcontainer so scrollen, dass er an einem neuen Element einrastet.

Chromium-Problem: 40286359.

Verbesserungen im Netzwerkbereich

Diese Version enthält mehrere Verbesserungen am Bereich Netzwerk.

Aktualisierte Voreinstellungen für die Netzwerkdrosselung

Der Bereich Netzwerk erhält aktualisierte Drosselungsvoreinstellungen: die neue Option Schnelles 4G, Schnelles 3G umbenannt in Langsames 4G und Langsames 3G umbenannt in 3G. Dies entspricht besser den Voreinstellungen von Lighthouse.

Chromium-Problem: 342406608.

Service Worker-Informationen in benutzerdefinierten Feldern des HAR-Formats

Wenn Sie das Netzwerkprotokoll in ein HAR-Format exportieren, werden die Informationen zu Service Workern, einschließlich der Zeitangaben, als benutzerdefinierte Felder (mit vorangestellten Unterstrichen) angezeigt. Im Log finden Sie beispielsweise die folgenden neuen Felder:

...
"response": {
  ...
  "_fetchedViaServiceWorker": true,
  "_responseCacheStorageCacheName": "V1",
  "_serviceWorkerResponseSource": "cache-storage"
}
...
"timings": {
  ...
  "_workerStart": -1,
  "_workerReady": -1,
  "_workerFetchStart": -1,
  "_workerRespondWithSettled": -1
}
...

Chromium-Problem: 342406608.

WebSocket-Ereignisse im Bereich „Leistung“ senden und empfangen

Ähnlich wie bei anderen WebSocket-Ereignissen werden im Bereich Leistung jetzt die Ereignisse WebSocket-Nachricht senden und WebSocket-Nachricht empfangen erfasst und im Leistungstrace angezeigt. Beispiel:

Chromium-Problem: 40286129.

Verschiedene Highlights

Hier sind einige wichtige Fehlerbehebungen und Verbesserungen in dieser Version:

• Bedienungshilfen: Screenreader sagen jetzt den Inhalt von Nachrichten in der Konsole an, wenn Sie mit den Pfeiltasten nach oben und unten durch das Protokoll scrollen (344484979).
• Quellen:
  • Seite: Mit der Menüoption Speichern unter werden Wasm-Moduldateien jetzt als gültige Wasm-Binärdateien statt als Base64-Text gespeichert (40784130).
  • Aufrufstapel: Das Suffix (async) wurde aus den Beschreibungen von asynchronen Aufruf-Frames entfernt und die Hervorhebung wurde von kursiv in fett geändert (343750870).
• Arbeitsspeicher: Die unnötige InternalNodes mit der Größe 0 wurde aus der Zusammenfassung des Heap-Snapshots entfernt (340200025).
• Netzwerk: Es wurde ein Fehler behoben, der die Vorschau von Streaming-Antwortinhalten für Anfragen verhinderte, die gerade gestartet wurden, aber noch kein responseReceived-Ereignis erhalten hatten (338340752).
• Leistung:
  • Auswahlstatistiken: Es wurde eine erklärende Kurzinfo für die Spalte %-of-Slow-Path-Non-Matches hinzugefügt (324282954).
  • Track-Konfigurationsmodus: Die Schaltfläche Track-Konfiguration abschließen wurde nach rechts unten verschoben (345256274).
• Konsole: Es wurde ein Fehler behoben, durch den beim Navigieren mit dem Back/Forward-Cache mehrere identische Konsolenmeldungen angezeigt wurden (40894153).
• Einstellungen: Neben allen Tabs wurden Hilfesymbole hinzugefügt.

Vorschaukanäle herunterladen

Verwenden Sie Chrome Canary, Dev oder Beta als Standardbrowser für die Entwicklung. Über diese Vorabversionen erhalten Sie Zugriff auf die neuesten DevTools-Funktionen, können innovative Webplattform-APIs testen und Probleme auf Ihrer Website finden, bevor Ihre Nutzer sie bemerken.

Chrome-Entwicklertools-Team kontaktieren

Nutzen Sie die folgenden Optionen, um über die neuen Funktionen, Updates oder andere Themen im Zusammenhang mit den Entwicklertools zu diskutieren.

• Feedback und Feature Requests können Sie unter crbug.com einreichen.
• Sie können ein Problem mit den Entwicklertools melden, indem Sie in den Entwicklertools auf das Dreipunkt-Menü more_vert Weitere Optionen > Hilfe > Problem mit den Entwicklertools melden klicken.
• Tweeten Sie an @ChromeDevTools.
• Hinterlassen Sie Kommentare zu den YouTube-Videos What's new in DevTools oder DevTools Tips.

Neu in den Entwicklertools

Eine Liste aller Themen, die in der Reihe Neu in den DevTools behandelt wurden.