[Bug] AccountMenu: a radio group inside role="menu", and the person's own name at 1.14:1 contrast #745

New issue

Closed

opened 2026-09-22 05:04:56 +00:00 by claude-bot · 1 comment

claude-bot commented

2026-09-22 05:04:56 +00:00

Collaborator

Found by the journeys harness's axe gate (#726) on 2026-09-22, scanning the new shell (#742) with the account menu open. Both are in lane 0's design system (#364).

aria-required-children, critical. src/ui/Menu/index.jsx puts role="menu" around everything in the panel, and AccountMenu places the identity block and the theme strip (a Segmented, role="radiogroup") inside it. A menu may own only menuitems, groups and separators. Fix: the identity block goes in Menu's head slot (outside the menu role); the theme becomes a role="group" labelled "Theme" of three menuitemradio buttons with aria-checked, drawn as the same strip, with the arrow keys moving between them as they do on the segmented control.
.menu__name and .menu__pron at 1.14:1 (#eaf0fb on #ffffff). .menu (Menu.css) sets background: var(--paper-raised) and no color, and the panel is a descendant of .appbar, which sets color: var(--chrome-ink), the ink for the dark chrome; the rows set their own colour, so only the name and pronouns inherit it. Fix: color: var(--ink) on .menu.

The harness records both as kind: "bug" in webapp/frontend/e2e/a11y-baseline.js, printed on every run; the fix removes those two entries.

Also, unrelated but found in the same pass: src/shell/AppFrame.jsx contains two literal NUL bytes in a cache key, which makes git and grep treat the file as binary. Replace with |.

Found by the journeys harness's axe gate (#726) on 2026-09-22, scanning the new shell (#742) with the account menu open. Both are in lane 0's design system (#364). 1. **`aria-required-children`, critical.** `src/ui/Menu/index.jsx` puts `role="menu"` around everything in the panel, and `AccountMenu` places the identity block and the theme strip (a `Segmented`, `role="radiogroup"`) inside it. A `menu` may own only `menuitem`s, groups and separators. Fix: the identity block goes in `Menu`'s `head` slot (outside the menu role); the theme becomes a `role="group"` labelled "Theme" of three `menuitemradio` buttons with `aria-checked`, drawn as the same strip, with the arrow keys moving between them as they do on the segmented control. 2. **`.menu__name` and `.menu__pron` at 1.14:1** (`#eaf0fb` on `#ffffff`). `.menu` (`Menu.css`) sets `background: var(--paper-raised)` and no `color`, and the panel is a descendant of `.appbar`, which sets `color: var(--chrome-ink)`, the ink for the dark chrome; the rows set their own colour, so only the name and pronouns inherit it. Fix: `color: var(--ink)` on `.menu`. The harness records both as `kind: "bug"` in `webapp/frontend/e2e/a11y-baseline.js`, printed on every run; the fix removes those two entries. Also, unrelated but found in the same pass: `src/shell/AppFrame.jsx` contains two literal NUL bytes in a cache key, which makes git and grep treat the file as binary. Replace with `|`.

claude-bot referenced this issue

2026-09-22 05:05:27 +00:00

The journeys harness: the app stack in Docker, a fake issuer, bot and AI, Playwright in three projects with an axe gate (#726) #746

claude-bot referenced this issue

2026-09-22 05:09:57 +00:00

Build lane 1: the shell, Home and you (SH-1 to SH-9, HOME-1 to HOME-7) #727

claude-bot referenced this issue from a pull request that will close it,

2026-09-22 05:24:30 +00:00

The account menu's identity block and theme strip are valid menu children, and its name is readable (#745) #747

rbrooks referenced this issue from a commit

2026-09-22 05:24:31 +00:00

fix(frontend): the account menu's identity block and theme strip are valid menu children (#745)

claude-bot referenced this issue

2026-09-22 05:33:46 +00:00

The journeys harness: the app stack in Docker, a fake issuer, bot and AI, Playwright in three projects with an axe gate (#726) #746

claude-bot closed this issue

2026-09-22 05:40:07 +00:00

claude-bot referenced this issue from a commit

2026-09-22 05:40:08 +00:00

Merge PR #747: the account menu's identity block and theme strip are valid menu children, and its name is readable (#745)

claude-bot commented

2026-09-22 05:40:13 +00:00

Author

Collaborator

Fixed in #747, merged on green CI: Menu renders its head outside the role="menu" element and AccountMenu passes the identity block as head; the theme strip is a role="group" of three menuitemradio buttons that the menu treats as one stop; .menu sets color: var(--ink) so nothing in the panel inherits the chrome's ink; the NUL bytes in AppFrame.jsx are gone. The harness's two BUG baseline entries come out with #746's next rebase, and the axe gate proves they are gone.

Fixed in #747, merged on green CI: `Menu` renders its `head` outside the `role="menu"` element and `AccountMenu` passes the identity block as `head`; the theme strip is a `role="group"` of three `menuitemradio` buttons that the menu treats as one stop; `.menu` sets `color: var(--ink)` so nothing in the panel inherits the chrome's ink; the NUL bytes in `AppFrame.jsx` are gone. The harness's two `BUG` baseline entries come out with #746's next rebase, and the axe gate proves they are gone.

claude-bot referenced this issue

2026-09-22 05:40:39 +00:00

The journeys harness: the app stack in Docker, a fake issuer, bot and AI, Playwright in three projects with an axe gate (#726) #746

rbrooks referenced this issue from a commit

2026-09-22 05:59:02 +00:00

fix(e2e): the last two of Dana's old surname, after rebasing on #745's fix (#726)

rbrooks referenced this issue from a commit

2026-09-22 06:12:05 +00:00

fix(e2e): the account popover is the menu's box since #745, and Forgejo wants upload-artifact@v3 (#726)

claude-bot referenced this issue

2026-09-22 06:32:19 +00:00

The seven journeys as end-to-end tests: the Playwright harness #726