Nouveautés des outils de développement, Chrome 127

Sofia Emelianova
Sofia Emelianova
GitHub

Pour vous aider à déboguer plus facilement la fonctionnalité de positionnement des ancres, l'onglet Styles associe désormais les identifiants d'ancres explicites et les ancres implicites à leurs nœuds.

Avant et après l'association d'ancres explicites et implicites.

De plus, la valeur de l'attribut popovertarget est désormais associée à son élément popover dans le DOM.

Avant et après l'association de popovertarget à son élément popover.

Améliorations apportées au panneau "Sources"

Cette version apporte plusieurs améliorations au panneau Sources.

Amélioration de "Ne jamais mettre en pause ici"

L'option "Ne jamais mettre en pause ici" vous permet d'empêcher le débogueur de mettre en pause la même ligne de manière répétée. Cela facilite l'utilisation de points d'arrêt non pertinents qui se déclenchent de manière répétée. Cette version améliore cette fonctionnalité, qui est désormais disponible pour :

  • Exceptions ou rejets de promesses provenant de fonctions intégrées.
  • "Annulation" des points d'arrêt DOM, fetch/XHR et de non-respect de la CSP.
  • Dans le désassemblage Wasm.

Voir le workflow en action :

Problème Chromium : 40924349.

Nouveaux écouteurs d'événements scroll-snap

La liste Sources > Event Listener Breakpoints > Control (Sources > Points d'arrêt des écouteurs d'événements > Contrôle) comporte deux écouteurs liés au défilement scroll-snap : scrollsnapchange et scrollsnapchanging. Ces événements se déclenchent lorsque vous faites défiler le conteneur de défilement de manière à ce qu'il s'aligne sur un nouvel élément.

Avant et après l'ajout d'écouteurs d'événements liés au défilement scroll-snap.

Problème Chromium : 40286359.

Améliorations apportées au panneau "Réseau"

Cette version apporte plusieurs améliorations au panneau Réseau.

Préréglages de limitation de bande passante réseau mis à jour

Le panneau Réseau reçoit des préréglages de limitation mis à jour : le nouveau préréglage 4G rapide, 3G rapide renommé 4G lente et 3G lente renommé 3G. Cela correspond mieux aux préréglages de Lighthouse.

Avant et après la mise à jour des préréglages de limitation de bande passante réseau.

Problème Chromium : 342406608.

Informations sur les service workers dans les champs personnalisés du format HAR

Lorsque vous exportez le journal réseau au format HAR, vous pouvez désormais voir les informations liées aux service workers, y compris les codes temporels, sous forme de champs personnalisés (précédés d'un trait de soulignement). Par exemple, vous pouvez trouver les nouveaux champs suivants dans le journal :

...
"response": {
  ...
  "_fetchedViaServiceWorker": true,
  "_responseCacheStorageCacheName": "V1",
  "_serviceWorkerResponseSource": "cache-storage"
}
...
"timings": {
  ...
  "_workerStart": -1,
  "_workerReady": -1,
  "_workerFetchStart": -1,
  "_workerRespondWithSettled": -1
}
...

Problème Chromium : 342406608.

Envoyer et recevoir des événements WebSocket dans le panneau "Performances"

Comme pour les autres événements WebSocket, le panneau Performances capture désormais les événements Envoyer un message WebSocket et Recevoir un message WebSocket, et les affiche dans la trace des performances. Exemple :

Événement "Recevoir un message WebSocket" capturé dans la trace des performances.

Problème Chromium : 40286129.

Autres points marquants

Voici quelques corrections et améliorations notables de cette version :

  • Accessibilité : les lecteurs d'écran annoncent désormais le contenu des messages dans la Console lorsque vous faites défiler le journal à l'aide des touches fléchées vers le haut et vers le bas (344484979).
  • Sources :
    • Page : l'option de menu Enregistrer sous enregistre désormais les fichiers de module Wasm en tant que binaires wasm valides au lieu de texte Base64 (40784130).
    • Pile d'appel : suppression du suffixe (async) des descriptions de frame d'appel asynchrone, et remplacement de la mise en surbrillance en italique par une mise en surbrillance en gras (343750870).
  • Mémoire : suppression de l'élément InternalNodes inutile de taille zéro du résumé de l'instantané de segment de mémoire (340200025).
  • Réseau : correction d'un bug qui empêchait l'aperçu du contenu de la réponse en streaming pour les requêtes qui venaient de démarrer, mais qui n'avaient pas encore reçu d'événement responseReceived (338340752).
  • Performances :
    • Statistiques du sélecteur : ajout d'une info-bulle explicative pour la colonne %-of-Slow-Path-Non-Matches (324282954).
    • Mode de configuration des pistes : le bouton Terminer la configuration des pistes a été déplacé en bas à droite (345256274).
  • Console : correction d'un bug qui affichait plusieurs messages de console identiques lors de la navigation à l'aide du cache avant/arrière (40894153).
  • Paramètres : ajout d'icônes d'aide à côté de tous les onglets.

Télécharger les canaux de prévisualisation

Envisagez d'utiliser Chrome Canary, Dev ou Beta comme navigateur de développement par défaut. Ces canaux de preview vous donnent accès aux dernières fonctionnalités des outils de développement, vous permettent de tester des API de plate-forme Web de pointe et vous aident à détecter les problèmes sur votre site avant vos utilisateurs.

Contacter l'équipe des Outils pour les développeurs Chrome

Utilisez les options suivantes pour discuter des nouvelles fonctionnalités, des mises à jour ou de tout autre sujet lié aux outils de développement.

Nouveautés des outils de développement

Liste de tout ce qui a été abordé dans la série Nouveautés des outils de développement.