Nouveautés des outils de développement (Chrome 107)

Personnaliser les raccourcis clavier dans les outils de développement

Vous pouvez désormais personnaliser les raccourcis clavier pour vos commandes préférées dans les outils de développement.

Accédez à Paramètres > Raccourcis, pointez sur une commande et cliquez sur le bouton Modifier (icône en forme de crayon) pour personnaliser le raccourci clavier. Vous pouvez également créer des accords (c'est-à-dire des raccourcis à plusieurs touches).

Personnalisez les raccourcis clavier dans les outils de développement.

Problèmes Chromium: 1335274, 174309

Basculer entre les thèmes clair et sombre avec le raccourci clavier

Configurez un raccourci clavier pour activer/désactiver facilement le thème clair et le thème sombre. Par défaut, l'action n'est associée à aucun raccourci clavier.

Activez/Désactivez le thème clair et le thème sombre à l'aide d'un raccourci clavier.

Problèmes Chromium: 1280398, 1226363

Mettre en surbrillance les objets C/C++ dans l'outil d'inspection de mémoire

L'outil d'inspection de mémoire met en évidence tous les octets d'un objet mémoire C/C++.

Reconnaître les octets d'un objet dans la mémoire WebAssembly environnante était un véritable problème. Vous devez connaître la taille de l'objet et le nombre d'octets à partir du début de l'objet.

Grâce à cette fonctionnalité, vous pouvez les distinguer de la mémoire environnante. Pour en savoir plus sur les modifications, consultez la section Étendre l'outil d'inspection de mémoire pour le débogage C/C++.

Mettez en surbrillance les objets C/C++ dans l'outil d'inspection de mémoire.

Problème Chromium: 1336568

Prise en charge des informations complètes concernant l'initiateur pour l'importation du fichier HAR

Toutes les informations sur le initiateur sont maintenant disponibles pour l'importation du fichier HAR. Auparavant, le panneau Network (Réseau) n'affiche que des informations partielles sur l'initiateur lors de l'importation.

Les informations de l'initiateur aident les développeurs à retracer l'origine d'une requête réseau et à identifier les problèmes liés au réseau.

Prise en charge des informations complètes concernant l'initiateur pour l'importation du fichier HAR.

Problème Chromium: 1343185

Lancer une recherche DOM après avoir appuyé sur Enter

Vous pouvez désormais désactiver le paramètre Rechercher en cours de saisie pour toujours lancer la recherche DOM une fois que vous avez appuyé sur Entrée.

Dans le panneau Éléments, activez ou désactivez la barre de recherche avec Ctrl ou Commande+F. À mesure que vous saisissez une requête dans la zone de recherche, l'arborescence DOM passe au premier élément correspondant et le met en surbrillance par défaut.

Ce comportement n'est pas idéal pour les utilisateurs, en particulier ceux qui travaillent toujours avec des requêtes de recherche longues. L'arborescence DOM peut sauter plusieurs fois lorsque vous saisissez une longue requête de recherche (par exemple, //div[@id="example"]). Cela crée un mouvement inutile.

Recherche DOM

Accédez à Paramètres > Préférences : désactivez l'option Rechercher en cours de saisie. Avec cette modification, la recherche ne commencera que lorsque vous aurez appuyé sur Entrée.

Paramètre de recherche pendant la saisie.

Problème Chromium: 1344526

Afficher les icônes start et end pour les propriétés Flexbox CSS de align-content

Dans le volet Styles, modifiez les propriétés align-content d'une classe CSS avec display: flex ou display: inline-flex. Les icônes start et end s'affichent dans le menu déroulant de saisie semi-automatique.

les propriétés Flexbox align-content.

Problème Chromium: 1139945

Points importants divers

  • Affichez le nombre correct de messages dans la barre latérale de la console. Auparavant, les décomptes n'étaient pas actualisés lors de l'effacement des messages de la console. (1343311).

Télécharger les canaux de prévisualisation

Vous pouvez utiliser Chrome Canary, Dev ou Bêta comme navigateur de développement par défaut. Ces versions preview vous permettent d'accéder aux dernières fonctionnalités des outils de développement, de tester des API de plates-formes Web de pointe et de 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 et des modifications dans l'article, ou de tout autre sujet lié aux outils de développement.

  • Envoyez-nous vos suggestions ou vos commentaires via crbug.com.
  • Signalez un problème lié aux outils de développement en cliquant sur Autres options   Plus > Aide > Signalez un problème dans les outils de développement.
  • Tweetez à l'adresse @ChromeDevTools.
  • Faites-nous part de vos commentaires sur les vidéos YouTube sur les nouveautés des outils de développement ou sur les vidéos YouTube de conseils pour les outils de développement.

Nouveautés des outils de développement

Liste de tous les sujets abordés dans la série Nouveautés concernant les outils de développement