Opened 10 years ago

Closed 9 years ago

#7847 closed bug (fixed)

Tabs: simple manipulation accessibility

Reported by: ezufelt Owned by:
Priority: minor Milestone: 1.10.0
Component: ui.tabs Version: 1.8.16
Keywords: a11y Cc:
Blocked by: Blocking:


Firefox 7.0.1 JAWS 13 Tabs demo 1.9pre


It is not possible to remove a tab, or to access the 'remove' control via keyboard.


  1. The 'remove' control needs to be capable of receiving keyboard focus.
  2. The 'remove' control should either be a button, or an anchor, or to at least carry the ARIA role semantics of button or link.

Change History (6)

comment:1 Changed 10 years ago by ezufelt

Additionally, after adding a tab focus is set to first focusable element in DOM.

After adding a tab focus should be set to 'Add' link, or to new tab.

comment:2 Changed 10 years ago by Scott González

Component: ui.coreui.tabs
Keywords: a11y added
Status: newopen

comment:3 Changed 9 years ago by Scott González


comment:4 Changed 9 years ago by Jörn Zaefferer

I've looked into this for a while. Since Tabs manage focus inside the widget, the remove button would've to be integrated into that focus handling, otherwise each tab's close button would be able to receive focus, breaking the keyboard navigation of the tabs themselves. How would you trigger a close when the close button can't be tabbed to? Would the cursor handling move focus to the close button, then to the next tab? Or bind escape key to close the active tab, and give the close span role="presentation" to hide it from screenreaders?

Since the manipulation is just a demo and not an actual part of the widget, do we really want to implement that in the demo?

If we keep/update it, the add dialog needs to handle the submit event - tabbing to the add button shouldn't be necessary.

comment:5 Changed 9 years ago by Scott González

From ARIA Authoring Practices:

Alt+Del - When deletion is allowed, with focus anywhere within the tab panel, pressing alt-del will delete the current tab and tab panel from the tabbed interface control. If additional tabs remain in the tabbed interface, focus goes to the next tab in the tab list. An alternative to providing a keystroke to close a tab is to provide a context menu that is associated with the tab title. When focus is on the tab, pressing Shift+F10 or pressing the right mouse button will open a context menu with the close choice

We should implement the Alt+Del functionality.

As for not having to tab to the Add button, that's already implemented. The dialog has a form and submitting the form adds the tab. However, the last field is a textarea, so pressing enter won't submit the form.

comment:6 Changed 9 years ago by Jörn Zaefferer

Resolution: fixed
Status: openclosed

Tabs: Update manipulation demo - implement alt+del shortcut to remove active tab. Fixes #7847 - Tabs: simple manipulation accessibility

Changeset: e3ab5f811a97c9fd79038c550aa86dcff0465d40

Note: See TracTickets for help on using tickets.