Olá, sou Kayce, de volta com outro resumo para atualizar você sobre as novidades do DevTools desde o mês passado.
Novos recursos no console
No Chrome 56, que está atualmente no Canary, o console do DevTools é fornecido pelo CodeMirror. Isso ativa vários recursos novos, como:
Destaque de sintaxe enquanto você digita. Antes, o DevTools só podia destacar a sintaxe depois que um bloco de código era avaliado.
Destaque de parênteses / colchetes / chaves correspondentes. Se você tiver parênteses, colchetes ou chaves extras, o DevTools vai destacar em vermelho.
![parênteses incompatíveis](https://developer.chrome.com/static/blog/devtools-digest-2016-10/image/mismatched-parenthesis-76c3a7f4bd247.png?hl=pt-br)
Parênteses, colchetes ou chaves correspondentes são destacados em cinza quando o cursor está ao lado de um deles.
![parênteses correspondentes](https://developer.chrome.com/static/blog/devtools-digest-2016-10/image/matched-parentheses-6084ed0e040b6.png?hl=pt-br)
Retorno inteligente. Quando você digita um bloco de código de várias linhas, o DevTools
agora sabe se deve criar uma nova linha ou executar o código sempre que você
pressiona Enter. Por exemplo, suponha que você queira
avaliar o seguinte loop for
no console:
for (var i = 0; i < 5; i++) {
console.log(i);
}
No passado, pressionar Enter depois de digitar a primeira linha faria com que o DevTools avaliasse a linha, causando um erro. Para continuar o bloco de código em uma nova linha, você precisa pressionar Shift antes de pressionar Enter. Por outro lado, agora as Ferramentas do desenvolvedor continuam automaticamente o bloco de código em uma nova linha depois que você pressiona Enter, como esperado.
Vários cursores. Mantenha pressionada a tecla Command (Mac) ou Control+Alt (Windows, Linux) e clique.
![vários cursores](https://developer.chrome.com/static/blog/devtools-digest-2016-10/image/multiple-cursors-427c9adec6967.gif?hl=pt-br)
O Canary agora destaca os contextos não principais em vermelho
Se você trabalhou no console recentemente, talvez tenha encontrado um
bug que estava definindo o seletor de contexto de execução para valores
diferentes de top
.
Esse bug foi corrigido na versão estável, mas, por segurança, as DevTools
no Canary (Chrome 56) agora avisam que você não está no contexto top
realçando o seletor em vermelho.
![contexto não principal destacado em vermelho](https://developer.chrome.com/static/blog/devtools-digest-2016-10/image/non-top-context-highlight-9dae4747bf537.png?hl=pt-br)
Novo user agent: UC Browser
Agora é possível selecionar o UC Browser para iOS, Android ou Windows Phone na guia gaveta Condições de rede.
![User agent do UC Browser](https://developer.chrome.com/static/blog/devtools-digest-2016-10/image/uc-browser-user-agent-6f990e5892643.png?hl=pt-br)
Compartilhar é cuidar
Como sempre, adoraríamos saber sua opinião ou ideias sobre qualquer coisa relacionada às Ferramentas do desenvolvedor.
- Entre em contato com a gente no Twitter em ChromeDevTools para perguntas breves ou feedback ou para compartilhar novas ideias.
- Para discussões mais longas, a lista de e-mails ou o Stack Overflow são as melhores opções.
- Para qualquer coisa relacionada a documentos, abra um problema no repositório de documentos.
- Você pode entrar em contato diretamente com a equipe para informar um bug ou solicitar um recurso no Crbug.
Até o próximo mês,
Kayce