WordPress.org

Make WordPress Core

Opened 3 years ago

Last modified 13 days ago

#42852 new defect (bug)

Add new user: new password not generated when reopening Show Password

Reported by: afercia Owned by:
Milestone: 5.6 Priority: normal
Severity: normal Version: 4.7
Component: Users Keywords: has-patch has-screenshots
Focuses: javascript Cc:

Description

Noticed while working on #42749: After [38494], see also [34312], [33766], [33079], and [32589], in the "Add new user" screen a new password is not displayed when clicking "Show Password", then "Cancel", then "Show Password" again.

In WordPress 4.6:

  • go in the "Add new user" screen (user-new.php)
  • click "Show Password"
  • observe the generated password
  • click "Cancel": the form closes
  • click "Show Password" again
  • observe there's a new generated password displayed

This matched the behavior in the "Your profile" screen (profile.php.)

Repeat the above steps in WordPress 4.7 or more recent version:

  • go in the "Add new user" screen (user-new.php)
  • click "Show Password"
  • observe the generated password
  • click "Cancel": the form closes
  • click "Show Password" again
  • the password field is empty

At this point, there's no way to generate a new password other than reloading the page. Additionally:

  • a real password is actually generated but is not displayed in its "non-masked" form
  • the password field looks empty but the strength indicator says "Strong"
  • clicking "Hide" shows the real password field filled with dots: confusing for users, since the other field is empty

Following the argumentations on the related tickets #33419 and #37902, the implemented changes make sense. However, there's an unintended consequence: the real password field $pass1 is filled up while its visual representation $pass1Text is empty.

Attachments (5)

42852.diff (13.2 KB) - added by afercia 3 years ago.
42852.2.diff (13.2 KB) - added by pento 19 months ago.
42852.3.patch (11.4 KB) - added by bookdude13 6 months ago.
Refreshed patch
42852.4.diff (9.3 KB) - added by bookdude13 6 months ago.
A cleaner refresh
42852.5.diff (9.6 KB) - added by bookdude13 6 months ago.
Hiding again, and cached password gen

Download all attachments as: .zip

Change History (27)

#1 @afercia
3 years ago

See also #32979, with some feedback about the potentially confusing UI.

#2 @afercia
3 years ago

I think the root cause of the problem is some ambiguity in the controls names, as pointed out in #32979, together with the intent to automate some behaviors in a smart way. Sometimes trying to be smart can be confusing for users, as it often assumes one specific workflow while users might have a different intent.

Any change to this UI should try to respect the original intent of the feature, see The Plan for Passwords. Also, the ability for users to generate new passwords added in #33450 should be preserved, but I think it shouldn't happen when clicking "Cancel".

I'd propose to try to keep things simple, and make the UI more transparent to users.

  • rename the "Generate Password" and "Show password" buttons to "Set New Password"
  • make the button always generate a new password each time it gets pressed: the new button text will indicate exactly what the button does (apart from opening the form)
  • don't move focus or select the password programmatically: this is often based on an assumption on a specific workflow and might not be what users want, not to mention is confusing for assistive technologies users
  • make the "Cancel" button just... "Cancel" :) keeping the form open and just clearing the fields would make very clear to users what's going on

/cc @markjaquith @helen @adamsilverstein @SergeyBiryukov

Last edited 19 months ago by afercia (previous) (diff)

@afercia
3 years ago

#3 @afercia
3 years ago

  • Keywords has-patch added; needs-patch removed

42852.diff is a first try and incorporates accessibility enhancements from #42749 props to @alexstine.

Last edited 19 months ago by afercia (previous) (diff)

#4 @adamsilverstein
3 years ago

  • Keywords needs-screenshots added

Thanks for opening this ticket @afercia - I agree the user experience could greatly improved here and changing the wording is definitely part of that. I'll give your patch a test soon and try to provide some feedback.

At some point on a separate ticket, it would great to consider refactoring the JavaScript which is over complicated by needing to support IE8 which considers the input field type read only.

#5 @afercia
3 years ago

  • Keywords has-screenshots added; needs-screenshots removed

Screenshot:

https://cldup.com/0tJC7dsaAg.png

  • clicking "Set New Password" always generates a new password
  • clicking "Cancel" empties the fields; the form stays open, as closing it seems to be one of the root causes of some confusion for users

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.


3 years ago

#7 @johnbillion
22 months ago

  • Milestone changed from 5.0 to 5.1

@pento
19 months ago

#8 @pento
19 months ago

  • Keywords needs-design added

42852.2.diff refreshes the patch to apply cleanly to trunk.

Having the password field just be blanked by the Cancel button feels kind of weird. It doesn't really give an indication of what that means for the password that this new account will have.

Perhaps it needs some inline help text to explain what the options are for setting a password? Tagging design for their thoughts.

#9 @afercia
19 months ago

