microsoft / microsoft/pxt-microbit

Default keyboard: Carousel cards are skipped during forward Tab and Enter navigation in "Live Coding" and "Courses"

Open
#6,873 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

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

Description

Describe the bug
When navigating the Live Coding and Courses categories using the default keyboard(Tab and Enter), after navigating via the right-aligned “See more” (carousel arrow) and landing on the first card of the third carousel section, subsequent cards in that carousel are skipped during forward Tab navigation.

Steps to reproduce the behavior:

  1. Navigate to https://makecode.microbit.org/beta.
  2. Press Tab repeatedly until focus moves to the Live Coding or Courses category.
  3. Continue using Tab and Enter to move focus to the second "See more" (right-aligned carousel arrow).
  4. Press Enter to navigate to the next carousel, and ensure focus lands on the first card of the third carousel section.
  5. Press Tab to continue forward navigation.
  6. Observe the focus behavior.

Actual behavior
Focus skips the remaining cards in the third carousel section, and not all cards are reachable via keyboard navigation.

Expected behavior
Focus should move sequentially through all cards within the carousel, and no cards should be skipped during forward Tab and Enter navigation.

Screen Recording
https://github.com/user-attachments/assets/8d8d44da-c890-4dcd-bb95-2498e0ba1d99

Additional context
1.OS: Windows 11 25H2
2.Browser: Chrome, Edge, and Firefox
3.makecode.microbit.org version: 8.1.17
4.Microsoft MakeCode version: 12.3.12

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 at https://makecode.microbit.org/beta in the Live Coding and Courses categories with Tab and Enter, then trace the carousel keyboard-navigation entry point in the repository. Done means focus moves sequentially through every card in the third carousel section without skipping cards in Chrome, Edge, and Firefox.

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
52/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.