Election-Tech-Initiative/electionguard-ui

✨ Add ability to view password text when logging in

Opened this issue · 1 comments

rc-ms commented

Is there an existing issue for this?

  • I have searched the existing issues

Suggestion

As either an election admin, guardian, or new user I may need the ability to view the contents of the password field. Because the password is sensitive information, it should remain hidden by default, so I should be presented with an easy-to-access, intuitive, accessible way to switch the state of the text from hidden to visible.
Also

  • I should have the ability to switch the text back to hidden from visible, ideally in the same control
  • I should not have to know a particular language or word to know what the switch does
  • the switch should not take up additional real estate of the form
  • the user should be able to tab into the control from within the form, and then tab correctly into the next form element from the control (see this example)
  • the control should be recognized by JAWS readers background

hidden

Screen Shot 2022-01-18 at 3 39 39 PM

visibile

Screen Shot 2022-01-18 at 3 39 30 PM

Possible Implementation

see images above and codepen example.

Anything else?

No response

There's also an example of how to do this for the MUI TextField component under the adornments section: https://mui.com/components/text-fields/#input-adornments