Skip to content

fix(frontend): name homepage controls and landmarks - #2867

Merged
DerekRoberts merged 3 commits into
mainfrom
fix/homepage-a11y
Oct 1, 2026
Merged

DerekRoberts merged 3 commits into
mainfrom
fix/homepage-a11y

Conversation

@DerekRoberts

Copy link
Copy Markdown
Member

The homepage fails the accessibility checks for a named home control, an actions column header, one main landmark, and a level-one heading.

Closes #2688

Description

The home icon is a link and a button with no accessible name, the actions column header is empty, the page title is a span, and the page body is not a main landmark. The header title is now an h1, the page body is a single main, the home control is named, and the actions column header is named for assistive tech.

Type of change

  • Bug fix (non-breaking change which fixes an issue)

How Has This Been Tested?

  • New unit tests
  • Updated existing tests

vitest run for Layout, Dashboard, and NotFound, plus npm run lint and npm run format:check, in a Node container.

Checklist

  • I have read the CONTRIBUTING doc
  • I have performed a self-review of my own code
  • My changes generate no new warnings
  • I have added tests that prove my fix is effective or that my feature works
  • New and existing unit tests pass locally with my changes

Copilot AI balanced review requested due to automatic review settings October 1, 2026 09:47

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot review overview

🟡 Changes recommended

The home link still contains a nested interactive button, creating invalid markup and duplicate focus targets.

Review effort: Balanced
Findings: 1 Medium severity

Open (1)
What changed in this PR

Improves homepage accessibility semantics and accessible naming.

Changes:

  • Adds heading and main landmarks.
  • Names home and table action controls.
  • Adds corresponding unit tests.
File Description
frontend/​src/​components/​Layout.tsx Adds landmarks and home-control labels.
frontend/​src/​components/​Dashboard.tsx Names the actions column.
frontend/​src/​components/​__tests__/​Layout.test.tsx Tests layout accessibility semantics.
frontend/​src/​components/​__tests__/​Dashboard.test.tsx Tests the actions header name.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment thread frontend/src/components/Layout.tsx Outdated
@github-actions

github-actions Bot commented Oct 1, 2026

Copy link
Copy Markdown

🚀 Deployments Available

@DerekRoberts DerekRoberts self-assigned this Oct 1, 2026
@DerekRoberts
DerekRoberts merged commit 4954003 into main Oct 1, 2026
24 checks passed
@DerekRoberts
DerekRoberts deleted the fix/homepage-a11y branch October 1, 2026 19:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

Accessibility issue: Semantic HTML, heading structure, and layout cleanups on /

2 participants