Metabase: the sidebar items that screen readers read twice

The question

Using VoiceOver, every sidebar item announced its name twice and was read as a group, which adds noise and slows anyone navigating by keyboard and screen reader. For example, Home read as 'Home icon, Home, Home'.

What it does

• Root cause: each item is a row wrapping a link. The row carried an aria-label equal to the item's name, while the link inside was already named by the same visible text, so the name existed twice in the accessibility tree, and labelling the container made it announce as a named group.
• The fix treats the row as a plain layout container and moves the item's name and its selected state onto the control that actually takes focus, the link or button. Each item now announces once, with its role. Items with a custom descriptive label keep it, read once on the link.
• Because the label moved, the unit tests that located rows by aria-label now query the named link. Putting the selected state on the control let those assertions drop DOM traversal, which keeps them idiomatic for the project's linter.

Results

Issue 86191 in metabase/metabase. I set up the full toolchain locally (Node, a JDK, Clojure and the compiled ClojureScript) to run the suite rather than guess.

What broke, and what is still wrong

• Accessibility is craft: the smallest details decide whether a tool is usable for everyone.
• A fix that feels one line long still needs care: tracing the accessibility tree, keeping scope tight and moving the tests honestly.
• Working in a large unfamiliar open-source codebase means reading it well before changing it.

Caveat. The pull request has not been merged. Whether it lands is the maintainers' call.