fix: open dropdown on spacekey for keyboard accessibility

[claytonlin1110]

🔗 Related Issues

• Fixes Select is not keyboard accessible with the spacebar ant-design/ant-design#56841

💡 Background and Solution

Problem: When focusing a Select and pressing Space, the page scrolls instead of opening the dropdown. For ARIA combobox, both Enter and Space should open the dropdown.

Solution: In BaseSelect, handle Space the same way as Enter when the dropdown is closed:

• If the dropdown is closed and the key is Space, open the dropdown and call preventDefault() (non-combobox mode) so the page does not scroll.
• When the dropdown is open, do not forward Space to the option list (the list only uses Enter/Tab to select) and still prevent default so Space does not scroll the page.

Summary by CodeRabbit

• Bug 修复
  • 改进下拉菜单的键盘交互：Space 键现在可打开下拉菜单（与 Enter 一致），并在非组合框模式下阻止默认行为以避免表单提交或页面滚动；防止因 Space 键导致的重复触发。
• 测试
  • 新增可访问性测试：验证按空格键可打开下拉菜单。

[vercel]

@claytonlin1110 is attempting to deploy a commit to the React Component Team on Vercel.

A member of the Team first needs to authorize it.

[gemini-code-assist]

Summary of Changes

Hello @claytonlin1110, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request addresses a keyboard accessibility issue in the BaseSelect component where pressing the Space key would cause the page to scroll instead of opening the dropdown. The changes modify the event handling logic to treat the Space key similarly to the Enter key for opening the dropdown, while also preventing the default browser scroll behavior. This enhancement improves the user experience for keyboard navigators and ensures better compliance with ARIA combobox accessibility guidelines.

Highlights

• Keyboard Accessibility: Implemented Space key handling in the BaseSelect component to open the dropdown, aligning with ARIA combobox standards for improved keyboard accessibility.
• Scroll Prevention: Ensured event.preventDefault() is called when the Space key is pressed, preventing unwanted page scrolling both when the dropdown is closed and when it is open.
• Key Handling Refinement: Adjusted the key locking mechanism to specifically exclude the Space key when the dropdown is already open, preventing interference with option selection which typically uses Enter or Tab.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Changelog

• src/BaseSelect/index.tsx
  • Introduced isSpaceKey variable to detect Space key presses.
  • Modified the dropdown opening condition to include isSpaceKey alongside isEnterKey.
  • Updated the preventDefault() call to apply when either Enter or Space keys are pressed, preventing form submission and page scrolling.
  • Adjusted the mergedOpen condition to explicitly exclude isSpaceKey from the key locking mechanism, ensuring Space key behavior does not conflict with open dropdown interactions.

Activity

• The pull request was initiated by claytonlin1110 to resolve a reported accessibility bug.
• It directly addresses and fixes issue https://github.com/ant-design/ant-design/issues/56841, which details the problem of the Space key causing page scrolling instead of opening the dropdown.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[coderabbitai]

Walkthrough

在 BaseSelect 中为 Space 键添加了打开下拉的处理，并在非 combobox 模式下阻止其默认行为；相应地调整了 Enter/Space 的按键处理路径；新增测试验证 Space 可打开下拉；更新了 package.json 相关变更。

Changes

Cohort / File(s)	Summary
BaseSelect 组件更改 src/BaseSelect/index.tsx	为 Space 键添加处理：按下 Space 可像 Enter 一样打开下拉；在非 combobox 模式下阻止默认行为以避免页面滚动或表单提交；调整 Enter/Space 的按键转发/锁定行为，避免重复触发。
测试 tests/Accessibility.test.tsx	新增测试：验证在 ARIA combobox 模式下按空格键会打开 Select 下拉。
包清单 package.json	轻微更改（+5/-3 行），与本次变更一并提交（元信息/脚本或依赖调整）。

Sequence Diagram(s)

