microsoft / microsoft/pxt-microbit
[Screen Reader] Narrator focus outline does not fully cover tab items and Shareable link box in Share dialog
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 804
- Forks
- 721
- Avg merge
- 2d 9h
- Merged PRs (30d)
- 2
Description
Describe the bug
When using Windows 11 Narrator, the screen reader focus (blue outline) does not fully cover the focused elements (Blocks/Python/JavaScript tab items and Shareable link box) in the Share dialog during keyboard navigation.
Steps to reproduce the behavior:
- Enable Windows 11 Narrator.
- Navigate to Microsoft MakeCode for micro:bit.
- Use Tab to focus on a project card containing the Share button.
- Continue pressing Tab and Enter to open the Share dialog.
- Press Tab to move focus to the Share edit toggle.
- Press Caps Lock + Space to disable scan mode.
- Use Left/Right Arrow keys to navigate among Blocks / Python / JavaScript tab items.
- Observe the Narrator focus outline.
- Press Tab to move focus to the Shareable link box.
- Observe the Narrator focus outline.
Actual behavior
The Narrator focus outline does not fully cover the focused tab items and Shareable link box in the Share dialog.
Expected behavior
The Narrator focus outline fully encloses the focused element, clearly indicating the active tab item or Shareable link box.
Screen Recording
https://github.com/user-attachments/assets/8bea9333-d020-4c52-9898-18e6430d83fc
Additional context
1.OS: Windows 11 25H2
2.Browser: Chrome, Edge, and Firefox
3.makecode.microbit.org version: 8.1.26
4.Microsoft MakeCode version: 12.3.21
Contributor 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.
Research direction
Reproduce the issue in the Share dialog at makecode.microbit.org/beta using Windows 11 Narrator, following the keyboard steps in the report. Inspect the Share dialog's Blocks, Python, and JavaScript tab items and Shareable link box; done means the Narrator focus outline fully encloses each focused element in Chrome, Edge, and Firefox.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- accessibility, frontend, web-dev
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 55/100