Utilisez le nouveau menu contextuel du panneau DOM pour modifier efficacement les nœuds. Déboguer les nœuds de calcul de services directement via le panneau "Ressources". Choisissez parmi toutes les nuances de Material Design dans le sélecteur de couleur. Bibliothèques JavaScript en boîte noire plus facilement.
Nouveau menu contextuel amélioré du panneau DOM
Après avoir analysé les actions les plus utilisées dans le panneau DOM, nous avons conclu que le menu contextuel du clic droit devait être épuré et réorganisé.
Il est désormais beaucoup plus facile de masquer ou de supprimer rapidement un élément, de déclencher un état spécifique tel que :active ou :hover, ou de modifier son code HTML. Si vous utilisez un pavé tactile et que vous ne voulez pas faire un clic droit, cliquez plutôt sur les trois petits points à côté de l'élément sélectionné.
Déboguer des service workers via le panneau "Ressources"
Les services workers sont fantastiques une fois configurés, mais ils peuvent être difficiles à comprendre au début. Le fait qu'il soit nécessaire de quitter les outils pour les développeurs et d'ouvrir chrome://serviceworker-internals/ dans une nouvelle fenêtre de navigateur pour les déboguer aggravait la situation.
Ce n'est plus le cas ! Vous pouvez désormais déboguer les services workers du domaine actuel directement depuis le panneau "Ressources". Ce processus est encore en cours, mais il représente déjà une nette amélioration par rapport à l'ancien état des choses.
Toutes les couleurs: nuances Material Design dans le sélecteur de couleurs
Il y a quelques semaines, nous avons ajouté la palette Material Design au sélecteur de couleurs pour vous proposer des couleurs primaires et audacieuses prêtes à l'emploi. Pour concevoir une page complète, vous avez inévitablement besoin d'un accès complet à toutes les nuances de Material Design. Nous les avons donc intégrées.
Pour afficher les nuances, appuyez de manière prolongée sur l'une des couleurs primaires, puis cliquez sur une nuance.
Bibliothèques JavaScript en boîte noire plus facilement dans les paramètres
Le blackboxing JavaScript existe depuis un certain temps, mais n'était pas très facile à découvrir. Il s'agit d'une fonctionnalité qui vous permet de placer un script dans une boîte noire sur une page afin de vous concentrer uniquement sur le code que vous avez créé (et de masquer tout le code d'encapsulation).
Nous l'avons maintenant déplacée dans les paramètres. Essayez cette commande :
Le meilleur des autres
- Vous ne pouvez pas accéder aux boutons d'activation/de désactivation du rendu ? Les paramètres de rendu ont été déplacés dans le menu principal de DevTools (sous "Autres outils"). En plus des éléments habituels (par exemple, le compteur de FPS), nous y avons également déplacé "Émuler les supports d'impression".
- Vous en avez assez de saisir chrome://inspect dans l'Omnibox ? Inspecter les appareils est désormais également disponible dans le nouveau menu principal, sous "Autres outils".
- Avez-vous fermé par erreur l'un des onglets du panneau de navigation pouvant être fermés, comme "Rendering" (Affichage) ou "Search" (Recherche) ? Vous pouvez désormais les rouvrir à l'aide du nouveau menu de gauche.
Comme toujours, n'hésitez pas à nous faire part de vos commentaires sur Twitter ou dans les commentaires ci-dessous, et à signaler les bugs sur crbug.com/new.
À bientôt !
Paul Bakaus et l'équipe DevTools