Hacer un seguimiento del foco de los elementos

Kayce Basques

Supongamos que estás probando la accesibilidad de la navegación con el teclado de una página. Cuando navegas por la página con la tecla Tab, a veces el anillo de enfoque desaparece porque el elemento que tiene el foco está oculto. Para hacer un seguimiento del elemento enfocado en Herramientas para desarrolladores:

1. Abre la consola.

2. Haz clic en Create Live Expression .

   

   Para obtener más información, consulta Cómo mirar los valores de JavaScript en tiempo real con Expresiones en vivo.

3. Tipo document.activeElement.

4. Haz clic fuera de la IU de Expresión instantánea para guardar los cambios.

El valor que ves debajo de document.activeElement es el resultado de la expresión. Como esa expresión siempre representa el elemento enfocado, ahora tienes una manera de hacer un seguimiento de qué elemento se enfoca.

• Coloca el cursor sobre el resultado para destacar el elemento enfocado en el viewport.
• Haz clic con el botón derecho en el resultado y selecciona Mostrar en el panel de elementos para mostrar el elemento en el Árbol del DOM en el panel Elementos.
• Haz clic con el botón derecho en el resultado y selecciona Almacenar como variable global para crear una referencia variable al nodo que puedes usar en Console.