Description
Many icon-only <button> elements across the app use the title attribute but lack aria-label. While title provides a tooltip, it is not reliably read by screen readers. Adding aria-label ensures all users can understand button purposes.
Locations (key files)
frontend/src/components/ActivityBar.tsx:38-75 — 7 buttonsfrontend/src/components/Sidebar.tsx — file items, AI panel action buttonsfrontend/src/components/PaneHeader.tsx:34-40frontend/src/components/ShareModal.tsx:87-92,112-135,148-154,170-180,186-191frontend/src/components/Titlebar.tsx:89-117frontend/src/components/UserDropdown.tsx:134-164
Suggested Fix
For each <button> that contains only an icon (no visible text label), add aria-label={...} with the same descriptive text currently in title. Example:
<button title="Settings" aria-label="Settings">
Difficulty: Easy
Estimated Time: 45 minutes
Description
Many icon-only
<button>elements across the app use thetitleattribute but lackaria-label. Whiletitleprovides a tooltip, it is not reliably read by screen readers. Addingaria-labelensures all users can understand button purposes.Locations (key files)
frontend/src/components/ActivityBar.tsx:38-75— 7 buttonsfrontend/src/components/Sidebar.tsx— file items, AI panel action buttonsfrontend/src/components/PaneHeader.tsx:34-40frontend/src/components/ShareModal.tsx:87-92,112-135,148-154,170-180,186-191frontend/src/components/Titlebar.tsx:89-117frontend/src/components/UserDropdown.tsx:134-164Suggested Fix
For each
<button>that contains only an icon (no visible text label), addaria-label={...}with the same descriptive text currently intitle. Example:Difficulty: Easy
Estimated Time: 45 minutes