Skip to content

Accessibility: dialogs lack roles/focus traps, piece rename is click-only, all canvas operations are pointer-only #104

@dompm

Description

@dompm

Basics first — this is a canvas-heavy app so full canvas a11y is a long road, but the chrome around the canvas has cheap wins:

  1. Dialogs: MoveConfirmDialog.tsx:27-56 has no role="dialog", no aria-modal, no focus trap — focus Tabs straight out to the canvas behind the backdrop. The Tutorial loading dialog (Tutorial/Tutorial.tsx:416-435) reuses the same markup with the same gaps. ShortcutsOverlay and TutorialBar set role="dialog"/aria-modal but don't move or trap focus either. A tiny shared <Modal> (role, aria-modal, initial focus, focus trap, Esc handling that stops propagation — see the keyboard issue) fixes all four.
  2. Piece rename is a click-only <span> (PieceProperties.tsx:94-115) — not focusable, no role="button"/tabIndex/keydown. Keyboard users cannot rename pieces.
  3. Popover toggles (ResultPanel.tsx:1519, SheetPanel.tsx:489) lack aria-expanded/aria-haspopup.
  4. Pointer-only canvas operations: no keyboard alternative for selecting pieces, nudging texture transforms, or moving vertices. A pragmatic first step: arrow-key nudge (+Shift for coarse) for the selected piece's transform on the sheet panel, and Tab-cycling selection through pieces. Pairs naturally with the docked inspector (Docked right-side inspector (replace floating piece-properties popover) #34), which gives keyboard users a focusable home per piece.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions