The "react-floater-portal" has not been created in my app

[alexya]

I downloaded the react-floater source and ran the demo. I can see the element react-floater-portal in the Chrome Devtool -> Elements. and all the created Floater are under the react-floater-portal element. e.g.

But when I used the react-floater in my own app, I can't see the react-floater-portal. I just see all the created Floater directly besides the root div. I don't understand and know the reason.

I am not sure if it is caused by that

• in the demo, all the floater are created by using the Floater to wrap element(s).
• in my app, I only used the property target of the floater to show the popup.

Any help will be much appreciated.

[gilbarbara]

Hey @alexya
Can you share more info?
The versions of react-floater and react?
Are you setting the portalElement prop?
Which bundler? Are you using the StrictMode on development?

[alexya]

• The version I used is react-floater@^0.7.6. But I didn't add it directly, I just added "react-joyride": "^2.5.5". and got that it can't meet our requirements, then I tried to use the react-floater directly.
• No, I didn't set the protalElement prop. I checked the demo, and commented out all the code except this line (https://github.com/gilbarbara/react-floater/blob/main/demo/src/App.tsx#L44), it doesn't set the portalElement either. and in the chrome dev tool -> elements, there is react-floater-portal existed.
• we are using webpack 5.0 to bundle, and the strict is set to true in the tsconfig file.
• I want to repro the issue in the demo, but failed. But our project is too complex and I can't upload it to the github.