[wp-trac] [WordPress Trac] #42002: Improve the accordions accessibility

[WordPress Trac]

#42002: Improve the accordions accessibility
----------------------------------------------+----------------------------
 Reporter:  afercia                           |       Owner:  joedolson
     Type:  defect (bug)                      |      Status:  accepted
 Priority:  normal                            |   Milestone:  6.7
Component:  Administration                    |     Version:
 Severity:  normal                            |  Resolution:
 Keywords:  has-screenshots has-patch commit  |     Focuses:  ui,
                                              |  accessibility
----------------------------------------------+----------------------------
Changes (by joedolson):

 * keywords:  has-screenshots has-patch needs-testing => has-screenshots
     has-patch commit


Comment:

 In my opinion, the amount of extra code required to handle this CSS in
 order to cover .14% usage are not justified, given that the result of the
 lack of support is a minor visual difference.

 Based on my own testing, I think this is ready for commit.

 Changes:

 1) Accordions now contain immediate children `button` elements with `aria-
 controls` attributes pointing to their controlled content.
 2) Text provided to explain how to use the accordions in screen readers
 removed. (No longer required since these are now buttons with correct
 markup.)
 3) Event triggers moved to `button` elements.
 4) Unneeded `tabindex="0"` removed, as headings no longer need to be made
 navigable.
 5) Tests updated.

 Primary visual change is that the nav menu accordions have a visible
 :focus state, previously missing. It is the standard focus state,
 identical to the existing state in Site Health.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/42002#comment:44>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform