Neu in den DevTools, Chrome 142

Matthias Rohmer

Codevorschläge von Gemini

Sie können jetzt KI-generierte Vorschläge für die automatische Vervollständigung im Bereich Konsole und Quellen erhalten.

Funktion für Codevorschläge in den Bereichen „Konsole“ und „Quellen“

Wenn Sie diese Funktion aktivieren möchten, gehen Sie zu Einstellungen > KI-Innovationen und aktivieren Sie Codevorschläge.

Verbesserungen für den MCP-Server der Entwicklertools

Seit der Einführung der öffentlichen Vorabversion des DevTools-MCP-Servers mit Version 0.2.1 haben wir verschiedene Verbesserungen vorgenommen, die auf Beiträgen der Community basieren, und Version 0.9.0 veröffentlicht.

  • Die Unterstützung für Node.js wurde auf Node.js 20 ausgeweitet.
  • Netzwerkanfragen und Konsolennachrichten können paginiert werden, um Tokens zu sparen, und nach Anfragetyp (z. B. Skripts, Stylesheets, Bilder) und Nachrichtentyp (Log, Warnung, Fehler) gefiltert werden.
  • Screenshots können in einem bestimmten Pfad und in verschiedenen Formaten ausgegeben werden.
  • Mit konfigurierbaren Tool-Kategorien können Sie festlegen, welche Funktionen verfügbar sind, und so unnötige Störungen reduzieren.
  • Sie können jetzt Startargumente an die Chrome-Instanz übergeben, die vom MCP-Server verwendet wird.

Eine vollständige Liste der Änderungen und Fehlerkorrekturen finden Sie im öffentlichen Changelog auf GitHub. Weitere Informationen zum DevTools-MCP-Server finden Sie im Ankündigungsblogpost.

Schnellerer Zugriff auf KI‑Unterstützung

DevTools enthält jetzt mehr Links, über die die KI-Unterstützung geöffnet wird. Das Kontextmenüelement KI fragen wurde in Mit KI debuggen umbenannt und um direkte Aktionen ergänzt, bei denen KI Ihnen je nach Kontext helfen kann.

Mit der zusätzlichen neuen Schaltfläche oben rechts in den Entwicklertools können Sie KI-Unterstützung von überall in den Entwicklertools aus öffnen.

Die neuen Einstiegspunkte für KI-Unterstützung in den Entwicklertools

Vollständigen Leistungs-Trace mit Gemini debuggen

Nachdem Sie einen Trace im Bereich Leistung aufgezeichnet haben, können Sie sich jetzt mit Gemini über den gesamten Trace, zugehörige Leistungsstatistiken und Felddaten unterhalten, ohne vorher einen bestimmten Kontext auszuwählen. Das alles ist in derselben Unterhaltung möglich. So können Sie Leistungsprobleme ganzheitlicher betrachten, bevor Sie sich genauer damit befassen.

Nachdem Sie mit Gemini ein potenzielles Problem identifiziert haben, können Sie nahtlos ein spezifischeres Kontext-Element wie ein Trace-Ereignis oder einen Leistungs-Insight zur genaueren Untersuchung auswählen und denselben Chat fortsetzen.

Ebenso können Sie sich mit Gemini über alle Statistiken unter Leistung > Statistiken unterhalten.

Ausrichtung der Leiste umschalten

Die Schublade kann jetzt auch an die Seite verschoben werden. So können Sie die Bereiche nebeneinander statt übereinander anzeigen lassen. Klicken Sie in der Haupt-Tab-Leiste mit der rechten Maustaste auf den Namen eines Steuerfelds und wählen Sie In Schublade verschieben aus, um das ausgewählte Steuerfeld in die Schublade zu verschieben.

Über ⋮ > Weitere Tools können Sie dem Drawer weitere Bereiche hinzufügen.

Neuer Schalter in der Leiste zum Ändern der Ausrichtung

Google Developer Program

Das Google Developer Program ist jetzt in die DevTools integriert. Es gibt direkte Links für die Profilverwaltung und neue Badges, die Sie sich verdienen können.

Steuerelemente für das Google-Entwicklerprofil in den Einstellungen der Entwicklertools

Diese Funktion wird nach und nach eingeführt und ist möglicherweise noch nicht für Sie verfügbar.

Abzeichen sind eine optionale Funktion. Wenn Sie Abzeichen aktivieren möchten, gehen Sie zu Einstellungen > Einstellungen > Konto und aktivieren Sie Abzeichen verdienen.

Sonstige Highlights

Im Folgenden finden Sie einige der vielen wichtigen Fehlerbehebungen und Verbesserungen in dieser Version:

  • Im Bereich Anwendung wird jetzt die Speicherprüfung für alle Worker-Typen unterstützt, einschließlich Service Workern, Shared Workern und Dedicated Workern.
  • :target-current wird jetzt im Bereich Stile angezeigt.
  • Im Bereich Netzwerk können Anfragen jetzt anhand eines neuen booleschen Werts Is ad-related gefiltert werden.

Vorschaukanäle herunterladen

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

Chrome-Entwicklertools-Team kontaktieren

Verwenden Sie die folgenden Optionen, um über die neuen Funktionen, Updates oder alles andere im Zusammenhang mit den Entwicklertools zu sprechen.

Neu in den Entwicklertools

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