TanStack / TanStack/tanstack.com
Accessibility: Empty buttons and missing skip navigation on tanstack.com (WCAG scan)
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 1.1k
- Forks
- 401
- Avg merge
- 18h 14m
- Merged PRs (30d)
- 56
Description
Accessibility Scan Results for tanstack.com
Score: 73/100 (Grade C) — 5 issues found
I ran an automated WCAG accessibility scan on tanstack.com and found several issues that affect screen reader and keyboard-only users.
Issues Found
1. 2 empty buttons with no accessible name (Critical — WCAG 4.1.2 Level A)
Buttons without accessible names are invisible to screen reader users. They hear "button" with no context of what the button does.
Fix: Add visible text, aria-label, or aria-labelledby to each button:
<!-- Before: icon-only button -->
<button><svg>...</svg></button>
<!-- After -->
<button aria-label="Toggle theme"><svg>...</svg></button>
2. 1 form input missing associated label (Serious — WCAG 1.3.1 Level A)
A form input without a label is inaccessible to screen reader users who cannot determine what information is expected.
Fix: Associate a <label> with the input, or use aria-label:
<!-- Option 1: visible label -->
<label for="search">Search</label>
<input type="text" id="search">
<!-- Option 2: aria-label (when visual label is not desired) -->
<input type="text" aria-label="Search documentation">
3. Missing skip navigation link (Serious — WCAG 2.4.1 Level A)
Keyboard-only users must tab through every navigation element on every page load without a skip-nav link.
4. No ARIA landmark regions found (Minor — WCAG 1.3.1 Level A)
The page may be missing semantic landmark elements (<main>, <nav>, <header>, <footer>) or equivalent ARIA roles, which help screen reader users understand page structure.
Why This Matters
The empty buttons are Critical-level issues that make interactive elements completely unusable for assistive technology users. Adding aria-label attributes is a quick fix with high impact.
Scanned with AccessScore — free WCAG/ADA accessibility checker. Full report available at https://accessscore.autonomous-claude.com/?url=https://tanstack.com
Contributor guide
No contributing guide indexed for this repository
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.
Research direction
Start by rerunning the WCAG scan against tanstack.com and locating the two unnamed buttons, unlabeled input, missing skip-navigation link, and absent landmark regions reported there. Inspect the affected page structure and verify keyboard and screen-reader behavior; done means the reported findings are resolved and the scan confirms the accessibility improvements.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- accessibility, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100