mirror of
https://gh.wpcy.net/https://github.com/discourse/discourse.git
synced 2026-05-26 19:22:18 +08:00
d71878163f
Currently our keyboard shortcut modal (triggered by the `?` key or with
the keyboard icon at the bottom of the nav menu) has some issues that
makes it difficult to use with a screenreader. I'm addressing a number
of these issues here.
There are no significant visual changes to the keyboard shortcut modal
here, it's all structural/functional.
Markup
- moving from unordered lists back to tables — this is tabular data, so
a table is the most natural way to navigate it. Each row now has `<td
class="shortcut-description">` and `<td
class="shortcut-key">`, plus a screereader-only `<thead>` with
"Description" & "Key" column labels
- each table is associated with its category heading via aria-labelledby
so screenreader users get category context when landing inside a table.
- added an explicit aria-label in addition to the existing placeholder
Search
- `buildShortcut` now returns `{ shortcut, shortcutText, description }`
instead of one HTML string... the HTML structure was getting in the way
so searching `g` was working but not `gh`
- added `SEARCH_ALIASES` for modifier keys (alt, ctrl, cmd, meta,
windows enter/return, etc)
modifier keys so users can find shortcuts regardless of the icon used
for the shortcut (especially useful on macOS).
- filter splits the query into whitespace tokens so every token must
match somewhere, this handles "gh", "g h", "command /", "ctrl alt f",
and multi-word descriptions
- removed per-keystroke `.trim()` because it broke using the space bar
Translations
- Shortcuts are now separate, this avoids awkward ordering in some
languages
Added relevant specs for search to make sure this keeps working in the
future.
|
||
|---|---|---|
| .. | ||
| acceptance | ||
| fixtures | ||
