Neues in den Entwicklertools: Chrome 127

Sofia Emelianova

Positionierung von CSS-Ankern im Steuerfeld „Elemente“ prüfen

Um das Debuggen der Funktion Ankerposition zu vereinfachen, werden auf dem Tab Stile jetzt explizite und implizite Anker mit ihren Knoten verknüpft.

Außerdem ist der Attributwert popovertarget jetzt mit seinem popover-Element im DOM verknüpft.

Verbesserungen im Quellenbereich

In dieser Version wurden mehrere Verbesserungen im Bereich Quellen vorgenommen.

Erweiterter Modus „Hier nie pausieren“

Mit dem Titel "Nie Pausen können Sie verhindern, dass der Debugger immer wieder in derselben Zeile anhält. Dies erleichtert die Arbeit mit irrelevanten Haltepunkten, die wiederholt ausgelöst werden. Diese Version verbessert diese Funktion und funktioniert jetzt für:

• Ausnahmen oder Promise-Ablehnungen von integrierten Funktionen
• „Wird storniert“ Haltepunkte für DOM-, Abruf-/XHR- und CSP-Verstöße.
• Beim Auseinanderbauen von Wasm.

Sehen Sie sich den Workflow in Aktion an:

Chromium-Problem: 40924349.

Neue Listener für Scroll-Snap-Ereignisse

Die Quellen > Ereignis-Listener-Haltepunkte > Die Steuerelementliste erhält zwei Scroll-Snap-Listener: scrollsnapchange und scrollsnapchanging. Diese Ereignisse werden ausgelöst, wenn Sie durch den Scroll-Container so scrollen, dass er an einem neuen Element angedockt wird.

Chromium-Problem: 40286359.

Verbesserungen beim Netzwerkbereich

In dieser Version wurden einige Verbesserungen im Bereich Netzwerk vorgenommen.

Aktualisierte Voreinstellungen für Netzwerkdrosselung

Im Bereich Netzwerk werden die Drosselungsvoreinstellungen aktualisiert: Schnelles 4G, Schnelles 3G wird in Langsames 4G und Langsames 3G in 3G umbenannt. Das passt besser zu den Lighthouse-Voreinstellungen.

Chromium-Problem: 342406608.

Service Worker-Informationen in benutzerdefinierten Feldern des HAR-Formats

Wenn Sie das Netzwerkprotokoll in das HAR-Format exportieren, können Sie jetzt die Informationen zu Service Workern, einschließlich Zeitangaben, als benutzerdefinierte Felder mit Unterstrichen als Präfix sehen. Im Log könnten beispielsweise die folgenden neuen Felder angezeigt werden:

...
"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 andere WebSocket-Ereignisse erfasst das Steuerfeld Leistung jetzt die Ereignisse WebSocket-Nachricht senden und WebSocket-Nachricht empfangen und zeigt sie im Leistungs-Trace an. Beispiel:

Chromium-Problem: 40286129.

Verschiedene Highlights

Im Folgenden sind einige bemerkenswerte Fehlerbehebungen und Verbesserungen in dieser Version aufgeführt:

• Bedienungshilfen: Screenreader vorlesen jetzt den Inhalt von Nachrichten in der Console, wenn sie mit den Auf- und Abwärtspfeilen (344484979) durch das Protokoll scrollen.
• Quellen:
  • Seite: Mit der Menüoption Speichern unter werden Wasm-Moduldateien jetzt als gültige Wasm-Binärdateien anstelle von Base64-Text (40784130) gespeichert.
  • Aufrufstapel: Das Suffix (async) wurde aus den Beschreibungen der asynchronen Aufrufframes entfernt. Die Hervorhebung wurde von kursiv in fett geändert (343750870).
• Arbeitsspeicher: Das unnötige InternalNodes mit der Größe null wurde aus der Zusammenfassung des Heap-Snapshots (340200025) entfernt.
• Netzwerk: Es wurde ein Fehler behoben, der die Vorschau von Streaming-Antwortinhalten für Anfragen verhinderte, die gerade gestartet, aber noch kein responseReceived-Ereignis erhalten haben (338340752).
• Leistung:
  • Selektorstatistiken: Es wurde eine erklärende Kurzinfo für die Spalte %-of-Slow-Path-Non-Matches hinzugefügt (324282954).
  • Konfigurationsmodus für Tracks: Die Schaltfläche Konfiguration von Tracks abschließen wurde nach unten rechts verschoben (345256274).
• Konsole: Ein Fehler wurde behoben, bei dem bei der Navigation über den Back-Forward-Cache mehrere identische Konsolennachrichten angezeigt wurden (40894153).
• Einstellungen: Hilfssymbole wurden neben allen Tabs hinzugefügt.

Vorschaukanäle herunterladen

Sie können Canary, Dev oder Beta als Standardbrowser für die Entwicklung verwenden. Über diese Vorschaukanäle erhalten Sie Zugriff auf die neuesten Entwicklertools, können innovative Webplattform-APIs testen und Probleme auf Ihrer Website erkennen, bevor Ihre 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 > 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