OverflowPopover: The components OverflowToolbarButton and OverflowToolbarToggleButton are not working properly on scoped UI5 instance

[Jianrong-Yu]

Describe the bug

Currently we are using Scoping for our Micro-Frontends solution, we found the component <OverflowToolbarButton> created in the Micro-Frontends application does not working properly in main application.

In our case, the <OverflowPopover> is rendered by the main application and the <OverflowToolbarButton> is rendered by the Micro-Frontends application, when the button is rendered on the popover, the label of the button is missing:

Isolated Example

No response

Reproduction steps

1. Create Main application, render an <OverflowPopover> component, and enable Webpack Federation as host application
2. Create Micro-Frontends application, render an <OverflowToolbarButton> and export it
3. In the Main application, import the button rendered by the Micro-Frontends application
   Actual: The label of the button is missing

Expected Behaviour

Expect: The label of the button is rendered correctly

Screenshots or Videos

In this case, the <OverflowPopover> is rendered by the main application but the first button <OverflowToolbarButton> is rendered in MFE application with scoping

UI5 Web Components for React Version

1.24.0

UI5 Web Components Version

1.21.0

Browser

Chrome, Edge

Operating System

No response

Additional Context

No response

Relevant log output

No response

Organization

SAP Signavio

Declaration

• I’m not disclosing any internal or sensitive information.

Contribution request

I'd like to contribute my solution for this bug.
The proposal-fix PR #5739 is ready for review.

[ui5-webcomponents-react-bot]

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

The release is available on v1.28.1

Your semantic-release bot 📦🚀