Skip to content

Neuron/validator table rows are clickable via onClick but not keyboard-operable #3952

Description

@JSONbored

Context

In src/components/metagraphed/neuron-table.tsx:173-193, each <tr> in the metagraph/validator table gets an onClick={onSelect ? () => onSelect(n.uid) : undefined} handler to drill into a per-UID snapshot, plus a cursor-pointer class signaling it's clickable. A <tr> has no implicit interactive role, tabIndex, or keyboard handler. The only keyboard-reachable path to the same action is a small nested <button> wrapping the UID value (lines 184-193) — clicking anywhere else in the row (the hotkey cell, stake cell, etc.) only works for mouse/pointer users. Keyboard and screen-reader users relying on the row's implied full-row affordance (suggested by cursor-pointer styling the whole row) have no way to trigger it except by finding the one small nested button.

Requirement

The full row's click-to-drill-in behavior must also be reachable via keyboard, not only through the one nested button.

Deliverable

  • File to change: src/components/metagraphed/neuron-table.tsx:173-193.
  • What "done" looks like concretely: either (a) make the <tr> itself keyboard-operable — add role="button", tabIndex={0}, and an onKeyDown handling Enter/Space to call the same onSelect — while being careful the nested UID <button> doesn't create a nested-interactive-element conflict (a <button> inside a role="button" row is invalid ARIA structure, so the nested button may need to stop propagation or the whole row's semantics may need reconsidering), or (b) remove the row-level cursor-pointer/onClick affordance and make the nested UID button the sole, clearly-styled entry point, with a visual treatment (e.g. an explicit "view" affordance) that doesn't imply the whole row is clickable when it isn't for keyboard users. Prefer (a) if it can be done without invalid nested-interactive markup; fall back to (b) if not.

Acceptance criteria

  • neuron-table.tsx appears in the diff
  • A keyboard-only user can reach and activate the row's drill-in action via Tab + Enter/Space, without needing to specifically target the small nested UID button
  • No invalid nested-interactive-element ARIA structure is introduced (verify with the browser's accessibility tree inspector, not just visually)
  • Mouse-click behavior on the row is unchanged
  • Includes a before/after screen recording (not just a static screenshot) demonstrating keyboard-only navigation reaching and activating a row, since keyboard focus/interaction can't be shown in a static image

Non-goals

  • Don't change what the drill-in action navigates to or what data it fetches.
  • Don't restyle the table's visual appearance beyond whatever focus-visible indicator this fix requires.

Size

Size: S — keep this PR small (aim for ≤10 files / ≤1000 LOC).

Part of #2542.

Metadata

Metadata

Assignees

No one assigned

    Labels

    gittensor:bugGittensor-scored bug fix or unsolicited PR — scores a 0.05x multiplier.

    Projects

    Status
    Todo

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions