Accessibility issue on show password button/icon

[Matthewundy]

I'm submitting a

• [x ] bug report
• [ ] feature request

Background info

Accessibility issue affecting screen readers

Expected behavior

What went wrong?

The “Show password” button is empty. The aria-label technique is not a good one if there is nothing in the button when CSS is deactivated. a. Remove the aria-label attribute from the b. Add a screen reader only text inside it: Show password 3. Also, blind people using assistive technologies need to know what the state of the button is (a visual information can’t be sufficient because it can’t be read). When the “Show password” button is active, change its name for “Hide password”: Hide password

Steps to reproduce

Standard widget HTML

Your environment

• Okta Sign-In Widget Version: Any
• Browser: Any
• OS: Any
• Language: Any

[swiftone]

Internal ref: OKTA-293145

[dexraven]

I am also seeing this issue as well. Is there any fix out for this?

[jchabotamica]

You also cannot "TAB" to the "button" so its not keyboard accessible as well. If you make it a button in the html, it should be keyboard accessible

[aarongranick-okta]

Have you enabled features.showPasswordToggleOnSignInPage ?

https://github.com/okta/okta-signin-widget#feature-flags

[jchabotamica]

@aarongranick-okta yes - that is how we are having it show. The problem is that it fails accessibility (ie. screen readers, keyboard only users, etc.)

[mlpeace]

We also have noticed this bug still exists. It affects more than screen reader users. Keyboard only users are also prevented from being able to use it.

Is there an ETA on when this will be fixed, please?