[Bug]: PageUp and PageDown do nothing in command palette lists
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 23k
- Forks
- 5.9k
- Avg merge
- 11h 14m
- Merged PRs (30d)
- 357
Description
Before submitting
- I searched existing issues and did not find a duplicate.
- I included enough detail to reproduce or investigate the problem.
Area
apps/web
Steps to reproduce
- Start the app and click the "New project" button in the sidebar (the folder-plus icon), or use the Add project action in the command palette.
- Choose "Local folder". The palette now lists the directories under the current path.
- Pick a path with more directories than fit in the popup.
~/is usually enough; the popup shows about ten rows. - Press ArrowDown once to highlight a row.
- Press PageDown.
Expected behavior
The highlight moves down by one screenful of rows, the way a list moves in a file manager or any native list control, and stops on the last row.
Actual behavior
Nothing happens. The highlight stays where it is and the list does not scroll. PageUp behaves the same. The only way through a long folder list is one ArrowDown press per row, or typing the path by hand.
Home and End do move the highlight to the first and last row, so the page keys are the only missing step size.
Impact
Minor bug or occasional failure
Version or commit
main @ f5fce7416
Environment
Windows 11, dev build started with pnpm dev, checked in a Chromium-based browser. Not checked on macOS or Linux.
Workaround
Hold ArrowDown, or type the directory path into the palette input instead of browsing to it.
Notes
The list navigation is Base UI's, and its useListNavigation has cases for the arrow keys and for Home/End but none for PageUp/PageDown, so the keys reach the input and do nothing there. The highlighted index lives in Base UI's internal store and the public Autocomplete/Combobox API has no way to set it: onItemHighlighted only reports changes and actionsRef carries just unmount. That is why a fix has to sit in the dependency rather than in the palette code.
The same palette component backs the file picker, project content search and favicon picker, so those lists should be affected too. I only measured the "New project" folder list.
A fix is proposed in #6155, which patches @base-ui/react to handle the page keys for vertical single-column lists.
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
Start in the apps/web command palette and review the Base UI useListNavigation behavior described in the issue. Compare the affected folder, file-search, project-search, and favicon-picker lists, then inspect the proposed fix in #6155. Done means PageUp and PageDown move the highlight by one visible screenful and stop at the list boundaries.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 25/100