0
259
Views¿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:
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 elementEntonces, 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:
Cuando presiono la tecla "n" en mi teclado, se imprime en este elemento:
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:
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.
1 answers
Answer question0
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.