microsoft / microsoft/pxt-microbit

[Screen Reader] Project card selection state (selected/unselected) is not announced on “View All My Projects” page during keyboard navigation

Open
#6,979 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

P2 screenreader
Dominant language
TypeScript
Stars
804
Forks
721
Avg merge
2d 9h
Merged PRs (30d)
2

Description

Describe the bug
When using a screen reader (Windows Narrator or macOS VoiceOver), the selection state of project cards (represented by the selected/unselected circle icon) is not announced on the “View All My Projects” page during keyboard navigation.

Steps to reproduce the behavior:

  1. Enable a screen reader:
    • Windows Narrator (Windows 11) or
    • VoiceOver (macOS)
  2. Navigate to Microsoft MakeCode for micro:bit.
  3. Tab to the “View All” button and press Enter.
  4. Open the “View All My Projects” page.
  5. Continue pressing Tab until focus reaches a project card.
  6. Press Enter repeatedly to toggle selection.
  7. Observe the screen reader output.

Actual behavior
The screen reader does not announce any change in selection state (selected or unselected) for the project card.

Expected behavior
The screen reader should announce the correct selection state (e.g., “selected” / “not selected”) when the project card is focused and toggled.

Screen Recording
https://github.com/user-attachments/assets/48cf9f56-9477-477e-a01b-f8f33580783e

Additional context
1.OS: Windows 11 25H2 & Mac Mini M2 macOS Tahoe 26.5.1
2.Browser: Chrome, Edge, Firefox, and Safari
3.makecode.microbit.org version: 8.1.28
4.Microsoft MakeCode version: 12.3.24
5.Screen Readers: Narrator and VoiceOver

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue on the “View All My Projects” page with Narrator or VoiceOver, then inspect the project card’s focus and toggle handling. Verify the card’s accessibility state changes when Enter toggles selection, and confirm the screen reader announces “selected” and “not selected” across the reported browsers.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
accessibility, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
58/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.