facebook / facebook/docusaurus

Bug(navbar): languages and doc version drop downs are inaccessible via the keyboard and screen reader

オープン
#8,478 コメント 11 件 リアクション 0 件 担当者 0 名 GitHub で見る
bug domain: a11y status: needs more information
主要言語
TypeScript
スター
66.2k
フォーク
10k
平均マージ
1日 3時間
マージ済み PR(30日)
52

説明

### Have you read the Contributing Guidelines on issues?

- [X] I have read the [Contributing Guidelines on issues](https://github.com/facebook/docusaurus/blob/main/CONTRIBUTING.md#reporting-new-issues).

### Prerequisites

- [X] I'm using the latest version of Docusaurus.
- [X] I have tried the `npm run clear` or `yarn clear` command.
- [X] I have tried `rm -rf node_modules yarn.lock package-lock.json` and re-installing packages.
- [X] I have tried creating a repro with https://new.docusaurus.io.
- [X] I have read the console error message carefully (if applicable).

### Description

The languages and docs version drop-down menus are not accessible via the keyboard. This violates WCAG 2.1.1 which states that all functionalities on the website must be accessible via the keyboard. Drop-down menus don't fall under the exceptions of freehand drawing, or a game intended to teach a specific movement.
https://www.w3.org/WAI/WCAG21/Understanding/keyboard.html
https://developer.mozilla.org/en-US/docs/Web/Accessibility/Understanding_WCAG/Operable

### Reproducible demo

_No response_

### Steps to reproduce

1. Start NVDA
2. Navigate to https://docusaurus.io/
3. Tab to the 2.2.0 menu
4. The user is unable to activate the menu with the keyboard
5. Tab to English menu
6. The user is unable to activate the menu with the keyboard

https://user-images.githubusercontent.com/11358567/209265366-005966b3-ea8d-48bf-87c7-e22dad7d548a.mp4

### Expected behavior

I thought the menus would open automatically as I tabbed to them giving me the option to choose the doc version and language with the arrow keys and enter key. I also expect to be able to close the menu by pressing tab again.

### Actual behavior

I am unable to activate the menus at all with the keyboard.

### Your environment

- Public source code:
- Public site URL: https://docusaurus.io/
- Docusaurus version used: 2.2.0
- Environment name and version (e.g. Chrome 89, Node.js 16.4): Edge 108
- Operating system and version (e.g. Ubuntu 20.04.2 LTS): Windows 11

### Self-service

- [ ] I'd be willing to fix this bug myself.

コントリビューションガイド

コントリビューションガイドを開く

評価

この issue はまだ評価されていません。

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。