Announce moves to screen readers and make the board one tab stop
Nobody has claimed this yet.
Assessment
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Newbie friendliness
- 55/100
- Issue type
- Feature
- Clarity
- Clearly specified
- Activity status
- Active
- Tech stack
- javascript
- Domain
- accessibility, frontend
Research direction
Read js/board.js:23-24 and js/board.js:99-136 for square creation and keyboard focus, then trace move handling in js/game.js:255-258 and the live region in index.html:25-27. Review css/board.css for animation rules and run npm test and npm run lint. Done when the board is one Tab stop, screen readers announce moves and check, and reduced motion is respected.
Written by the indexing model from the issue text.
Description
Summary
Every square is in the tab order, so a keyboard user presses Tab 64 times to get past the board. The only live region announces whose turn it is, never the move that was played or that the king is in check.
Where
js/board.js:23-24(role="gridcell",tabindex="0"on every square; norole="row"parents)js/board.js:99-136(keyboard handler andfocusSquare)index.html:25-27(#game-statuslive region),js/game.js:255-258- CSS has no
prefers-reduced-motionrule
Proposal
- Roving tabindex: one square has
tabindex="0", the rest-1, updated infocusSquare. - Wrap squares in
role="row"containers. - Announce the move in the live region, for example "White knight to f3. Check. Black's turn", built from the existing move object.
- Give legal targets of the selected piece a non-visual marker (label suffix or
aria-describedby). - Add a
prefers-reduced-motionrule.
Who benefits
Keyboard and screen reader users. The README lists keyboard navigation and ARIA support as features.
Acceptance criteria
- One Tab press moves focus past the board
- A screen reader announces each move and check
- Animations are reduced when the user asks for reduced motion
Getting started
- Relevant files:
js/board.js,js/game.js,index.html,css/board.css - How to run tests:
npm install, thennpm testandnpm run lint - Related docs:
docs/ARCHITECTURE.md,.github/CONTRIBUTING.md
Filed by repo-audit/full-audit at 8a2c86c. Severity: medium. Effort: M. audit-key: enhancement|js/board.js|createBoard.tabindex
- Dominant language
- JavaScript
- Stars
- 4
- Forks
- 2
- PR merge metrics
- No merged PRs in 30d
Getting set up
- No Dockerfile or Docker Compose file
- Has a pull request template
- Read the contributing guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from TMHSDigital/Static_Chess
-
enhancement good first issue severity: medium
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
TMHSDigital/Static_Chess#53 ·
-
documentation good first issue severity: low
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
TMHSDigital/Static_Chess#49 ·
-
documentation good first issue severity: low
Difficulty 2/5 1-3 hours Newbie friendliness 83/100
TMHSDigital/Static_Chess#48 ·
-
documentation severity: medium
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
TMHSDigital/Static_Chess#47 ·
-
documentation good first issue severity: low
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
TMHSDigital/Static_Chess#46 ·
All issues in TMHSDigital/Static_Chess
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 79/100
Maintainers usually reply within 1 day
-
good first issue tests
Difficulty 1/5 1-3 hours Newbie friendliness 68/100
Maintainers usually reply within 1 day
-
bug role: dev-lead
Difficulty 2/5 1-3 hours Newbie friendliness 66/100
briangwalker/TrussExplorer#424 ·
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 80/100
eliasstravik/herdr-projects#1032 ·
-
enhancement good first issue
Difficulty 2/5 1-3 hours Newbie friendliness 90/100