Neuerungen in DevTools (Microsoft Edge 111)
Lesen Sie diese Ankündigungen, um die neuesten Features von Microsoft Edge DevTools und die Microsoft Edge DevTools-Erweiterung für Microsoft Visual Studio Code und Visual Studio zu testen.
Um auf dem Laufenden zu bleiben und die neuesten DevTools-Features zu erhalten, laden Sie eine Insider Preview-Version von Microsoft Edge herunter. Unabhängig davon, ob Sie Windows, Linux oder macOS verwenden, sollten Sie Canary (oder einen anderen Vorschaukanal) als Standardentwicklungsbrowser verwenden. Die Beta-, Dev- und Canary-Versionen von Microsoft Edge werden als separate Apps parallel zur stabilen, veröffentlichten Version von Microsoft Edge ausgeführt. Siehe Microsoft Edge Insider Channels.
Die neuesten Ankündigungen finden Sie, wenn Sie dem Microsoft Edge-Team auf Twitter folgen. Wenn Sie ein Problem mit DevTools melden oder nach einem neuen Feature fragen möchten, melden Sie ein Problem im Repository MicrosoftEdge/DevTools.
Video: Neuerungen in DevTools 111
Remotedebuggen von Microsoft Edge-, PWAs- und WebView2-Steuerelementen auf HoloLens 2-Geräten
Die App Remotetools für Microsoft Edge ist jetzt auf HoloLens 2-Geräten verfügbar. Die Remotetools für Microsoft Edge-App ist ein Plug-In für das Windows-Geräteportal für Desktop , das Das Remotedebuggen für Registerkarten in Microsoft Edge, Progressive Web Apps (PWAs) und WebView2-Steuerelementen ermöglicht. Mithilfe des Remotedebuggens können Sie Webinhalte auf einem Remotegerät ausführen und direkt von Ihrem Entwicklungscomputer aus debuggen.
Wenn das Remotedebuggen aktiviert ist, müssen Sie DevTools nicht mehr auf HoloLens 2-Geräten öffnen. Stattdessen können Sie über das Geräteportal eine Verbindung mit dem HoloLens 2-Remotegerät herstellen, die edge://inspect Seite öffnen und dann das Ziel (Registerkarte, PWA oder WebView2-Steuerelement) auswählen, das Sie mit DevTools verwenden möchten.
Um uns Feedback zum Remotedebugflow für Microsoft Edge zu geben, hinterlassen Sie einen Kommentar unter Problem 136: Remotedebuggen von HoloLens 2-Geräten ist jetzt mit der neuesten Version der Remotetools für Microsoft Edge-App verfügbar.
Siehe auch:
- Remotedebuggen von Windows-Geräten
- Windows-Geräteportal für Desktop
- Remotedebuggen von HoloLens 2 WebView2 WinUI 2-Apps (UWP)
Die Symbolleiste "Gerätemodus" enthält Emulationssteuerelemente für Designs und Sehfehler
In früheren Versionen von Microsoft Edge würden Sie zum Emulieren verschiedener Designs oder Sehschwächen das Rendering-Tool verwenden, um beispielsweise Achromatopsie zu emulieren. Dies ist der Fall, wenn der Benutzer keine Farbe wahrnehmen kann.
In Microsoft Edge 111 können Sie jetzt direkt über die Symbolleiste Gerätemodus auf diese Design- und Sehfehler-Emulationssteuerelemente zugreifen, zusätzlich zum Renderingtool .
So emulieren Sie beispielsweise den Modus für hohen Kontrast und testen, wie Ihre Webinhalte reagieren:
- Klicken Sie auf der Symbolleiste Gerätemodus rechts neben der Dropdownliste Drosselung auf Medienfeatures emulieren (Eyedroppersymbol,
). - Wählen Sie erzwungene Farben: aktiv aus:
Sie können auch Sehschwächen emulieren, indem Sie auf das Augensymbol neben dem Pipettensymbol klicken. So emulieren Sie beispielsweise verschwommenes Sehen:
- Klicken Sie auf Sehschwäche emulieren (Augensymbol,
). - Wählen Sie Verschwommenes Sehen aus:
Siehe auch:
- Emulieren mobiler Geräte (Geräteemulation)
- Überprüfen auf Kontrastprobleme mit dunklem design und hellem Design
- Emulieren von Sehschwächen
Das Leistungstool entminimiert Datei- und Funktionsnamen bei der Profilerstellung von Produktionscode
Microsoft Edge 99 hat dem Leistungstool ein neues Feature namens Unminify hinzugefügt. Dieses Feature zum Aufheben der Minimierung hat Sourcemaps auf ein Profil angewendet, das mit dem Leistungstool aufgezeichnet wurde, und das nicht minimierte Profil dann auf Ihren Computer heruntergeladen. Das Feature "Unminify " wird unter Verwenden Ihrer Quellzuordnungen zum Anzeigen von ursprünglichen Funktionsnamen in Leistungsprofilen in Neuerungen in DevTools (Microsoft Edge 99) beschrieben.
In Microsoft Edge 111 wurde dieses Feature entfernt, da das Leistungstool jetzt automatisch die ursprünglichen Datei- und Funktionsnamen während der Profilerstellung von Produktionscode bereitstellt, solange Quellzuordnungen geladen werden. Quellzuordnungen können zuverlässig und sicher geladen werden, indem sie auf dem Azure Artifacts-Symbolserver gehostet werden.
In der folgenden Abbildung sehen Sie minimierte Funktionsnamen im Flammendiagramm bei der Profilerstellung von Produktionscode:
Jetzt in Microsoft Edge 111 entminimiert das Leistungstool automatisch Funktionsnamen im Flammendiagramm, wenn die Profilerstellung für Produktionscode erstellt wird:
Siehe auch:
- Sicheres Debuggen von Originalcode durch Veröffentlichen von Quellzuordnungen auf dem Azure Artifacts-Symbolserver
- Sicheres Debuggen von originalem Code mithilfe von Quellzuordnungen für Azure Artifacts-Symbolserver
- Aufzeichnen der Leistung in der Referenz zu Leistungsfeatures.
Der Bereich "Formatvorlagen" ist im Fokusmodus einfacher zu verwenden
In früheren Versionen von Microsoft Edge im Fokusmodus bot das Elementtool keine einfache Möglichkeit, auf alle Registerkarten im Bereich Formatvorlagen zuzugreifen. In Microsoft Edge 111 wurde dieses Problem behoben. Wenn der Bereich Formatvorlagen über einen schmalen Viewport verfügt und nicht alle anderen verfügbaren Registerkarten angezeigt werden können, klicken Sie auf das Erweiterungssymbol Weitere Registerkarten (
):
Wenn Sie nur einige der Registerkarten im Bereich Formatvorlagen anzeigen möchten, klicken Sie auf das Symbol Weitere Registerkarten-Collapseer (
):
Siehe auch:
Kopieren der Tabelle "Selector Stats" aus dem Leistungstool nach Excel
In Microsoft Edge 109 wurde das Feature Selector Stats im Leistungstool eingeführt. Wenn die Einstellung Erweiterte Renderinginstrumentierung aktivieren (langsam) aktivieren im Leistungstool aktiviert ist, wird im unteren Bereich durch Auswählen eines beliebigen Ereignisses Formatvorlagen neu berechnen im Flammendiagramm die Registerkarte Selector Stats (Selector Stats ) hinzugefügt. Weitere Informationen finden Sie unter Debug long-running Recalculate Style events with new selector stats in What's New in DevTools (Microsoft Edge 109).
In Microsoft Edge 111 können Sie jetzt die Tabelle Selector Stats für jedes Recalculate Styles-Ereignis in eine Microsoft Excel-Arbeitsmappe exportieren. Anschließend können Sie Excel verwenden, um die Leistungsanalyse des Aggregatselektors durchzuführen und die teuersten Selektoren während der Lebensdauer des Profils zu identifizieren.
So exportieren Sie die Tabelle Selector Stats
- Klicken Sie mit der Maus auf die zelle oben links, und ziehen Sie dann, um sie in die untere rechte Zelle auszuwählen.
- Klicken Sie mit der rechten Maustaste auf die Tabelle, und wählen Sie dann Kopieren aus. Oder drücken Sie STRG+C (Windows, Linux) oder BEFEHL+C (macOS).
- Fügen Sie die Tabelle in Excel ein.
Siehe auch:
Im Fokusmodus liest die Hilfstechnologie vor, wenn Sie ein Tool in die Schnellansicht verschieben.
In früheren Versionen von Microsoft Edge haben Hilfstechnologien, z. B. Sprachausgaben, keine Bestätigung angekündigt, wenn ein Tool von der Aktivitätsleiste in die Symbolleiste für die Schnellansicht verschoben wurde. In Microsoft Edge 111 wurde dieses Problem behoben. Sprachausgaben kündigen jetzt "Netzwerk erfolgreich zur Schnellansicht hinzugefügt" an, wenn Sie das Netzwerktool von der Aktivitätsleiste in die Symbolleiste " Schnellansicht" verschieben:
Siehe auch:
Ankündigungen aus dem Chromium-Projekt
Microsoft Edge 111 enthält auch die folgenden Updates aus dem Chromium-Projekt: