Saiba como o DevTools faz você digitar menos com o preenchimento automático mais inteligente do Console, como editar regras @keyframe
diretamente no painel Styles, como se divertir com variáveis personalizadas de CSS e como mesclar o lado escuro.
Preenchimento automático mais inteligente no seu console
Se você é como eu e muitos outros, você digita um comando no console para depurar seu aplicativo, vê que ele não funciona, faz a iteração e digita o comando de novo, uma e outra vez. Para ajudar nisso, agora preenchemos automaticamente todas as declarações que você digitou anteriormente, como:
Editar diretamente as regras de @keyframe no painel Estilos
Quando introduzimos o inspetor de animação e o editor de easing no DevTools, ele só estava limitado às transições, porque nunca mostramos animações CSS baseadas em @keyframe
no painel "Estilo". Tenho o prazer de dizer que isso é coisa do passado, então vá à loucura! Confira nosso vídeo do tweet para ter uma prévia.
Suporte a propriedades CSS personalizadas
O CSS oferece muitas vantagens e uma delas são as variáveis personalizadas, que serão lançadas no Chrome 49. Incluímos suporte total ao DevTools. Por isso, se você já estiver usando variáveis no Sass antes, teste as variáveis nativas, porque elas permitem editar propriedades em tempo real no painel Styles e atualizar imediatamente elementos dependentes.
Um tema escuro para DevTools
Por fim, atendemos a um pedido que recebemos dezenas de vezes nos últimos anos: agora é possível escolher o lado sombrio no DevTools. Acesse as configurações do DevTools, defina o tema como escuro e divirta-se. Esse recurso ainda está na versão Beta porque boa parte dele é gerada automaticamente. Por isso, entre em contato com nossa equipe se você perceber que pode haver melhorias.
Os outros melhores
- A gaveta do console agora é fechada automaticamente quando você clica na guia completa do console.
- A árvore de arquivos nas fontes foi reformulada com novos ícones e uma nova funcionalidade de agrupamento
Como sempre, dê sua opinião pelo Twitter ou pelos comentários abaixo e envie bugs para crbug.com/new.
Até o próximo mês!
Paul Bakaus e a equipe do DevTools