Aprenda 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 as variáveis personalizadas do CSS e como se juntar ao lado negro.
Um preenchimento automático mais inteligente no console
Se você é como eu e muitas outras pessoas, digita um comando no console para depurar o app, vê que ele não está funcionando, itera e digita novamente, e de novo, e de novo. Para ajudar, agora estamos preenchendo automaticamente as frases que você digitou anteriormente, como esta:
Editar diretamente as regras de @frame-key no painel "Styles"
Quando apresentamos o inspetor de animação e o editor de transição para o DevTools, ele era limitado a transições porque nunca mostrávamos animações CSS baseadas em @keyframe no painel "Estilo". Tenho o prazer de dizer que isso é coisa do passado, então divirta-se! Confira nosso tweet com vídeo para conferir uma prévia.
Suporte a propriedades CSS personalizadas
Há muitas novidades no CSS, e uma delas são as variáveis personalizadas, lançadas no Chrome 49. Incluímos suporte total nas Ferramentas do desenvolvedor. Se você já usava variáveis no Sass, experimente as nativas, que permitem editar propriedades instantaneamente no painel "Styles" e atualizar imediatamente os elementos dependentes.
Um tema escuro para as ferramentas do desenvolvedor
Finalmente atendemos a um pedido que ouvimos dezenas de vezes nos últimos anos: agora você pode escolher o lado escuro no DevTools. Acesse as configurações do DevTools, defina o tema como escuro e aproveite. Digo que ele ainda está em versão Beta porque grande parte dele é gerado automaticamente. Se você encontrar áreas que podem ser melhoradas, entre em contato.
O melhor do resto
- A gaveta do console agora é recolhida automaticamente quando você clica na guia completa do console.
- A árvore de arquivos em "Origens" passou por uma grande reformulação com novos ícones e uma nova funcionalidade de agrupamento.
Como sempre, deixe sua opinião no Twitter ou nos comentários abaixo e envie bugs para crbug.com/new.
Até o próximo mês!
Paul Bakaus e a equipe do DevTools