(无 — 本次改动未引入需跨多个组件的全新顺序流程可视化)

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

• fix: The Enter key lock cannot be released correctly when the custom input calls blur() #1113：涉及 BaseSelect 键盘处理（Enter/Space 锁定与焦点/blur 行为）变更，代码层面高度相关。
• Don't open select on browser hotkeys #1191：涉及 Select 打开行为的按键处理，可能与本次 Space 支持的决策点有交集。

Suggested reviewers

• afc163
• zombieJ

诗歌

我是一只小兔子，键盘声轻敲，
空格一按，菜单花开像草梢，
滚动止步，焦点稳如风髦，
可及性在夜里闪耀，🐰🌙✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	标题清晰准确地总结了主要变更：在BaseSelect中添加Space键处理以打开下拉菜单，改进键盘可访问性。
Linked Issues check	✅ Passed	代码变更完全满足#56841的要求：在Space键按下时打开下拉菜单，同时防止默认滚动行为，添加了对应的测试用例。
Out of Scope Changes check	✅ Passed	所有代码变更都与处理Space键打开下拉菜单的目标相关，没有发现超出范围的修改。
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

Important

Action Needed: IP Allowlist Update

If your organization protects your Git platform with IP whitelisting, please add the new CodeRabbit IP address to your allowlist:

• ✨ 136.113.208.247/32 (new)
• 34.170.211.100/32
• 35.222.179.152/32

Reviews will stop working after February 8, 2026 if the new IP is not added to your allowlist.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 99.43%. Comparing base (d1aeb03) to head (6be9f0d).
⚠️ Report is 10 commits behind head on master.

Additional details and impacted files

@@           Coverage Diff           @@
##           master    #1200   +/-   ##
=======================================
  Coverage   99.42%   99.43%           
=======================================
  Files          31       31           
  Lines        1219     1230   +11     
  Branches      412      441   +29     
=======================================
+ Hits         1212     1223   +11     
  Misses          7        7           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[gemini-code-assist]

Code Review

This pull request introduces a valuable accessibility improvement by allowing the space key to open the Select component's dropdown, aligning with ARIA standards for comboboxes. The implementation in BaseSelect/index.tsx is clear and effective. It correctly handles opening the dropdown and preventing default browser behavior like page scrolling. The change also thoughtfully prevents the space key event from being passed to the option list when the dropdown is open. My only suggestion is to add a unit test to cover this new functionality and prevent future regressions.

[claytonlin1110]

@afc163 would you please review this?

[afc163]

Could you add a test case？

[Copilot]

Pull request overview

Updates BaseSelect keyboard handling to improve accessibility by opening the dropdown on Space (in addition to Enter) and preventing unwanted page scrolling.

Changes:

• Treat Space the same as Enter to open the dropdown when closed (with preventDefault() in non-combobox mode).
• Prevent forwarding Space keydown events to the option list while the dropdown is open.

Comments suppressed due to low confidence (1)

src/BaseSelect/index.tsx:479

• Add/adjust unit tests for the new Space key behavior. This change affects keyboard interaction (open dropdown when closed; prevent default to avoid page scroll; do not forward Space to OptionList when open), but there’s currently no test coverage for Space keydown. Consider adding cases alongside existing keydown/open assertions (e.g., in Select/Accessibility test suites) to verify dropdown open state and that preventDefault is called in non-combobox mode.

    // Enter or Space opens dropdown (ARIA combobox: spacebar should open)
    if (isEnterKey || isSpaceKey) {
      // Do not submit form when type in the input; prevent Space from scrolling page
      if (mode !== 'combobox') {
        event.preventDefault();
      }

      // We only manage open state here, close logic should handle by list component
      if (!mergedOpen) {
        triggerOpen(true);
      }
    }

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[claytonlin1110]

Could you add a test case？

Added test just now.

[claytonlin1110]

@afc163

[zombieJ]

+ @rc-component/select@1.6.3