test(desktop): enumerate failure and edge states for high-traffic surfaces

[Astro-Han]

Problem

Storybook is where a surface's states become simultaneously visible, and most of ours are not in it: 27 files with stories against 189 product .tsx.

Depth is not the problem — 195 story variants across those 27 files, with settings-pages at 42, module-hubs 29, app-shell 24, session-workbar 23. The gap is breadth.

Three findings already report the same shape from different angles:

• refactor(design-system): finish wiring the Maka theme to Astryx's token seams #3446 F5: "of the 28, 0 render on the reference screen and only 2 render across 7 stories probed … A distribution assertion on one or two reference screens would not catch this and will not defend it afterwards."
• test(desktop): expand a11y coverage audit to chat, tool results, and error states #3893 names 10 surfaces with no a11y audit coverage — chat rendering, tool results, error states, diff viewer, terminal, browser panel, task panel, daily review, agent graph, model picker.
• Sidenav column geometry and resize handle have no automated coverage #3834: a CSS comment cites e2e/sidebar-geometry.spec.ts as the guarantee for the sidenav's definite height; that file does not exist.

The states that never appear in normal use are the ones that never get tuned: empty, failed, loading, offline, unauthorised, very long text, very many rows.

Desired outcome

Not a repo-wide sweep. Take the surfaces #3893 already names and add stories for each one's failure and edge states, so both this gate and the a11y audit have something to run against. One surface per PR.

Open question for the thread: whether "a new surface enumerates its failure states" joins the review baseline, or stays a per-surface judgement. Better decided after the first few land.

AI use: Claude Code assisted with source and issue investigation; the analysis and conclusions are my own.

[liuxiaocs7]

Hi — I'd like to pick this up.

Agreed on the shape: not a repo-wide sweep, one surface per PR, starting from the surfaces #3893 already names.

Plan

For each surface I'll add stories for the states that never show up in normal use — empty, loading, failed, offline, unauthorised, very long text, very many rows — so both this gate and the #3893 a11y audit have a fixed target to run against. Where it makes sense each story gets a play / axe assertion so it's not just visual.

Surfaces, one PR each (a few already have a base story, so those PRs extend rather than create):

• Chat message rendering / streaming output
• Tool call results / expandable tool output — extends packages/ui/stories/tool-activity.stories.tsx — ✅ landed in test(desktop): story-cover the interrupted tool row after a turn abort #3951
• Model picker / provider selection — extends packages/ui/stories/model-picker.stories.tsx
• Error states / toast notifications — extends packages/ui/stories/toast.stories.tsx
• File diff viewer / change panel
• Terminal panel
• Browser panel
• Task management panel
• Daily review surface
• Agent graph visualization

I'll start with tool call results / expandable tool output (extends an existing story, and its failed / very-long / very-many-rows states are exactly the ones that never get exercised in normal use), and keep the first PR small so we can calibrate scope before the rest follow.

On the open question — whether "a new surface enumerates its failure states" joins the review baseline — agreed it's better decided after the first few land; leaving it open for now.

[liuxiaocs7]

take