Will It Vibe?Select element with no accessible name
Part of Documentation, UX & Accessibility, which counts for 15% of the overall score. When this check fires it deducts 8 points from that category, once per scan, no matter how many places it turns up.
What it detects
A <select> with no associated <label for>/htmlFor, aria-label, or aria-labelledby has no announced name, so a screen-reader user hears only "combo box" with no idea what it controls. Heuristic: a <select> nested directly inside a still-open <label> is detected through a bounded 300-character lookback window, not a real parser, and a name set at runtime through JS is invisible to a static scan.
Why it matters
A select menu with no announced name reads to a screen reader as just "combo box", so the user has to guess what choosing an option will actually do. This is a common gap in custom-styled dropdowns where the visual label next to the control was never wired up with a for/id pair. It costs nothing to fix and blocks the field completely for anyone using assistive technology.
How to fix it
Add a <label for="field-id"> (htmlFor in JSX) pointing at the select's id, or wrap the select directly inside the label element. Where a visible label truly does not fit the design, add aria-label="..." directly on the select instead. Do not rely on a placeholder-style first <option> as the only label; it disappears from the accessible name once a real choice is selected.
The paid report includes a ready-to-paste prompt for your AI coding agent for every check it finds, pointed at the exact findings from your scan. See pricing
Does your repo trip this check?
Paste a GitHub URL or drop a project folder. Scans run in your browser and take seconds.
Scan your repo