FormItem: Issues with createPortal

[ej612]

Describe the bug

Hi there!

Disclaimer: I don't know if the following is a bug or whether I'm just doing it wrong:

I have a Form, containing a FormItem, which displays a Button, which opens a Dialog when clicked. I render the dialog using createPortal(dialog, document.body).
This, however, doesn't work: Clicking on the button doesn't open the dialog.

I made a sandbox.

If I change line 23 from

{isDialogOpen ? createPortal(dialog, document.body) : null}

to

{isDialogOpen ? dialog : null}

it works as expected. Is there something more to createPortal that I'm missing?

Thanks a lot in advance!

Expected Behaviour

Clicking on the button should open the dialog.

UI5 Web Components for React Version

1.26.1

UI5 Web Components Version

1.23.1

Browser

Chrome

[Lukas742]

Hi @ej612

sorry for the confusion, we didn't outline that FormItems don't support portals as children. Please render the Dialog outside of the Form component. The linked PR will adjust the type (because of React 16 & 17 support, portals are still allowed because of ReactElement) and add a note about ignored values.

[ej612]

Thanks for the clarification @Lukas742!

[ui5-webcomponents-react-bot]

🎉 This issue has been resolved in version v1.27.0 🎉

The release is available on v1.27.0

Your semantic-release bot 📦🚀