Menu component sometimes fails to render when rapidly toggling visibility

We’ve observed a bug in the Menu component where it intermittently fails to render when the visible state is toggled quickly. Specifically, calling setVisible(true) does not result in the menu appearing, even though the state is true. This leads to a confusing user experience where tapping the trigger does nothing visible, although the component believes it is in an open state.

This issue appears to be more prevalent under React Native’s Fabric renderer, and may be related to a layout or mounting race condition.

https://github.com/user-attachments/assets/74a474c8-9cc6-4f50-879e-940802ecb62e

System:
OS: macOS 15.5
CPU: (12) arm64 Apple M3 Pro
Memory: 777.98 MB / 36.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 23.3.0
path: /usr/local/bin/node
Yarn:
version: 4.9.1
path: /usr/local/bin/yarn
npm:
version: 11.3.0
path: /usr/local/bin/npm
Watchman:
version: 2024.12.02.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.16.2
path: /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 24.4
- iOS 18.4
- macOS 15.4
- tvOS 18.4
- visionOS 2.4
- watchOS 11.4
Android SDK: Not Found
IDEs:
Android Studio: 2024.3 AI-243.24978.46.2431.13208083
Xcode:
version: 16.3/16E140
path: /usr/bin/xcodebuild
Languages:
Java:
version: 17.0.13
path: /opt/homebrew/opt/openjdk@17/bin/javac
Ruby:
version: 3.4.1
path: /opt/homebrew/opt/ruby/bin/ruby
npmPackages:
"@react-native-community/cli": Not Found
react: Not Found
react-native: Not Found
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: true
iOS:
hermesEnabled: true
newArchEnabled: true

首先，在启用 React Native Fabric 的情况下，使用随附的行为和环境作为上下文，复现 Menu 组件中快速切换 setVisible(true) 时的失败。跟踪组件的可见性、布局和挂载行为，以识别竞争条件，然后验证重复切换是否能可靠地将菜单渲染为打开状态。

由索引模型根据 Issue 内容生成。