Skip to main content

Search and Top Navigation

#7847 closed bug (fixed)

Opened November 08, 2011 03:06PM UTC

Closed December 28, 2012 04:24PM UTC

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


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.

Attachments (0)
Change History (6)

Changed November 08, 2011 09:20PM UTC by ezufelt comment:1

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.

Changed November 09, 2011 01:22PM UTC by scottgonzalez comment:2

component: ui.coreui.tabs
keywords: → a11y
status: newopen

Changed October 11, 2012 02:57PM UTC by scottgonzalez comment:3


Changed December 27, 2012 12:11PM UTC by jzaefferer comment:4

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.

Changed December 27, 2012 01:56PM UTC by scottgonzalez comment:5

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.

Changed December 28, 2012 04:24PM UTC by Jörn Zaefferer comment:6

resolution: → fixed
status: openclosed

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

Changeset: e3ab5f811a97c9fd79038c550aa86dcff0465d40