[Left Side Navigation]: Broken responsive behavior

[doruskova]

Describe the bug

When clicking on collapsed left side navigation menu item with subitems, getting broken empty page. This is happening only on MacOS Chrome browser. Same thing is happening in a documentation.

Isolated Example

No response

Reproduction steps

1. Collapse left side navigation panel
2. Click on nav item that can be expanded with a popover
3. See broken page with a whitespace (only in Chrome, MacOS) ...

Expected Behaviour

As a user I expect to see a popover with additional sub-items in a left side nav.

Screenshots or Videos

https://github.com/SAP/ui5-webcomponents-react/assets/32618096/c8922835-d564-44d3-9381-861b87d4beba

UI5 Web Components for React Version

v1.18.0

UI5 Web Components Version

1.15.1

Browser

Chrome

Operating System

macOS Ventura 13.5

Additional Context

No response

Relevant log output

No response

Declaration

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

[Lukas742]

Hi @doruskova

Thanks for reporting! I'll forward this issue to our UI5 Web Components Colleagues as the affected component is developed in their repository.

---

Hi colleagues,

the described issue can also be observed without our wrapper:

1. Go to the SideNavigation story
2. Open canvas in new tab
3. Toggle collapsed state of the SideNavigation
4. Toggle device toolbar in dev tools
5. Click on nav item that can be expanded with a popover
6. See the responsive popover mobile view (dialog) with the SideNavigationSubItems on the left side

I've checked the SapUI5 example and there it seems that only a Popover is used and not a ResponsivePopover.

[LidiyaGeorgieva]

Hello @SAP/ui5-webcomponents-topic-rd,

Please have a look at this issue. In Chrome I can reproduce two behaviors that can be checked:

Tested on Windows with Chrome.

Best Regards, Lidiya

[LidiyaGeorgieva]

Internal BLI created under number 3099

[LidiyaGeorgieva]

Hello @doruskova, The issue should be fixed now.