DEV Community

✨Validación de contraseñas accessible✨

Mica on December 05, 2023

En esta entrada vamos a aprender como hacer una validación de contraseñas accesible. El repo de Github podes encontrarlo en el siguiente link: http...
Collapse
 
sveggiani profile image
Sebastián Veggiani

Muy buen artículo Mica. Me lo guardo para futura referencia.

Hay un pequeño error en la validación. Luego de un punto no valida bien que ya hay un caracter especial.

Image description

Y otra pequeña sugerencia que haría es ser más específico en los mensajes. Por ej. "un número" -> "al menos un número"

Collapse
 
micaavigliano profile image
Mica

Hola Sebas! El punto no esta cómo caracter especial. Básicamente esta al final de la oración para que el screen reader sepa donde termina la misma y pueda separarlas como figura en esta imagen
captura de pantalla del screen reader voiceover que anuncia "tu contraseña debe incluir un número de 0 a 9. un carácter especial !@#$%^&. una letra en maypuscula. no debe tener letras iguales consecutivas. una longitud de ocho caracteres

Con respecto a la sugerencia del mensaje, listo! ya esta pusheado al repo :)

gracias y saludosss

Collapse
 
sveggiani profile image
Sebastián Veggiani

Hola Mica! ahora entedí, si pongo un "." no pasa la validación de caracter especial. En ese caso sería más específico en decir que ESOS son los caracteres especiales permitidos únicamente. Pero está buenísimo, estoy yendo a sugerir algo muy fino. Me llamó la atención porque hace poco tuve que hacer un componente casi igual :)

Thread Thread
 
micaavigliano profile image
Mica

Non, esta buenísimo que lo marques porque podría prestar a confusiones visuales. Ahora veo cómo lo soluciono para que también sea claro para las tecnologías asistivas.
Me alegro que te haya servido! Yo tuve que hacerlo para un challenge y le metí la parte de accesibilidad para no perder la costumbre! Jajaja