Allow keyboard navigation for selecting the language
Open, Needs TriagePublic2 Estimated Story Points
Actions

Description

The language selection element can't be reached when using keyboard navigation.

W3 example: https://www.w3.org/WAI/ARIA/apg/patterns/menubar/examples/menubar-navigation/
Better example: https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/examples/menu-button-actions-active-descendant/

Acceptance Criteria

The language selection can be focused using the tab key.
Pressing the space bar expands the language selection menu.
The cursor up/down keys can be used to highlight an option.
The Enter and the space bar key can be used to select an option.

Event Timeline

kai.nissen created this task.Apr 4 2024, 7:41 AM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptApr 4 2024, 7:41 AM

Maintenance_bot added a project: WMDE-FUN-Team.Apr 4 2024, 8:30 AM

AbbanWMDE updated the task description. (Show Details)Apr 4 2024, 10:16 AM

kai.nissen updated the task description. (Show Details)Apr 9 2024, 10:53 AM

kai.nissen set the point value for this task to 5.

kai.nissen added a project: WMDE-FUN-Sprint-2024-04-09.

kai.nissen moved this task from Accessibility Improvements to Current Sprint on the WMDE-Fundraising-Tech board.Apr 11 2024, 9:39 AM

Tanuja_Doriya claimed this task.Apr 15 2024, 2:49 PM

Tanuja_Doriya moved this task from Todo to Doing on the WMDE-FUN-Sprint-2024-04-09 board.

AbbanWMDE updated the task description. (Show Details)Apr 18 2024, 1:01 PM

AbbanWMDE updated the task description. (Show Details)

gabriel-wmde changed the point value for this task from 5 to 3.Apr 23 2024, 9:54 AM

gabriel-wmde added a project: WMDE-FUN-Sprint-2024-04-23.Apr 23 2024, 10:02 AM

CorinnaHillebrand_WMDE moved this task from Todo to Doing on the WMDE-FUN-Sprint-2024-04-23 board.Apr 23 2024, 10:06 AM

https://github.com/wmde/fundraising-app-frontend/pull/367

Tanuja_Doriya removed Tanuja_Doriya as the assignee of this task.Mon, Apr 29, 7:42 AM

Tanuja_Doriya moved this task from Doing to Review on the WMDE-FUN-Sprint-2024-04-23 board.

Tanuja_Doriya subscribed.

we should also do:

add another aria label to the drop down item: "Sprachauswahl öffnen/ open language selection" (new entry in fundraising-frontend-content)
add aria-haspopup=true to the item

(- research whether there is something like an aria indicator for screenreaders that tells the user that this is the language switcher/selector on the page)

CorinnaHillebrand_WMDE moved this task from Review to Todo on the WMDE-FUN-Sprint-2024-04-23 board.Mon, Apr 29, 8:36 AM

AbbanWMDE moved this task from Todo to Review on the WMDE-FUN-Sprint-2024-04-23 board.Thu, May 2, 8:34 AM

gabriel-wmde changed the point value for this task from 3 to 2.Tue, May 7, 10:11 AM

gabriel-wmde added a project: WMDE-FUN-Sprint-2024-05-07.

Abban: https://mattermost.wikimedia.de/swe/pl/f6e7peiodpfdmk89i8sp6z81xa

Deployed here: https://testing01.wikimedia.customers.manitu.net

Tanuja_Doriya moved this task from Todo to Test on the WMDE-FUN-Sprint-2024-05-07 board.Mon, May 13, 11:30 AM

AbbanWMDE moved this task from Test to Doing on the WMDE-FUN-Sprint-2024-05-07 board.Wed, May 15, 1:34 PM

PR for an alternate version: https://github.com/wmde/fundraising-app-frontend/pull/392

Deployed the alternative to https://testing02.wikimedia.customers.manitu.net

AbbanWMDE moved this task from Doing to Review on the WMDE-FUN-Sprint-2024-05-07 board.Thu, May 16, 11:20 AM

kai.nissen added a project: WMDE-FUN-Sprint-2024-05-21.Tue, May 21, 10:14 AM