Skip to content

fix: keep hover callbacks firing on disabled items - #903

Open
officialasishkumar wants to merge 1 commit into
react-component:masterfrom
officialasishkumar:fix/disabled-item-hover-events
Open

officialasishkumar wants to merge 1 commit into
react-component:masterfrom
officialasishkumar:fix/disabled-item-hover-events

Conversation

@officialasishkumar

@officialasishkumar officialasishkumar commented Nov 12, 2026 •

Copy link
Copy Markdown

Fixes #436

Disabled Menu.Item (and disabled SubMenu titles) dropped onMouseEnter/onMouseLeave entirely, so wrapping components such as tooltips could not detect hover on them.

useActive now always forwards the hover callbacks, and only skips the active-key updates (onActive/onInactive) when disabled. Click and keyboard handling stay blocked, and disabled items still never get the active class.

Added a test in tests/MenuItem.spec.tsx that fails without the change; the full suite passes.

Summary by CodeRabbit

  • 修复
    • 禁用菜单项现在也会触发鼠标进入和离开回调,并提供菜单项标识及鼠标事件信息。
    • 禁用状态不变:悬停不会使菜单项进入激活状态。

Disabled MenuItem/SubMenu title dropped onMouseEnter/onMouseLeave
entirely, so wrappers such as tooltips could not detect hover on them.
Always forward the callbacks, while still skipping the active-key
updates for disabled entries. Clicks and keyboard remain blocked.
@vercel

vercel Bot commented Nov 12, 2026

Copy link
Copy Markdown

@officialasishkumar is attempting to deploy a commit to the afc163's projects Team on Vercel.

A member of the Team first needs to authorize it.

@coderabbitai

coderabbitai Bot commented Nov 12, 2026 •

Copy link
Copy Markdown

Explain Change →

No actionable comments were generated in the recent review.

Walkthrough

禁用菜单项现在会设置鼠标进入和离开处理器,并调用对应的悬停回调。活动状态仍只会在菜单项未禁用时更新。新增测试验证回调参数及激活类状态。

Changes

禁用菜单项悬停行为

Layer / File(s) Summary
悬停回调与验证
src/hooks/useActive.ts, tests/MenuItem.spec.tsx
所有菜单项都会设置鼠标进入和离开处理器。禁用项会调用对应回调,但不会更新活动状态。新增测试验证回调参数包含 key 和 domEvent,且鼠标进入后菜单项没有 rc-menu-item-active 类。

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Bug fix · Severity of issue fixed: Low

Suggested reviewers: yoyo837

Merge Risk: Minimal · up to 424ac

Disabled menu items now forward hover callbacks, so tooltips work on them, while clicks, keyboard handling, and the active class stay blocked. No merge-blocking risk was found.

Pre-merge checks: Passed 4

Check name Status Explanation
Description Check Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check Passed 标题“fix: keep hover callbacks firing on disabled items”与变更内容一致。PR 让禁用的 Menu.Item 和禁用的 SubMenu 标题继续触发 onMouseEnter 与 onMouseLeave。useActive 现在为禁用项始终设置悬停处理器,但不更新激活键(onActive/onInactive)。tests/MenuItem.sp…
Linked Issues check Passed [#436] 要求禁用的 Menu.Item 仍能触发 mouseenter/mouseleave,同时禁用 click 和 keydown。在 src/hooks/useActive.ts 中,head 版本始终为 ret.onMouseEnter 和 ret.onMouseLeave 赋值。回调先调用 onMouseEnter/onMouseLeave 并传入 { key, domEvent …
Out of Scope Changes check Passed 与 mergeBase 相比,本 PR 的改动仅包括 src/hooks/useActive.ts(约 +20/-15)和 tests/MenuItem.spec.tsx(新增约 26 行测试)。useActive 的改动直接实现 #436 的悬停回调要求,测试用于验证该行为。未发现与 #436 无关的改动。无需回退或拆分。
Full details: Title check

Explanation

标题“fix: keep hover callbacks firing on disabled items”与变更内容一致。PR 让禁用的 Menu.Item 和禁用的 SubMenu 标题继续触发 onMouseEnter 与 onMouseLeave。useActive 现在为禁用项始终设置悬停处理器,但不更新激活键(onActive/onInactive)。tests/MenuItem.spec.tsx 新增了对应的回归测试。标题准确概括了主要变更。标题为英文,但这是本仓库的提交风格,不影响判定。

Full details: Linked Issues check

Explanation

[#436] 要求禁用的 Menu.Item 仍能触发 mouseenter/mouseleave,同时禁用 click 和 keydown。在 src/hooks/useActive.ts 中,head 版本始终为 ret.onMouseEnter 和 ret.onMouseLeave 赋值。回调先调用 onMouseEnter/onMouseLeave 并传入 { key, domEvent },之后只在 !disabled 时调用 onActive/onInactive。src/MenuItem.tsx 通过 {...activeProps} 把这两个处理器传到 li 元素上,且 mergedDisabled 时 onInternalClick 和 onInternalKeyDown 仍直接返回,不调用 onItemClick。禁用项的 active 类仍由 activeKey 决定,而禁用项不会通过悬停设置 activeKey。因此提示框等包装组件可检测悬停。tests/MenuItem.spec.tsx 新增的测试覆盖了禁用项的悬停回调和无 active 类的行为。#436 中的替代方案(允许 onClick 或 href 覆盖)不属于 PR 声明的目标,因此不作为本次要求。PR 说明提到禁用的 SubMenu 标题也会受影响,本次审查未单独核对 SubMenu 的代码路径,但该改动位于共享 hook 中。

Finishing Touches

Generate unit tests (beta)

  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Warning

Some tools did not complete. Review the errors below.

ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint install timed out. The project may have too many dependencies for the sandbox.

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

小兔轻敲菜单边,
禁用项也能报悬停。
进入回调送来事件,
离开回调随后应答。
活动态仍安静不变,
胡萝卜旁测试圆满。

Recent review info

Run configuration

  • Source mode: Auto
  • Repository: Unavailable
  • Branch: Unavailable
  • File: No configuration file from this repository applied
  • Commit: Unavailable
  • Layers: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: 80edbd26-7006-4386-86f5-4290fa5673f5
Commits

Reviewing files that changed from the base of the PR and between 209af34 and 424aca4.

Files selected for processing: 2

  • src/hooks/useActive.ts
  • tests/MenuItem.spec.tsx

Included review availability: This review used your included allowance. Your plan provides up to 4 included reviews per hour; 3 remain after this review.

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

menu.item disabled prop should still allow mouseenter/leave

1 participant