floatingStrategy="fixed" has no effect in Popover

[laugri]

Dependencies check up

• I have verified that I use latest version of all @mantine/* packages

What version of @mantine/* packages do you have in package.json?

7.10.2

What package has an issue?

@mantine/core

What framework do you use?

Next.js

In which browsers you can reproduce the issue?

Chrome

Describe the bug

Issue

floatingStrategy="fixed" has no effect of Popover dropdown element. It's still absolute. I expected it to fixed. From what I can tell, nothing changes with the option.

How to reproduce:

Use a popover anywhere with floatingStrategy="fixed" and withinPortal={false} and inspect the dropdown.

import "@mantine/core/styles.css";
import {
  MantineProvider,
  Button,
  Popover,
  PopoverDropdown,
  PopoverTarget,
} from "@mantine/core";

export default function App() {
  return (
    <MantineProvider>
      <>
        App
        <Popover
          width={400}
          position="top"
          shadow="md"
          withinPortal={false}
          floatingStrategy="fixed"
          radius="8"
        >
          <PopoverTarget>
            <Button>Hello</Button>
          </PopoverTarget>
          <PopoverDropdown style={{ pointerEvents: "none" }}>
            Content
          </PopoverDropdown>
        </Popover>
      </>
    </MantineProvider>
  );
}

Context

Because I am developing a chrome extension content script UI, my app is in a shadow root and I can't use Portals. For this reason, I am using Popovers with withinPortal={false}. I have a clipping problem (as shown in the screenshot below), so I tried floatingStrategy="fixed" as recommended by floating-ui for clipping issues.

If possible, include a link to a codesandbox with a minimal reproduction

https://codesandbox.io/p/sandbox/mantine-react-template-q4dd5d?file=%2Fsrc%2FApp.tsx%3A5%2C49&layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clxn4rll400063b6iz9zj6pd7%2522%252C%2522sizes%2522%253A%255B100%252C0%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clxn4rll400023b6i5752i960%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clxn4rll400033b6i6twvo8ic%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clxn4rll400053b6ioad3qnl7%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B50%252C50%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clxn4rll400023b6i5752i960%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clxn4rll400013b6i7thzcnzr%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Fsrc%252Findex.tsx%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clxn4t6lw003d3b6ikz7o602w%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A5%252C%2522startColumn%2522%253A49%252C%2522endLineNumber%2522%253A5%252C%2522endColumn%2522%253A49%257D%255D%252C%2522filepath%2522%253A%2522%252Fsrc%252FApp.tsx%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%255D%252C%2522id%2522%253A%2522clxn4rll400023b6i5752i960%2522%252C%2522activeTabId%2522%253A%2522clxn4t6lw003d3b6ikz7o602w%2522%257D%252C%2522clxn4rll400053b6ioad3qnl7%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clxn4rll400043b6ih51tnlfq%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A0%252C%2522path%2522%253A%2522%252F%2522%257D%255D%252C%2522id%2522%253A%2522clxn4rll400053b6ioad3qnl7%2522%252C%2522activeTabId%2522%253A%2522clxn4rll400043b6ih51tnlfq%2522%257D%252C%2522clxn4rll400033b6i6twvo8ic%2522%253A%257B%2522tabs%2522%253A%255B%255D%252C%2522id%2522%253A%2522clxn4rll400033b6i6twvo8ic%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Afalse%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D

Possible fix

I looked at the source code of Popover but didn't find anything wrong.

Self-service

• I would be willing to implement a fix for this issue

[rtivital]

Fixed in 7.11.1