Neuigkeiten in DevTools (Microsoft Edge 106)

Dies sind die neuesten DevTools-Features in der stabilen Version von Microsoft Edge.

Video: Neuigkeiten in DevTools 106

Einführung in die Befehlspalette

Das Befehlspaletten-Experiment wurde in Microsoft Edge 123 entfernt.

In Microsoft Edge 106 können Sie jetzt das Befehlspaletten-Experiment aktivieren und verwenden. Die Befehlspalette ermöglicht den Zugriff auf Browserverwaltungs- und Entwicklertools Befehle mit nur einer Tastenkombination: STRG+UMSCHALT+LEERTASTE.

So aktivieren Sie das Befehlspaletten-Experiment:

1. Gehen Sie zu edge://flags. Beginnen Sie dann im Textfeld "Kennzeichnungen suchen " mit der Eingabe von Befehlspalette.

2. Wählen Sie im Dropdownmenü der Befehlspalettedie Option Aktiviert aus:

   

   Beachten Sie die Tastenkombination, die im Abschnitt Befehlspalette auf der edge://flags Seite angezeigt wird.

3. Klicken Sie auf die Schaltfläche Neustart , die unten rechts angezeigt wird, wenn Sie "Aktiviert" auswählen.

So greifen Sie schnell auf die verfügbaren Browserverwaltungsbefehle und DevTools-Befehle zu, nachdem Sie das Experiment aktiviert haben:

1. Drücken Sie in Microsoft Edge (mit oder ohne geöffnete DevTools) STRG+UMSCHALT+LEERTASTE.

2. Geben Sie Text ein. Die Befehle werden basierend auf Ihren Eingabezeichen gefiltert und in Kategorien wie Vorschläge, Verlauf und DevTools gruppiert:

   

3. Wenn Sie die Filterung auf die Liste nur von DevTools-Befehlen eingrenzen möchten, geben Sie das Zeichen "Größer als" (>) ein:

   

Teilen Sie uns mit, welche Befehle Sie in zukünftigen Versionen von Microsoft Edge sehen möchten, indem Sie einen Kommentar in Ausgabe 73 posten: [feedback] Befehlspalettenexperiment im MicrosoftEdge/DevTools-Repository !

Codeprobleme in DevTools für Visual Studio Code filtern und automatisch beheben

Die Microsoft Edge DevTools-Erweiterung für Visual Studio Code bietet jetzt Optionen für die schnelle Fehlerkorrektur , mit denen Sie Probleme automatisch beheben können.

So greifen Sie auf die Optionen für die schnelle Problembehebung zu:

1. Zeigen Sie auf ein Problem, das von der DevTools-Erweiterung gemeldet wird, angezeigt durch eine wellenförmige Unterstreichung in Ihrem Code. Neben dem Problem wird ein Glühbirnensymbol angezeigt.

2. Klicken Sie auf das Glühbirnensymbol. Das Menü "Schnelle Lösung " wird angezeigt:

   

3. Wählen Sie die schnelle Lösung aus, die Sie verwenden möchten, um das Problem zu beheben oder das Melden als Problem zu beenden. Wenn Sie auswählen, dass das Problem ignoriert werden soll, wird automatisch eine .hintrc Datei erstellt, die die Erweiterung anweist, diesen Problemtyp zu ignorieren und es nicht erneut zu melden.

Siehe auch:

• Automatisierte Quick Fixes und Problemfilterung in Inline- und Live-Problemanalyse

DevTools verwendet jetzt weniger Speicherplatz beim Zwischenspeichern von Sourcemaps

Ab Microsoft Edge 101 beginnt DevTools mit dem Zwischenspeichern von Sourcemaps in IndexedDB, um die Anzahl der Netzwerkanforderungen zum Abrufen Ihrer Sourcemaps zu reduzieren. Diese Änderung kann jedoch potenziell viel Speicherplatz beanspruchen, wenn diese Sourcemaps nie entfernt werden.

In Microsoft Edge 106 wurde dieses Problem behoben, indem alle Sourcemaps, auf die seit 30 Tagen nicht zugegriffen wurde, aus dem IndexedDB-Speicher entfernt wurden. Darüber hinaus werden auch Sourcemaps, die von bereitgestellt localhost werden, nicht mehr zwischengespeichert. Vielen Dank für Ihr Feedback zu diesem Problem!

