[Legacy Table]: A11y - Visible focus not appearing on entire row for smaller viewport width

[Brahmansh]

Describe the bug

Visible focus not appearing on entire row for smaller viewport width when content is wrapped. Please look at the attached screenshot.

Isolated Example

No response

Reproduction steps

1. Go to https://sap.github.io/ui5-webcomponents-react/v2/?path=/story/legacy-components-table--default
2. Select a row in the table
3. Reduce width and observe row selection outline doesn't cover wrapped row content

Expected Behaviour

Visible focus should be on entire row irrespective of viewport size.

Screenshots or Videos

UI5 Web Components for React Version

v2.4

UI5 Web Components Version

v2

Browser

Chrome

Operating System

No response

Additional Context

No response

Relevant log output

No response

Organization

No response

Declaration

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

[Lukas742]

Hi @Brahmansh

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,

this issue is regarding the table from the @ui5/webcomponents-compat package and can be reproduced in your playground.

[hinzzx]

Hi colleagues,

There is a issue with the focus in the <ui5-table>, and more specifically targeting <ui5-table-cell>/<ui5-table-row>.

Currently on smaller views, the focus is not obtained properly by the row as a whole. I suspect the reason behind this, is because the elements of the row (the <ui5-table-cell>s) does not have wrapper.

Best Regards,
Stoyan

[DonkeyCo]

Hi @SAP/ui5-webcomponents-core,

the table in question is the V1 table (see @Lukas742 message)

this issue is regarding the table from the @ui5/webcomponents-compat package and can be reproduced in your playground.

Could you please have a look here?

Thanks and best regards,
Duc

[ui5-webcomponents-bot]

🎉 This issue has been resolved in version v2.6.0-rc.2 🎉

The release is available on v2.6.0-rc.2

Your semantic-release bot 📦🚀