Récapitulatif des outils de développement, octobre 2016

Bonjour, Kayce est de retour pour vous présenter les nouveautés de DevTools depuis le mois dernier.

Nouvelles fonctionnalités de la console

Dans Chrome 56, qui est actuellement en version Canary, la console DevTools est optimisée par CodeMirror. Cela permet de bénéficier de nombreuses nouvelles fonctionnalités, comme:

La syntaxe du texte mise en surbrillance lors de la saisie : Auparavant, DevTools ne pouvait mettre en surbrillance la syntaxe qu'après l'évaluation d'un bloc de code.

Mise en surbrillance des parenthèses, crochets et accolades correspondantes Si vous avez une parenthèse, un crochet ou une accolade supplémentaire, les outils de développement le mettent en surbrillance en rouge.

parenthèses incohérentes

Les parenthèses, crochets ou accolades correspondants sont mis en surbrillance en gris lorsque le curseur se trouve à côté de l'un d'eux.

parenthèses correspondantes

Renvoi intelligent Lorsque vous saisissez un bloc de code multiligne, DevTools sait désormais s'il doit créer une nouvelle ligne ou exécuter votre code chaque fois que vous appuyez sur Entrée. Par exemple, supposons que vous souhaitiez évaluer la boucle for suivante dans la console:

for (var i = 0; i < 5; i++) {
  console.log(i);
}

Auparavant, appuyer sur Entrée après avoir saisi la première ligne entraînait l'évaluation de la ligne par DevTools, ce qui provoquait une erreur. Pour poursuivre le bloc de code sur une nouvelle ligne, vous devez maintenir la touche Maj enfoncée avant d'appuyer sur Entrée. À l'inverse, DevTools continue automatiquement le bloc de code sur une nouvelle ligne après que vous avez appuyé sur Entrée, comme vous vous y attendez.

Plusieurs curseurs Appuyez de manière prolongée sur Commande (Mac) ou Ctrl+Alt (Windows, Linux), puis cliquez.

plusieurs curseurs

Canary met désormais en surbrillance les contextes non principaux en rouge.

Si vous avez travaillé récemment dans la console, vous avez peut-être été gêné par un petit bug qui définissait le sélecteur de contexte d'exécution sur des valeurs autres que top.

Ce bug devrait maintenant être corrigé dans la version stable, mais, par mesure de précaution, les outils de développement de Canary (Chrome 56) vous avertissent désormais que vous n'êtes pas dans le contexte top en mettant en surbrillance le sélecteur en rouge.

Contexte non principal en rouge

Nouveau user-agent: UC Browser

Vous pouvez désormais sélectionner UC Browser pour iOS, Android ou Windows Phone dans l'onglet du panneau Conditions réseau.

User-agent UC Browser

Le partage est fructueux

Comme toujours, vos commentaires ou suggestions sur tout ce qui concerne les outils de développement nous intéressent.

  • Contactez-nous via le site Twitter ChromeDevTools si vous avez des questions, des commentaires ou des idées.
  • Pour des discussions plus longues, la liste de diffusion ou Stack Overflow sont les meilleures options.
  • Pour toute question en lien avec la documentation, signalez un problème dans notre dépôt Docs.
  • Vous pouvez toujours vous adresser directement à l'équipe pour signaler un bug ou demander une fonctionnalité sur Crbug.

Jusqu'au mois prochain,

Kayce