• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

189
Vistas
¿Cómo obtengo el elemento que recibe la entrada del teclado en web.whatsapp.com?

Quiero proporcionar a los usuarios discapacitados una forma de operar web.whatsapp.com solo con el teclado.

Esto funciona hasta cierto punto:

Los usuarios pueden saltar alrededor de cada pestaña y teclas de flecha.

Los mensajes de audio se pueden reproducir/silenciar presionando Espacio.

Sin embargo, no he encontrado una manera de abrir / videos o imágenes grandes:

ingrese la descripción de la imagen aquí

Además, incluso pude averiguar qué tecla abre / maximiza las imágenes, me parece incómodo que mis usuarios tengan que presionar 2 teclas diferentes

Entonces, lo primero que investigué fue qué elemento está actualmente activo/seleccionado.

Mi idea era hacer lo siguiente (pseudocódigo)

 if (UserPressedSomeSwitchToClickTheCurrentlySelectedElement) if (document.activeElement.type = 'wa-audio') SendSpace else if (document.activeElement.type = 'wa-Image') then 'todo: investigate how to click this element

Entonces, lo primero que intenté fue averiguar qué elemento es el activo / el que recibe la entrada del teclado.

Para comenzar de manera simple, configuré el foco en el cuadro de búsqueda de grupo y ejecuté JS para decirme el elemento.

En esta captura de pantalla, se puede ver que el cursor parpadea en el cuadro de búsqueda de grupo:

ingrese la descripción de la imagen aquí

Cuando presiono la tecla "n" en mi teclado, se imprime en este elemento:

ingrese la descripción de la imagen aquí

He intentado los siguientes enfoques para obtener el elemento que recibe la entrada:

 var e = document.activeElement; if (e) { alert('document.activeElement: ' + e + ', name: ' + e.name); } else { alert('document.activeElement was nothing'); e = document.querySelector(": focus"); if (e) { alert('querySelector : focus: ' + e); } else { alert('querySelector : focus was nothing'); } }

La alerta que me sale es:

ingrese la descripción de la imagen aquí

En algunos casos, e.className revela un nombre.

Sin embargo, cuando estoy en la pestaña de selección de personas en el lado izquierdo, e.className devuelve '', por lo que no tengo ni idea de dónde estoy.

about 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Espero haberte entendido bien. Con este código puede realizar un clic en una imagen seleccionada en WhatsApp Web.

 document.querySelector('.focusable-list-item[tabindex="0"] img').dispatchEvent(new Event('click', {bubbles: true}))

El ítem con la clase focusable-list-item está seleccionado. Esto es principalmente todo en su chat, al que puede acceder con la tecla arriba/abajo. Para calificar el selector, uso [tabindex="0"] que proporciona solo el elemento de chat activo (fondo azul). A partir de ahí profundizamos hasta encontrarnos con la etiqueta <img> . Realizamos un clic, que burbujea hasta el elemento específico, lo que activa el modo de pantalla completa.

Para mí funciona bien en la consola de Firefox. No tengo ni idea de si funcionará con tu VBA.

about 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda