[Bug]: Context menu is not respecting the bounds of an iframe

[VamsiModem]

Library

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

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (12) x64 Intel(R) Xeon(R) W-2135 CPU @ 3.70GHz
    Memory: 4.20 GB / 63.73 GB
  Browsers:
    Edge: Chromium (127.0.2651.74)
    Internet Explorer: 11.0.22621.3527

Are you reporting an Accessibility issue?

None

Reproduction

Context menu is not respecting the bounds of an iframe

Bug Description

Power apps is rendered inside an an iframe and when a context menu is opened, it is rendered outside the bounds of the iframe.

Actual Behavior

The context menu is flowing out of the iframe

Expected Behavior

The context menu should respect the boundaries of an iframe

Logs

No response

Requested priority

High

Products/sites affected

Power Apps

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.

[dmytrokirpa]

Hello @VamsiModem, could you create a standalone reproducible example using Codesandbox or Stackblitz? It's challenging for us to determine whether the issue is with the component itself or the context in which it's used. Thanks!

[dmytrokirpa]

@VamsiModem Check out the Overflow Boundary example that is available on the docsite, it might be helpful in your scenario.

[VamsiModem]

We tried the boundary and didn't work but setting position on menu fixed the issue
<Menu open={open} onOpenChange={onOpenChange} positioning={{ autoSize: true }}>

[VamsiModem]

Found a fix, hence closing.