fix(accessibility): correct control announcements and sidebar traversal#13491

Approvability

Verdict: Approved at 092cb2d

Macroscope's review found this PR approvable — This is a focused accessibility bug fix that corrects screen-reader names, landmarks, and sidebar traversal while preserving visual layout and default scroll behavior. Production changes are localized to existing mobile connection fields and web sidebar semantics, with targeted tests added.

^{You can add or adjust custom eligibility rules. Learn more.}

Review in Change Stack →

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

No actionable comments were generated in the recent review. 🎉

Merge Risk: ⚪ Minimal · up to 37cfd

The sidebar retains its mobile navigation landmark and keyboard-focusable thread rows. No actionable accessibility regression remains evident, so the change presents minimal merge risk.

Security Architecture Review

Security architecture risk: 🔵 Low · up to 37cfd

The changes affect how existing controls and information are announced and navigated. The review found no introduced security issue, but security coverage is incomplete.

Retained concerns No architecture-level concerns identified.

• Fix all pre-merge checks with AI

_{Comment @coderabbitai help to get the list of available commands.}

Thanks for working on this, and for writing up what you tested so clearly. I use NVDA on Windows, and after this landed I noticed two regressions there:

1. The thread list is no longer a list. With role="presentation" on the <ul>, NVDA doesn't announce "list with N items", and the L and I quick-nav keys don't find the threads.
2. Settle and Snooze are gone in browse mode. Those buttons sit inside each row's role="button" div. The new aria-label on that div makes NVDA read the label in place of the row's contents, so the nested buttons never show up. Before this change NVDA read the contents, buttons included.

My guess is that the VoiceOver boundary you hit came from the focusable scroll viewport rather than the list. A focusable scroll area is a common cause of VoiceOver interaction groups, and this PR already fixed that with viewportTabIndex={-1}.

So I put together a branch that keeps that fix, aria-current, and your screen-reader-only title (which already puts the title first). It only reverts the list role and the row labels:

• Branch: https://github.com/akj/t3code/tree/fix/sidebar-nvda-row-actions
• Diff: https://github.com/pingdotgg/t3code/compare/main...akj:t3code:fix/sidebar-nvda-row-actions

Could you try it with VoiceOver? The main questions: can you move through the threads linearly without interacting into the list first, and do the titles still read first? If the list still traps VoiceOver, I'll drop that half and keep only the label change, so NVDA gets its buttons back either way.

Longer term, the sturdier fix is probably to stop nesting Settle and Snooze inside a row that is itself a button, so no screen reader has to guess what to do with it. That's a bigger change for another PR.

Hey, my apologies. I only got a Windows device a month ago, so I'm still learning NVDA. Will definitely test this and let you know.

Thanks for offering to test this. We have a new idea to try in place of my earlier branch: akj:fix/sidebar-row-sibling-actions. Each row gets a real button that opens the thread, and Snooze, Settle, and the other actions sit beside it instead of inside it. That should work the same way across screen readers. The details and sources are in #13959.

If you get a chance, could you try it with VoiceOver in Safari and Chrome, under both DOM order and Grouping items navigation? I'd most like to know:

• whether you can reach Snooze and Settle on a row,
• whether the title reads first, and
• whether you have to interact with the list before you can move through the threads.