Label the Navbar account menu trigger for screen readers
Nobody has claimed this yet.
Assessment
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Newbie friendliness
- 92/100
- Issue type
- Bug
- Clarity
- Clearly specified
- Activity status
- Active
- Tech stack
- react, typescript
- Domain
- accessibility, frontend
Research direction
Start in src/components/Navbar.tsx at Dropdown.Trigger and compare the existing aria-label in src/components/ThemeSwitcher.tsx. Check the trigger's accessible name and keyboard flow: Tab to focus, Enter to open, and Escape to close; verify the Sign Out item and Sign in button are reachable and named. Done when the acceptance checks pass and pnpm lint and pnpm typecheck succeed.
Written by the indexing model from the issue text.
Description
What to build
Screen readers announce the account menu trigger in the navbar as just "button". Give the trigger an aria-label such as "Account menu", mark the caret icon aria-hidden, and check that the "Sign Out" item and the "Sign in" button are reachable and named by keyboard alone.
The file it touches
src/components/Navbar.tsx (Dropdown.Trigger; compare aria-label in src/components/ThemeSwitcher.tsx, which already does this).
Acceptance check
- The trigger has an accessible name (check in the browser devtools Accessibility panel, or with
getByRole("button", { name: "Account menu" })in a test). - Tab reaches the trigger, Enter opens the menu, Escape closes it. Say what you tested in the PR.
pnpm lintandpnpm typecheckpass.
New here? Setup is in docs/getting-started/setup.md; the first-PR walk-through is docs/getting-started/first-contribution.md.
- Dominant language
- TypeScript
- Stars
- 19
- Forks
- 94
- PR merge metrics
- No merged PRs in 30d
Getting set up
- No Dockerfile or Docker Compose file
- Has a pull request template
- Read the contributing guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from DevDogsUGA/DogDays
-
import-export
Difficulty 2/5 1-3 hours Newbie friendliness 88/100
DevDogsUGA/DogDays#788 ·
-
import-export
Difficulty 2/5 1-3 hours Newbie friendliness 92/100
DevDogsUGA/DogDays#785 ·
-
Frontend time-gaps
Difficulty 2/5 1-3 hours Newbie friendliness 86/100
DevDogsUGA/DogDays#784 ·
-
good first issue polish
Difficulty 2/5 1-3 hours Newbie friendliness 88/100
DevDogsUGA/DogDays#780 ·
-
good first issue polish
Difficulty 1/5 1-3 hours Newbie friendliness 88/100
DevDogsUGA/DogDays#779 ·
All issues in DevDogsUGA/DogDays
Similar issues
-
affected/v17 affected/v18 area/frontend type/bug
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
umbraco/Umbraco-CMS#24186 ·
Maintainers usually reply within 2 days
-
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
better-auth/better-auth#11723 · 1 reaction ·
Maintainers usually reply within 1 day
-
area: docs difficulty: easy documentation good first issue
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
Maintainers usually reply within 1 day
-
Worker-Erstellung bricht langsame Git-Worktree-Checkouts nach 20 Sekunden abPossibly taken @KajoVanBuyten claimed this today. Open
Difficulty 2/5 1-3 hours Newbie friendliness 69/100
AgentSystemLabs/agent-office#367 ·
Maintainers usually reply within 1 day