[ResponsivePopover]: Never gets focus if opened from a sap UI5 dialog

[Vir-Mittal]

Bug Description

When using a combination of sap UI5 and ui5-webcomponents, we face an issue with the focus of the elements -
If we have a sap ui5 dialog, and then open a ui5-webcomponents ResponsivePopover on top of that dialog, the popover never gets the focus, it remains on the dialog in the background.

Affected Component

ResponsivePopover

Expected Behaviour

The popover should get the focus

Isolated Example

No response

Steps to Reproduce

1. Open a sap ui5 dialog
2. Press a button within that dialog to open a ui5-webcomponents ResponsivePopover which has some actionable buttons/fields
3. The popover never receives the focus, the focus remains on the dialog in the backgroud
   ...

Log Output, Stack Trace or Screenshots

No response

Priority

Medium

UI5 Web Components Version

Latest

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

SuccessFactors

Declaration

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

[Todor-ads]

Hello @Vir-Mittal ,
thank you for sharing your findings. Would it be possible for you to provide us with an isolated example in which we can reproduce the problem?

Regards,
Todor

[Vir-Mittal]

Hi @Todor-ads , it is difficult to provide a sandbox with that setup, but I can give you access to a hosted instance which has a minimal example of this behaviour. Would that help?

[niyap]

Hello @Vir-Mittal,

In our sample page, we have similar sample where the issue is not reproducible: https://sap.github.io/ui5-webcomponents/storybook/playground/main/pages/ResponsivePopover/ (check RP over a Dialog)
Please check the sample and use it as a starting point in order to create a sample with the reproducible issue.

Kind Regards,
Niya

[Vir-Mittal]

Hi @niyap , the sample page you provided shows the dialog and RP both in ui5-webcomponents. As mentioned, the problem we are facing is when using a combination of technologies - the dialog is in SAP UI5, while the RP is in ui5-webcomponents. It seems to be an integration issue between the two as the dialog keeps "stealing" the focus from the RP. This is why it is difficult to provide a sandbox example of the setup. I can give you access to a hosted instance which has a minimal example of this behaviour. Would that help?

[niyap]

Hello @Vir-Mittall,

My mistake, I have missed that the dialog is ui5 control. Yes, I think that it would be helpful, if you can provide access to hosted instance where the issue could be reproduced.

Kind Regards,
Niya

[Vir-Mittal]

Hello @niyap thank you for your response. I sent you the instance details and steps to reproduce on slack. Please let me know if you have any questions

[TeodorTaushanov]

This issue is fixed in the main and release-1.24 branches.