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

Jecelyn Yeen

Personnaliser les raccourcis clavier dans les outils de développement

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

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

Personnalisez les raccourcis clavier dans DevTools.

Problèmes Chromium: 1335274, 174309

Basculer entre les thèmes clair et sombre à l'aide d'un raccourci clavier

Configurez un raccourci clavier pour basculer facilement entre les thèmes clair et sombre. Par défaut, l'action n'est associée à aucun raccourci clavier.

Basculez entre les thèmes clair et sombre à l'aide d'un raccourci clavier.

Problèmes Chromium: 1280398, 1226363

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

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

La reconnaissance des octets d'un objet parmi la mémoire WebAssembly environnante était un problème. Vous devez connaître la taille de l'objet et compter les octets à partir de son début.

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

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

Problème Chromium: 1336568

Prise en charge des informations complètes sur l'initiateur pour l'importation de fichiers HAR

Les informations complètes sur l'initiateur sont désormais disponibles pour l'importation de fichiers HAR. Auparavant, le panneau Network (Réseau) n'affichait que des informations partielles sur l'initiateur lors de l'importation.

Les informations sur 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 sur l'initiateur pour l'importation de fichiers HAR.

Problème Chromium: 1343185

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

Vous pouvez désormais désactiver le paramètre Affichage instantané des résultats pour toujours lancer la recherche DOM après avoir appuyé sur Entrée.

Dans le panneau Éléments, activez ou désactivez la barre de recherche à l'aide de Ctrl ou Cmd + F. Lorsque vous saisissez une requête dans la zone de recherche, l'arborescence DOM saute 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 les testeurs qui travaillent toujours avec des requêtes de recherche longues. L'arborescence DOM peut sauter plusieurs fois lorsque vous saisissez une requête de recherche longue (par exemple, //div[@id="example"]). Ce comportement crée un mouvement inutile.

Recherche DOM.

Accédez à Paramètres > Préférences, puis désactivez Rechercher à mesure que vous saisissez du texte. Avec ce changement, la recherche ne commencera qu'après avoir appuyé sur Entrée.

Paramètre "Affichage instantané des résultats".

Problème Chromium: 1344526

Afficher les icônes start et end pour les propriétés CSS flexbox 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 start et end s'affichent dans le menu déroulant de saisie semi-automatique avec des icônes.

Propriétés de la boîte à flex align-content

Problème Chromium: 1139945

Autres points forts

  • Affichage du nombre correct de messages dans la barre latérale de la console. Auparavant, les totaux ne s'actualisaient pas lorsque vous effaciez les messages de la console. (1343311)

Télécharger les canaux de prévisualisation

Envisagez d'utiliser Chrome Canary, Dev ou Bêta comme navigateur de développement par défaut. Ces canaux de prévisualisation vous donnent accès aux dernières fonctionnalités de DevTools, vous permettent de tester les API de plates-formes 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 élément lié aux outils pour les développeurs.

Nouveautés des outils pour les développeurs

Liste de tous les éléments abordés dans la série Nouveautés des outils pour les développeurs.