Nouveautés de DevTools (Microsoft Edge 100)

Il s’agit des dernières fonctionnalités DevTools de la version stable de Microsoft Edge.

Vidéo : Microsoft Edge | Nouveautés de DevTools 100

Rejoignez la communauté Microsoft Edge DevTools sur GitHub

Nous sommes ravis d’annoncer le nouveau référentiel MicrosoftEdge > DevTools sur GitHub ! Ce nouveau référentiel est un emplacement où notre communauté de développeurs peut nous envoyer des idées, des commentaires, des suggestions et des conseils pour améliorer DevTools. Nous sommes impatients de discuter avec vous de la façon dont DevTools peut mieux répondre à vos besoins et relever les défis auxquels vous êtes confrontés chaque jour dans la création d’expériences Web exceptionnelles.

Rendez-vous sur notre référentiel DevTools sur GitHub pour faire partie de la communauté Edge DevTools.

Filtrer les instantanés de segment de mémoire par type de nœud

Lors de l’examen de tous les objets dans un instantané de tas dans l’outil Mémoire, il peut être difficile de se concentrer sur des objets spécifiques ou de conserver des chemins. Désormais, dans Microsoft Edge 100, vous pouvez utiliser le nouveau filtre Types de nœuds lors de l’examen d’un instantané de tas, pour vous concentrer uniquement sur des types spécifiques de nœuds. Par exemple, pour afficher uniquement les tableaux et les objets chaîne qui se trouvent dans le tas, sélectionnez les entrées Tableau et Chaîne dans le filtre Types de nœuds :

Voir aussi :

• Enregistrer des instantanés de tas à l’aide de l’outil Mémoire (type de profilage « instantané de tas ») : prise d’un instantané de tas et analyse du tas

Utiliser DevTools en tchèque et en vietnamien

La personnalisation et la simplification de l’expérience des développeurs incluent la mise à la disposition de tous, quelle que soit leur langue préférée. Nous avons ajouté deux nouvelles langues, le tchèque et le vietnamien, à notre liste de langues prises en charge, et nous continuerons d’en ajouter d’autres. Si votre langue préférée n’est pas prise en charge dans DevTools, faites-le nous savoir !

Voir aussi :

• Modifier les paramètres de langue de DevTools

L’outil Réseau affiche désormais la façon dont une demande a été satisfaite

Dans Microsoft Edge 100, l’outil Réseau prend en charge une nouvelle colonne Rempli par dans le journal des demandes. Si la demande a été satisfaite par votre worker du service ou à partir du cache, cette information est désormais suivie dans la colonne Rempli par . Lors de l’exportation ou de l’importation du journal des demandes en tant que HAR fichier, les informations de la colonne Rempli par sont également incluses.

Voir aussi :

• Filtrer les demandes par propriétés dans la référence des fonctionnalités réseau.

Pour l’historique de cette fonctionnalité, voir le problème #16.

Filtrer les messages de l’outil Problèmes par gravité et cible de navigateur

Dans l’outil Problèmes , les nouvelles listes déroulantes de gravité et de navigateur vous permettent de filtrer les messages par gravité et cible de navigateur, afin de vous aider à vous concentrer sur les commentaires les plus pertinents. Vous pouvez sélectionner ou effacer les options dans chaque liste déroulante.

Pour afficher tous les messages pertinents, vous devrez peut-être actualiser la page. Si vous y êtes invité, dans l’outil Problèmes , cliquez sur le bouton Régénérer les problèmes .

Par défaut, le filtre de gravité est défini pour afficher uniquement les avertissements et les erreurs :

Le filtre du navigateur s’applique uniquement aux commentaires de compatibilité du navigateur, qui sont affichés dans la section Compatibilité de la liste des problèmes . Par défaut, le filtre du navigateur affiche les messages des principaux navigateurs, tels que définis par Browserslist :

Dans l’exemple suivant, les messages concernant Firefox et Firefox pour Android sont filtrés :

Voir aussi :

• Filtrer les problèmes dans Rechercher et résoudre des problèmes à l’aide de l’outil Problèmes.

Lors de l’importation d’un profil de performances, les liens correspondent désormais à votre code d’origine

Lors de l’enregistrement d’un profil de performances, le graphique en flammes de l’outil Performances affiche les liens de chaque événement sur le thread principal vers la fonction JavaScript correspondante dans l’outil Sources . Toutefois, ces liens sont rompus lorsque vous exportez et importez un profil de performances.

Dans Microsoft Edge 100, les liens d’un profil de performances importé utilisent désormais des cartes sources du serveur de symboles Azure Artifacts pour remonter à votre code source d’origine. Le profil de performances doit avoir été exporté dans Microsoft Edge 100 (ou version ultérieure), afin que le profil inclut les informations nécessaires à la résolution des mappages sources dans le suivi des performances exporté.

Voir aussi :

• Mettez en correspondance le code traité avec votre code source original, pour le débogage
• Déboguer en toute sécurité le code original en publiant des cartes de sources sur le serveur de symboles Azure Artifacts
• Déboguer en toute sécurité le code original en utilisant les cartes sources du serveur de symboles Azure Artifacts

Correctif : la vue en cascade dans l’outil Réseau correspond désormais aux thèmes de Visual Studio Code

Mise à jour : à partir de la version 131 de Microsoft Edge, la fonctionnalité de thèmes de Visual Studio Code est supprimée et ces thèmes reviennent aux thèmes par défaut :

• Clair+
• Foncé+

Dans les versions précédentes de Microsoft Edge, l’affichage en cascade des demandes dans l’outil Réseau ne correspondait pas aux thèmes de Visual Studio Code qui s’appliquent au reste de DevTools. Dans Microsoft Edge 100, ce problème a été résolu.

Avant Microsoft Edge 100, le thème sélectionné n’était pas appliqué dans la vue en cascade :

Désormais, dans Microsoft Edge 100, le thème sélectionné est appliqué à l’affichage en cascade des demandes dans l’outil Réseau :

Voir aussi :

• Affichez la relation temporelle des demandes dans la référence desfonctionnalités réseau - la vue en cascade pour les demandes dans l’outil Réseau.

Annonces du projet Chromium

Microsoft Edge version 100 inclut également les mises à jour suivantes du projet Chromium :

• View and edit @supports at rules in the Styles pane
• Aperçu des propriétés de classe/fonction au survol
• Images partiellement présentées dans le panneau Performance

Voir aussi

• Nouveautés de Microsoft Edge DevTools
• Notes de publication pour la plateforme web Microsoft Edge