Wenn Sie verstehen möchten, wie DevTools Ihre Sourcemaps abruft und zwischenspeichert, sehen Sie sich die Spalte "Status laden" im Tool "Source-Map-Monitor an". Wenn du die Webseite zum ersten Mal lädst, zeigt das Tool Source-Map-Monitor an, dass die Source-Maps noch nicht zwischengespeichert sind:

Wenn Sie die Webseite aktualisieren, zeigt das Tool Source Maps Monitor , dass die zwischengespeicherten Source-Maps verwendet werden:

Um den IndexedDB-Cache zu leeren und DevTools zu zwingen, Sourcemaps erneut zu laden, führen Sie den Befehl Source Maps Cache löschen im Befehlsmenü aus. Siehe Ausführen von Befehlen im Befehlsmenü.

Zur Geschichte siehe Ausgabe 89.

Siehe auch:

• Quellzuordnungen werden jetzt mit IndexedDB in Neuigkeiten in DevTools (Microsoft Edge 101) zwischengespeichert.

Chromium-Farbdesigns sind veraltet

Zur Verbesserung der Zuverlässigkeit wurden die Designs "Chromium Hell" und "Chromium Dunkel" entfernt. Benutzer, die diese Designs zuvor ausgewählt hatten, werden automatisch zum Light + - bzw. Dark+ -Design migriert:

DevTools im Light+ -Design:

DevTools im Dark+ -Design:

Es stehen viele DevTools-Farbdesigns zur Auswahl, z. B. Monokai und Solarized. Um das Farbdesign in DevTools zu ändern, klicken Sie auf die Schaltfläche Einstellungen ("), und wählen Sie dann auf der Seite "Einstellungen " im Dropdownmenü "Design " ein Design aus:

Verbesserungen der Barrierefreiheit im Fokusmodus und im Modus für hohen Kontrast

Die Schaltflächen "Dockingstation" und "Aktivitätsleiste" im Fokusmodus funktionieren jetzt besser mit Sprachausgaben

In Microsoft Edge 105 wurden mehrere Verbesserungen für den Fokusmodus vorgenommen, darunter neue Schaltflächen für die Position der Dockingstation und der Aktivitätsleiste . In Microsoft Edge 106 funktionieren diese neuen Schaltflächen jetzt besser mit Hilfstechnologien wie Sprachausgaben.

Sprachausgaben kündigen jetzt an, welche Schaltfläche zum Andocken oder welche Schaltfläche der Aktivitätsleiste gerade ausgewählt ist, sowie die Anzahl der Schaltflächen, die die verfügbaren Standortoptionen darstellen:

Siehe auch:

• Navigieren Sie in DevTools mit Hilfstechnologie
• Fokusmodus: Verbesserte Standortsteuerung für DevTools, Aktivitätsleiste und Schnellansicht in Neuigkeiten in DevTools (Microsoft Edge 105).

Berechnete Formatvorlagen sind im Modus für hohen Kontrast einfacher zu erkennen

Im Modus für hohen Kontrast wurden in früheren Versionen von Microsoft Edge die Schaltflächen zum Erweitern und Reduzieren für berechnete Formatvorlagen auf der Registerkarte "Berechnet" im Tool "Elemente" nicht ordnungsgemäß gerendert. In Microsoft Edge 106 wurde dieses Problem behoben. Die Schaltflächen zum Erweitern und Reduzieren sind jetzt im Modus für hohen Kontrast sichtbar:

Siehe auch:

• Windows-Modus für hohen Kontrast

Ankündigungen aus dem Chromium-Projekt

Microsoft Edge 106 enthält auch die folgenden Updates aus dem Chromium-Projekt:

• Gruppieren von Dateien nach "Erstellt/Bereitgestellt" im Quellenbereich
• Verbesserte Stapelüberwachungen
  • Verknüpfte Stapelüberwachungen für asynchrone Vorgänge
  • Automatisches Ignorieren bekannter Skripte von Drittanbietern
• Verbesserte Aufrufliste während des Debuggens
• Ausblenden von ignorierten Quellen im Quellenbereich
• Ausblenden von Dateien, die nicht in der Liste aufgeführt sind, im Befehlsmenü
• Neue Interaktionsspur im Leistungsbereich

Siehe auch

• Neuerungen in den Microsoft Edge-DevTools
• Versionshinweise für die Microsoft Edge-Webplattform