Opened 8 years ago

Closed 7 years ago

Last modified 7 years ago

#2296 closed defect (bug) (fixed)

FAQ question toggles accessibility

Reported by: joedolson's profile joedolson Owned by: obenland's profile obenland
Milestone: Priority: high
Component: Plugin Directory Keywords: ui-feedback


The FAQ is toggled directly from a dt element, which is not keyboard focusable. The toggle should be attached to a button element nested inside the dt element, so that it can be operated from the keyboard.

Attachments (1)

2296.diff (4.6 KB) - added by obenland 8 years ago.

Download all attachments as: .zip

Change History (11)

8 years ago

#1 @obenland
8 years ago

  • Keywords ui-feedback added; needs-patch removed

We need to find a solution for focus styles that don't impede mouse interactions

#2 @joedolson
8 years ago

What about using a transition on :hover and :focus so that there's a visible change that occurs on focus?

E.g., default state is as currently exists; :hover and :focus rotates 90 degrees then returns to position.

The movement would provide a visual indicator but the state would still return to a constant state.

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

7 years ago

#4 @joedolson
7 years ago

Also, a change in background color that indicates focus and current would probably work fine. Either way, the change in HTML to add the buttons is a *critical* feature for accessibility.

Last edited 7 years ago by joedolson (previous) (diff)

#5 @joedolson
7 years ago

  • Priority changed from normal to high

This ticket was mentioned in Slack in #meta by tellyworth. View the logs.

7 years ago

#7 @obenland
7 years ago

For future reference:

That could be resolved by moving .focus() to the FAQ answer, which can be made focusable using tabindex=-1, I'd think.

#8 @obenland
7 years ago

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

In 5166:

Plugin Directory: Make FAQ toggles accessible

Restores focus styles for keyboard navigation and adds a focusable element to
toggle from.

Fixes #2296.

#9 @obenland
7 years ago

In 5167:

Plugin Directory: Add back compat with existing FAQ markup

Fixes a bug where existing FAQs were not toggle-able due to the missing button.

See #2296.

#10 @obenland
7 years ago

In 5195:

Plugin Directory: Insert toggle button through JS

KSES doesn't like buttons apparently and this should be a front-end change

See #2296, [5166], [5167].

Note: See TracTickets for help on using tickets.