Découvrez comment les outils de développement vous simplifient la saisie grâce à la saisie semi-automatique plus intelligente dans la console, comment modifier les règles @keyframe directement dans le volet "Styles", comment vous amuser avec les variables CSS personnalisées et comment rejoindre le côté obscur.
Une saisie semi-automatique plus intelligente dans votre console
Si vous êtes comme moi et beaucoup d'autres personnes, vous saisissez une commande dans la console pour déboguer votre application, constatez qu'elle ne fonctionne pas, itérez et saisissez-la encore et encore, encore et encore. Pour vous aider, nous effectuons désormais la saisie semi-automatique complète des instructions que vous avez saisies, comme suit:
Modifier directement les règles @keyframe dans le volet "Styles"
Lorsque nous avons introduit l'inspecteur d'animation et l'éditeur de lissage de vitesse dans les outils de développement, il était limité aux transitions, car nous n'avons jamais affiché d'animations CSS basées sur @keyframe dans le volet "Style". Je suis heureuse d'annoncer que cela appartient désormais au passé, alors foncez ! Consultez notre tweet vidéo pour en avoir un aperçu.
Compatibilité avec les propriétés CSS personnalisées
Le CSS va connaître de nombreuses nouveautés, dont les variables personnalisées, lancées dans Chrome 49. Les outils de développement sont entièrement pris en charge. Par conséquent, si vous avez déjà utilisé des variables dans Sass, essayez les variables natives, car elles vous permettent de modifier les propriétés à la volée dans le volet "Styles" et de mettre immédiatement à jour les éléments dépendants.
Thème sombre pour les outils de développement
Nous avons finalement accepté une demande qui nous a été faite des dizaines de fois au cours des deux dernières années: vous pouvez désormais choisir le côté obscur dans les outils de développement. Accédez aux paramètres des outils de développement, puis définissez le thème sur sombre. Je dirais que cette fonctionnalité est encore en version bêta, car la plupart d'entre elles sont générées automatiquement. Par conséquent, si vous identifiez des points qui pourraient être améliorés, n'hésitez pas à nous contacter.
Le meilleur du reste
- Désormais, le panneau de la console se réduit automatiquement lorsque vous cliquez sur l'onglet "Console complète".
- L'arborescence de fichiers dans "Sources" a été remaniée avec de nouvelles icônes et une nouvelle fonctionnalité de regroupement.
Comme toujours, n'hésitez pas à nous donner votre avis via Twitter ou les commentaires ci-dessous, et signalez vos bugs à l'adresse crbug.com/new.
Jusqu'au mois prochain !
Paul Bakaus et l'équipe DevTools