OpenCut-app / OpenCut-app/OpenCut
[A11Y] Missing ARIA labels across editor components
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 89.8k
- Forks
- 8.9k
- PR merge metrics
- No merged PRs in 30d
Description
Description
Only ~35 ARIA attribute occurrences exist across the entire editor. Most interactive elements lack proper accessibility attributes.
Missing ARIA Labels
- Timeline playhead: no `aria-label`
- Toolbar buttons: only `title` attributes (not ARIA)
- No `aria-live` regions for status updates (export progress, save status)
- Track mute/solo buttons: missing `aria-pressed`
- Selection box: no accessibility context
- No `role="progressbar"` on progress components
- Timeline structure not marked with ARIA regions
Expected
All interactive elements should have proper ARIA attributes for screen readers.
Files
- Most components in `apps/web/src/components/editor/`
- `apps/web/src/components/editor/panels/timeline/timeline-toolbar.tsx`
- `apps/web/src/components/editor/export-button.tsx`
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 auditing the editor components under apps/web/src/components/editor/, especially timeline-toolbar.tsx and export-button.tsx. Check the listed interactive controls and status or progress elements for the expected ARIA attributes and roles. Done means the identified editor interactions expose appropriate screen-reader labels, states, regions, and progress updates.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- accessibility, frontend
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 55/100