Condensé des outils de développement - Plus de puissance avec le nouveau menu de commandes

Découvrez le nouveau menu de commandes de DevTools et ses plus de 60 actions qui permettent des workflows ultra-rapides.

Cmd/Ctrl+Maj+P pour afficher le menu de commandes

Menu de commandes dans DevTools

La boîte de dialogue "Accéder au fichier" qui s'affiche lorsque vous appuyez sur Cmd + P (ou Ctrl + P) dans le panneau "Sources" n'est pas très connue, mais elle existe depuis un certain temps. Nous sommes allés beaucoup plus loin et avons développé un menu de commandes inspiré d'un éditeur de texte qui peut gérer presque toutes les actions importantes dans DevTools.

Appuyez sur Cmd + Shift + P (ou Ctrl + Shift + P) n'importe où (même lorsque la page est active) pour afficher le menu de commande, puis saisissez un filtre et appuyez sur Enter pour déclencher l'action. Voici quelques exemples d'actions que vous pouvez essayer:

  • Apparence: passer au thème sombre
  • Outils de développement: Épingler en bas
  • Mobile: Inspecter les appareils…
  • Réseau: passer hors connexion

Le nouveau menu de commande est un moyen très rapide de naviguer et de découvrir de nouveaux paramètres et actions dans les outils de développement.

Vous recherchez la bonne vieille boîte de dialogue "Accéder au membre" qui était également associée à ce raccourci ? Il est toujours là, il vous suffit d'appuyer sur Cmd + Shift + O (ou Ctrl + Shift + O) à partir de maintenant.

Impression élégante du code HTML

HTML mis en forme.

La mise en forme pour les sources JS et CSS est intégrée au panneau "Sources" depuis un certain temps, mais nous venons de l'étendre pour qu'elle prenne en charge la mise en forme HTML complète. Essayez-le : il reformate non seulement le code HTML, mais aussi le code JavaScript et CSS qu'il contient.


Comme toujours, n'hésitez pas à nous faire part de vos commentaires sur Twitter ou dans les commentaires ci-dessous, et signalez les bugs sur crbug.com/new.

À bientôt ! Paul Bakaus et l'équipe DevTools