Suponha que você esteja testando a acessibilidade de navegação pelo teclado de uma página. Ao navegar na página com a tecla Tab, o anel de foco às vezes desaparece, porque o elemento em foco está oculto. Para monitorar o elemento em foco no DevTools:
- Abra o Console.
Clique em Create Live Expression .
Para mais informações, consulte Acompanhar valores de JavaScript em tempo real com Expressões ao vivo.
Digite
document.activeElement
.Clique fora da IU da Live Expression para salvar.
O valor que você vê abaixo de document.activeElement
é o resultado da expressão. Como essa
expressão sempre representa o elemento em foco, agora é possível monitorar qual
elemento está em foco.
- Passe o cursor sobre o resultado para destacar o elemento em foco na janela de visualização.
- Clique com o botão direito do mouse no resultado e selecione Revelar no painel Elementos para mostrar o elemento na Árvore DOM no painel Elementos.
- Clique com o botão direito do mouse no resultado e selecione Armazenar como variável global para criar uma referência de variável ao nó que você pode usar no Console.