Make WordPress Core

Opened 5 years ago

Last modified 5 weeks ago

#44714 accepted defect (bug)

Title should toggle to Show details to Hide details as per the event fired

Reported by: krupajnanda's profile krupajnanda Owned by: joedolson's profile joedolson
Milestone: 6.3 Priority: normal
Severity: minor Version:
Component: Upgrade/Install Keywords: has-screenshots has-patch needs-refresh
Focuses: ui, accessibility, javascript Cc:


On upload-core.php page --> While theme and/or plugin is being updated, information title should be toggled to Hide details when user clicked on Show details

Please check this attachment.

Attachments (2)

toggle event issue.webm (611.1 KB) - added by krupajnanda 5 years ago.
Please check this visual for detail.
44714.diff (975 bytes) - added by subrataemfluence 5 years ago.
Proposed patch

Download all attachments as: .zip

Change History (13)

5 years ago

Please check this visual for detail.

#1 @swissspidy
5 years ago

  • Component changed from Text Changes to Upgrade/Install
  • Focuses accessibility added
  • Version 4.9.8 deleted

5 years ago

Proposed patch

#2 @subrataemfluence
5 years ago

  • Keywords has-patch added; needs-patch removed

#3 follow-up: @audrasjb
5 years ago

  • Milestone changed from Awaiting Review to 4.9.9

Hi, thanks for the ticket.

I tested the patch and it looks good to me.

Per today's accessibility team meeting, let's move it to 4.9.9 milestone in order to see if it can land in the next minor.



#4 in reply to: ↑ 3 @subrataemfluence
5 years ago

Thanks @audrasjb for testing the patch :)

Replying to audrasjb:

Hi, thanks for the ticket.

I tested the patch and it looks good to me.

Per today's accessibility team meeting, let's move it to 4.9.9 milestone in order to see if it can land in the next minor.



#5 @afercia
5 years ago

  • Keywords needs-refresh added

Screenshot for reference:

Generally, I wouldn't recommend to dynamically change the accessible name of a control, whether it's a button text, aria-label, a link text, etc. The name of an UI control shouldn't change.


  • a blind screen reader user navigates the content and learns there's a "Show details" button
  • the user activates the button and explores the content underneath
  • then the user wants to collapse the details and will look for a "Show details" button, either by navigating backwards or by other means (e.g. screen readers can list all the controls in a page)
  • however, there's no control named "Show details" any longer, because the name has changed
  • the user will have to figure out what happened and guess that's really the button he/she was looking for

While that's not an impossible task, changing the name will certainly make it harder.

Additionally: this button uses an aria-expanded attribute to communicate the collapsed / expanded state of the content it toggles. aria-expanded is automatically announced by screen readers and gives an important feedback to users. Changing the text of the button would make the perceived information a bit confusing. Screen readers will read out:

  • "Show details {collapsed}"
  • "Hide details {expanded}"

Worth also considering the potential confusion for many other users, for example users with cognitive impairments, non tech-savvy users, etc.

Visually, I'm not sure what's the value added by changing the button text. It's pretty clear the button toggles the content. Instead, what is missing is a visual representation of the collapsed / expanded state. Not sure this visual representation of the state is really necessary in this specific case, but in several other places in the WordPress admin a down / up arrow icon is used for this purpose.

From an UI perspective, one more source of confusion is that this control is a button but looks like a link. Alas, this happens in many other places in the admin. As a user, I would be in doubt: as it looks like a link, does this mean it navigates to another page? Ideally, buttons should look like buttons. This is part of a broader issue though and it would need some design feedback.

To recap: I'd rather consider to not use the word "Show" to start with. Worth noting also the word "toggle" shouldn't be used, as it's very hard to translate in many languages, see #34753. I'd recommend to simplify and just not use "Show". A simpler wording like "More details" or even just "Details" could work. Optionally, worth considering using a down / up arrow. Visually and semantically this would be perceived as something like:

  • "More details {down arrow} {collapsed}"
  • "More details {up arrow} {expanded}"

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

5 years ago

#7 @pento
5 years ago

  • Milestone changed from 4.9.9 to Future Release

This ticket was mentioned in Slack in #design by karmatosed. View the logs.

3 years ago

#9 @nrqsnchz
3 years ago

  • Keywords ux-feedback removed

We discussed this ticket during Design triage today (

We agree with the suggestion of changing the label ("More details") and adding an up/down arrow to the toggle (" More details ▾ ").

#10 @krupajnanda
3 years ago

Hi @nrqsnchz,

Thank you for considering this suggestion! Collapse up and down arrow button will be better and more thoughtful.


#11 @joedolson
5 weeks ago

  • Milestone changed from Future Release to 6.3
  • Owner set to joedolson
  • Status changed from new to accepted
Note: See TracTickets for help on using tickets.