If / when committing this change please don't forget props to @alexstine who originally proposed some of these changes in #42749.

#10 @pento
19 months ago

  • Milestone changed from 5.1 to 5.2

Moving to 5.2, as this needs design feedback, and patch updates based on that.

#11 @desrosj
16 months ago

  • Milestone changed from 5.2 to Future Release

This has not been touched since being punted to 5.3, and still needs design. Moving to future-release.

#12 @adamsilverstein
9 months ago

  • Milestone changed from Future Release to 5.4

@bookdude13
6 months ago

Refreshed patch

#13 follow-up: @bookdude13
6 months ago

Patch refreshed. A few suggestions to improve (needs design review):

  • When editing a user (or your own profile) the "Set New Password" button text could change to "Generate New Password" once the field appears.
  • When editing a user (or your own profile) the "Cancel" button could hide all of the fields, making the "Set New Password" button act as a toggle for their appearance
  • There is not a way to generate new strong passwords during installation
  • It should be checked that #42853 didn't get reverted in this. The code that was changed from there were removed from the original patch here.
  • Related: #42766

#14 in reply to: ↑ 13 @bookdude13
6 months ago

My last refresh was more focused on code porting than functionality...so here's another attempt :)

  • This should match the four bullets mentioned by @afercia
  • For creating new users, changed it so the fields are never hidden. This also allows for a value to always be set and visible for the password when creating users. Since it's always visible I have the text set to "Generate New Password"
  • It still needs to be tested that passwords can't be set even if they were never visible, e.g. an edit profile/user page updating the password by accident when something else updates
  • I have not tested on other browsers or mobile, just Chrome.

This still needs design review for the question of how to handle the Cancel button and where to put the Set New Password button (above or below)

Replying to bookdude13:

Patch refreshed. A few suggestions to improve (needs design review):

  • When editing a user (or your own profile) the "Set New Password" button text could change to "Generate New Password" once the field appears.
  • When editing a user (or your own profile) the "Cancel" button could hide all of the fields, making the "Set New Password" button act as a toggle for their appearance
  • There is not a way to generate new strong passwords during installation
  • It should be checked that #42853 didn't get reverted in this. The code that was changed from there were removed from the original patch here.
  • Related: #42766

@bookdude13
6 months ago

A cleaner refresh

This ticket was mentioned in PR #163 on WordPress/wordpress-develop by adamsilverstein.


6 months ago

#16 @adamsilverstein
6 months ago

  • Milestone changed from 5.4 to 5.5

Thanks for the patch @bookdude13 - this looks pretty nice, however I feel like somehow this lost some of the original intent of "Cancel" which was to close the "Show Password" section. I think a design review would be worthwhile given how much changed here.

I captured a screencast of how this looks after your patch.

https://p10.f2.n0.cdn.getcloudapp.com/items/JruWX0EQ/Screen+Recording+2020-02-21+at+01.59+PM.gif



@afercia is the issue you described still happening? When I tried to reproduce the field was not cleared when I clicked cancel. If you can still reproduce, what browser/version are you using? Screencast:

https://p10.f2.n0.cdn.getcloudapp.com/items/04uKrpWL/Screen+Recording+2020-02-21+at+01.56+PM.gif


In the mean time since this needs design review and we are approaching 5.4 beta 3, I'm punting this to 5.5.

#17 @bookdude13
6 months ago

@adamsilverstein sounds good to punt it out.

I would be fine having the Cancel button close everything up again. Updated patch added to see what that functionality would look like. That latest patch also caches the generated random password value like it used to be, so it doesn't have a delay before showing up. Awaiting design.

Another question when this gets checked: why is there a Cancel button when creating a new user? A password needs to be set, so that seems unintuitive. I'd think it should be like the install page, where you can generate again but can't "cancel" anything.

@bookdude13
6 months ago

Hiding again, and cached password gen

This ticket was mentioned in Slack in #core by david.baumwald. View the logs.


7 weeks ago

#19 @michaelarestad
5 weeks ago

  • Keywords needs-design removed

There are two flows here:

For the "New Password" flow, I think what is proposed makes sense.

For the "New user" flow, I would suggest showing this:

https://cldup.com/KQEH0gbgd_-2000x2000.png

This would remove the buttons to display the password and the cancel button.

As for the "Generate" button, I don't think that's necessary. I don't know how many folks are opinionated about their generated random string. If so, they can customize it.

What do you think?

This ticket was mentioned in Slack in #core by david.baumwald. View the logs.


3 weeks ago

This ticket was mentioned in Slack in #core by whyisjake. View the logs.


13 days ago

#22 @whyisjake
13 days ago

  • Milestone changed from 5.5 to 5.6

Looks like there is some more work needed here ahead of the 5.5 release. Going to punt to 5.6.

Note: See TracTickets for help on using tickets.