[TabContainer]: TabContainer has focus issues in small screen

[yzy415]

Bug Description

On a mobile screen, e.g., 390X844, the tabs except the first one will be grouped into the overflow button.

1. The user cannot navigate to the overflow button using the tab key.
2. Even if he uses the arrow key to the overflow button, focus is lost after the button is clicked.

Affected Component

TabContainer

Expected Behaviour

1. The user can navigate to the overflow button using the tab key.
2. Focus should be set on the first tab option when the list of tab options is opened

Isolated Example

https://sap.github.io/ui5-webcomponents-react/?path=/docs/layouts-floorplans-tabcontainer--docs

Steps to Reproduce

1. Toggle the device toolbar in devTools
2. Click the overflow button using the keyboard
3. You will see there is no focus set when the list of tab options is opened

Log Output, Stack Trace or Screenshots

No response

Priority

None

UI5 Web Components Version

1.24.0

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

SAP SF

Declaration

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

[yanaminkova]

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

It seems that on mobile device, no focus is set when the list of tab options of the ui5-tabcontainer is opened.

Steps to Reproduce:

1. Open https://sap.github.io/ui5-webcomponents-react/?path=/story/layouts-floorplans-tabcontainer--default
2. Toggle the device toolbar in devTools
3. Click the overflow button
   => no focus is set when the list of tab options is opened.

Could you please have a look at it?

Thanks and Kind regards,
Yana

[LidiyaGeorgieva]

Note: This is part of bigger topic for visual focus on mobile: FIORITECHP1-17583.

Related to: #8250

[dimovpetar]

Hello @yzy415 ,

1. The user cannot navigate to the overflow button using the tab key.

This behavior is expected. You can reach the "Show More" button only with the arrow keys.

2. Even if he uses the arrow key to the overflow button, focus is lost after the button is clicked.

This issue is fixed with 27b522f and downported to branch rel-1.24 with 58d65bc.

Best regards,
Petar