a11y: make database action links keyboard-operable#543
Open
xpoes123 wants to merge 1 commit into
Open
Conversation
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The download (TXT / CSV / JSON) and section-jump links in
client/db/index.jsxwere<a>elements without anhref, so they were invisible to keyboard navigation. This PR makes all five interactive without changing their appearance or click behavior.Problem
In
client/db/index.jsx, five<a class="... clickable">elements relied solely ononClickhandlers with nohref. Anchor elements withouthrefare excluded from the tab order, so keyboard users could not download results or jump between the tossup and bonus sections.Changes
role="button",tabIndex={0}, and anonKeyDownhandler (activating on Enter and Space) to each of the five affected links: the TXT, CSV, and JSON download links and the "Jump to bonuses" / "Jump to tossups" scroll links.onClickhandlers and theclickableCSS class are preserved as-is; visual appearance is unchanged.Risk & testing
The change is purely additive — no existing logic is altered. The
onKeyDownguard checksevent.key === 'Enter' || event.key === ' 'and callsevent.preventDefault()before the action to avoid page-scroll on Space.semistandardandnode --checkpass.