WordPress.org

Make WordPress Core

Opened 6 years ago

Closed 6 years ago

#28835 closed defect (bug) (fixed)

Customizer - Add a Widget - Focus gets lost

Reported by: GrahamArmfield Owned by: SergeyBiryukov
Milestone: 4.0 Priority: normal
Severity: normal Version: 4.0
Component: Customize Keywords: has-patch
Focuses: accessibility Cc:

Description

There are a couple of keyboard focus issues around the Add a Widget button in Customizer > Widgets.

I'm noticing different behaviours on Chrome 35 and Firefox 30 - both running on Windows 7 64 bit.

In Chrome 35:

  • Tab to Appearance > Customize > Widgets > Any Widget Area
  • Tab to the Add a Widget Button and press Enter
  • Focus is now clearly within Search widgets box of the extra panel.
  • Press Shift + Tab to tab back to Add a Widget button and Press Enter.
  • Focus has now gone somewhere unexpected and then appears at bottom of site page being shown in Customizer

Expected result:
I would expect the focus to stay on the Add a Widget button.

In Firefox, a slightly different result appears.

  • Tab to Appearance > Customize > Widgets > Any Widget Area
  • Tab to the Add a Widget Button and press Enter
  • Focus is now clearly within Search widgets box of the extra panel.
  • Press Shift + Tab to tab back to Add a Widget button and Press Enter.
  • Focus is now at bottom of site page being shown in Customizer

Expected result:
I would expect the focus to stay on the Add a Widget button.

Attachments (5)

28835.patch (2.2 KB) - added by sathishn 6 years ago.
Bug Fix
28835_1.patch (1.9 KB) - added by sathishn 6 years ago.
Remove console.log and exported patch from src
28835-3.patch (1.5 KB) - added by sathishn 6 years ago.
Updated spaces to tab
28835_4.patch (1.5 KB) - added by sathishn 6 years ago.
Fixed formatting of code in the patch
28835_5.patch (1.5 KB) - added by sathishn 6 years ago.

Download all attachments as: .zip

Change History (11)

#1 @SergeyBiryukov
6 years ago

  • Keywords needs-patch added
  • Milestone changed from Awaiting Review to 4.0

#2 @celloexpressions
6 years ago

The add-widgets panel html is at the end of the page, so we'll need to auto-focus when going out of that panel just like we do going into it. Should probably return to the add-widget button from both the top and the bottom of that panel.

This ticket was mentioned in IRC in #wordpress-dev by celloexpressions. View the logs.


6 years ago

@sathishn
6 years ago

Bug Fix

#4 @sathishn
6 years ago

  • Keywords has-patch added; needs-patch removed

@sathishn
6 years ago

Remove console.log and exported patch from src

@sathishn
6 years ago

Updated spaces to tab

@sathishn
6 years ago

Fixed formatting of code in the patch

@sathishn
6 years ago

#5 @celloexpressions
6 years ago

Per IRC, 28835_5.patch is good to go. However, the patch may be mis-formatted or something - it doesn't apply for me. Manually merging and testing it, it works as expected.

#6 @SergeyBiryukov
6 years ago

  • Owner set to SergeyBiryukov
  • Resolution set to fixed
  • Status changed from new to closed

In 29237:

Customizer: Avoid losing focus when adding widgets via keyboard.

props sathishn.
fixes #28835.

Note: See TracTickets for help on using tickets.