¡Hola al equipo!
Esto es más bien un informe rápido. Acabo de notar en otro hilo que el botón de “Me gusta” a veces no tiene una etiqueta de accesibilidad. Aún no he encontrado el patrón, pero posiblemente tenga que ver con si una publicación ya ha recibido uno o más “me gusta” o ninguno todavía, y el control se divide para mostrarlo. En ese caso, veo dos botones: uno tiene el contador y el segundo no tiene etiqueta.
Marco
¡Ah, creo que esto se debe a que estamos probando nuestro plugin Discourse Reactions aquí en Meta (Notice: testing Discourse Reactions here on meta for 1 week!). ¡Necesitamos solucionar eso! Gracias por el informe.
@Ahmed_Gagan Para tu información, asegúrate de echar un vistazo a esto.
Lo intenté y lo probé con muchos casos diferentes, pero no pude reproducirlo. La etiqueta siempre se mostraba, aunque la primera vez tarda un poco más en aparecer, lo cual es un comportamiento general del atributo title.
Supongo que el problema está relacionado con el tooltip proporcionado para el botón de “Me gusta”. ¿Estamos en la misma página?
Me refiero a lo que el lector de pantalla dice al pulsar el botón para dar «Me gusta» a una publicación. O quizás se puedan añadir otras reacciones, pero mi lector de pantalla no me informa de ello en absoluto. Lo único que recibe una etiqueta es el elemento que muestra el recuento actual de «Me gusta», si es 1 o superior. Si es 0, ese control no existe. Sin embargo, el botón que debo pulsar para añadir la reacción «Me gusta» no tiene etiqueta para mis lectores de pantalla en Windows, Mac e iOS.
Soy ciego, así que no uso el ratón. Además, el atributo title en general es problemático para las interacciones táctiles, ya que normalmente no hay una forma sencilla de activar un desplazamiento del ratón (hover).
Espero que esto ayude…
Para ser claro, me refiero al botón #discourse-reactions-actions-916340 > div > div.discourse-reactions-reaction-button.my-likes > button. Ese botón no tiene atributo title ni aria-label; solo contiene un SVG que tiene aria-hidden. Incluso si no lo tuviera, ni ese SVG ni sus hijos contienen información que un lector de pantalla pueda utilizar. Por lo tanto, la solución es:
#discourse-reactions-counter-916340, debería obtener mejor información sobre quién reaccionó exactamente con qué reacción. No sé cómo acceden a ello las personas con visión; si haces clic en ese número y aparece un cuadro emergente en algún lugar. Pero eso también debe hacerse accesible para usuarios de lectores de pantalla y teclado.Por ahora, al menos para mí, el widget parece permitir solo reacciones de «Me gusta».
Disculpa los múltiples mensajes, pero esto muestra lo meticuloso que a veces puede ser encontrar la causa de algo. El atributo title en las publicaciones que no son mías está actualmente en el div padre del botón real de «Me gusta». Sin embargo, para que un lector de pantalla lo detecte, el title debe estar en el propio botón. Los lectores de pantalla no captan títulos de cualquier elemento. Se ha abusado demasiado de esa generalización en los últimos 25 años. Por lo tanto, si mueves el atributo title al elemento hijo <button>, el lector de pantalla lo detectará correctamente.
Gracias, @MarcoZehe, por proporcionar el punto exacto donde necesitabas el título.
He agregado una PR aquí que resolverá tu problema.
@MarcoZehe, la PR ya está fusionada; puedes actualizar el último plugin y probarlo.
¡Gracias! Esperaré a que esta instancia obtenga el código más reciente para el plugin. No estoy ejecutando mi propia instancia de Discourse, así que no tengo ningún lugar donde pueda integrar el plugin. ¡Gracias por la solución rápida!
¡Muchas gracias, Marco!
Acabo de volver a desplegar las reacciones aquí (deberían estar activas en unos 15 minutos).
Avísanos si el problema parece haberse resuelto.
Hola @Sam, el problema definitivamente parece resuelto para mí. ¡Gracias!
¡Muchas gracias, Marco, por tu prueba!