mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 09:55:06 +03:00
Miranda LimonczenkoandClaude Opus 5
21fccb0ecd
Closes FE-4097 https://github.com/user-attachments/assets/bc7cad1a-763e-469f-8a3b-e4d23bed94d9 _See bottom left of screen for screen reader captions._ ## Problem Two controls in the shared `/features/[slug]` template have no accessible name. Both live in the template, so both fire on all 79 feature pages. * The feature list dropdown trigger contains only a `List` icon. `button-name`, critical. * The breadcrumb back chevron wraps only a `ChevronLeft`. `link-name`, serious. ## Solution * Name both with `sr-only` text, matching the sibling prev and next controls in the same component and the theme switcher in the site header. * Label the product pill with its destination. It announced only "vector", with no indication it filters the catalog. Not an axe finding, since the product name already supplies a name. The label keeps the visible word so it satisfies WCAG 2.5.3 Label in Name. * Fix a stray `className="` inside the `iconClassName` string literal, which dropped the icons' width class. * Add `cursor-pointer` to `buttonClassName`. Tailwind 4 no longer sets a pointer cursor on buttons, so the middle control behaved differently from its two anchor siblings. This line belongs to FE-4227 and sits here only to keep two open PRs off adjacent lines of the same file. ## Manual testing 1. Open [/features/ai-integrations](https://zone-www-dot-com-git-www-features-chrome-access-1aef01-supabase.vercel.app/features/ai-integrations) using a Screenreader. 2. Tab through the three round controls at top right. They announce "Previous feature", "Browse all features", "Next feature". **Note:** The order of the elements is strange; captured in a separate ticket. 3. Tab to the round back control at top left. It announces "Back to all features". 4. Tab to the product pill beside it. It announces "All vector features", and the visible word "vector" is unchanged. 5. Hover each of the three round controls. All show a pointer cursor. 6. Run axe on the page. `button-name` and `link-name` report zero elements. Co-authored-by: Claude Opus 5 <noreply@anthropic.com>