jwplayer / ott-web-app

Reference implementation for JWP-powered apps
Apache License 2.0
69 stars 52 forks source link

Fix / retain password input during sign up #484

Closed MelissaDTH closed 2 months ago

MelissaDTH commented 3 months ago

Retain password input after form validation

During the sign-up process, when users encounter an error in that modal, the current behaviour clears the password field without notifying the user. This lack of clarity can pose challenges, especially for visually impaired users. Therefore, we propose revisiting this behaviour in the Sign Up modal through this PR:

Providing consistent user experience across all input fields is important for accessibility. Users with disabilities or impairments rely on consistent interactions to navigate and understand web content effectively (we also do not clear the email field for example). Clearing the fields after a form error can be frustrating for users, because they have already invested effort in filling out the form. Retaining their input allows them to correct the specific error without starting over, thus providing a smoother user experience.

Completion rate Another argument for this change can be that clearing input fields forces users to repeat their actions, which can be time-consuming and may discourage them from completing the form. By preserving their input, users only need to correct the error (source: Userpeek.com: Completion rate).

Real example Google’s registration form also maintains the input in the password field even after an error occurs. Instead of clearing the field, it displays an error message indicating what needs to be corrected while retaining the user’s input, see: Screenshot 2024-03-27 at 16 34 03


Google does clear the password field in their Sign In form, without the screen reader announcing that it has been cleared. However, it does inform the user that there is ‘invalid data’ and puts the focus on the password field. We can argue that screen reader users are accustomed to the password field being cleared during login attempts, so do we want to retain the user’s input in the Sign In flow. Also because we do show an error stating ‘Incorrect email/password combination’ if necessary. Additionally, it can be argued that it is easier for all users, whether or not they use a screen reader, if the password field is emptied, as in such cases, users typically want to re-enter their password.

Therefore we want to argue to only apply this change in the Sign Up modal

github-actions[bot] commented 3 months ago

Visit the preview URL for this PR (updated for commit fce69d5):

https://ottwebapp--pr484-fix-password-field-r-x69muqf7.web.app

(expires Thu, 09 May 2024 14:24:44 GMT)

🔥 via Firebase Hosting GitHub Action 🌎

Sign: c198f8a3a199ba8747819f7f1e45cf602b777529