WordPress.org

Make WordPress Core

Opened 5 months ago

Closed 5 months ago

Last modified 4 months ago

#52355 closed enhancement (fixed)

Twenty Twenty: remove aria-expanded on Close Search button

Reported by: alexstine Owned by: alexstine
Milestone: 5.7 Priority: normal
Severity: normal Version: 5.6
Component: Bundled Theme Keywords: has-patch commit
Focuses: accessibility Cc:

Description (last modified by alexstine)

Theme: Twenty Twenty

When opening the search form in the header, the Search button automatically gets aria-expanded toggled. However, on the Close Search button, aria-expanded="false" is set by default. Need to remove this attribute as Close Search does not toggle any behavior, it is simply a regular button to close the search form.

Attachments (2)

06ad1f69c8a3cd81273a8e17269dafb6.gif (2.1 MB) - added by audrasjb 5 months ago.
Before: aria-expanded attribute is toggled on click on the close button
ba07355f76e101e7ee29dcd4b4c2ca5b.gif (1.3 MB) - added by audrasjb 5 months ago.
After patch: no aria-expanded attribute is used anymore

Change History (11)

#1 @alexstine
5 months ago

  • Description modified (diff)
  • Owner set to alexstine
  • Status changed from new to accepted
  • Summary changed from Twenty Twenty-One: remove aria-expanded on Close Search button to Twenty Twenty: remove aria-expanded on Close Search button

#3 @alexstine
5 months ago

  • Keywords needs-testing added
  • Milestone changed from Awaiting Review to 5.7

This is ready for testing.

To test:

  1. Activate Twenty Twenty theme.
  2. Apply this patch.
  3. Select Search.
  4. Select Close Search.
  5. Check HTML via inspector to make sure aria-expanded="true/false" does not exist on Close Search button.

Thanks.

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


5 months ago

@audrasjb
5 months ago

Before: aria-expanded attribute is toggled on click on the close button

@audrasjb
5 months ago

After patch: no aria-expanded attribute is used anymore

#5 @audrasjb
5 months ago

  • Keywords commit added; needs-testing removed

Hi @alexstine, I tested your patch. It works fine and sounds legit to me.
Above, I shared two animated screenshot to demonstrate that your patch fixes the issue.
Looks good to go on my side. Removing needs-testing workflow keyword and replacing it with commit :-)

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


5 months ago

#7 @joedolson
5 months ago

  • Resolution set to fixed
  • Status changed from accepted to closed

In 50033:

Twenty Twenty: Remove aria-expanded on search modal close button.

The Twenty Twenty search modal uses aria-expanded correctly on the Search button, but toggles the aria-expanded value on the 'close' button. The close button is a different control, however, so the attribute value toggling is uneven. The close button does not toggle any behavior; it only closes a control that has already been opened.

Props alexstine, audrasjb
Fixes #52355

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


5 months ago

Note: See TracTickets for help on using tickets.