Library

React Components / v9 (@fluentui/react-components)

System Info

v9.54.2

Are you reporting Accessibility issue?

None

Reproduction

https://stackblitz.com/edit/1xfnw4?file=src%2Fexample.tsx,src%2FApp.tsx

Bug Description

Actual/Expected Behavior

Open the reproduction in Edge and focus on red box, on pressing shift+f10, expect menu to be anchored to "Target" button. But in actual menu is anchored to red box.

This bug is discovered when trying to anchor a context menu on TreeItem with subtree. On mouse click context menu should follow the mouse, and on keyboard, context menu should anchor to TreeItemLayout.

Investigation and Proposed fix

Menu openOnContext sets target through state. It overrides the target set imperatively by user.
(So there's a workaround to this issue by setting target imperatively in useEffect on menu open)
After discussing with @ling1726, on way to fix it can be set target imperatively instead of setting state in useMenu.

Logs

No response

Requested priority

High

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.