bug: Focus state at ion-select with interface of action-sheet using TalkBack

[mristov]

Prerequisites

• [X] I have read the Contributing Guidelines.
• [X] I agree to follow the Code of Conduct.
• [X] I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v7.x

Current Behavior

We can clearly see that when TalkBack is turned on and start to read options in ion-select, focus state of HTML element is out of bounds.

Important to note This is not happening always, the best (to reproduce this) will be to test it when you scroll page a bit, and then open a ion-select

https://github.com/user-attachments/assets/39ae8f9a-6c12-43bd-95db-2ff2ac52094b

Expected Behavior

focus of HTML element to be around correctly focused option

Steps to Reproduce

1. Go to https://ionicframework.com/docs/api/select
2. Find example with 'action-sheet' example
3. Test it

Code Reproduction URL

https://angular-kzrikb.stackblitz.io/

Ionic Info

Ionic:

Ionic CLI : 7.0.1 Ionic Framework : @ionic/angular 7.6.2 @angular-devkit/build-angular : 17.0.8 @angular-devkit/schematics : 17.0.8 @angular/cli : 17.0.8 @ionic/angular-toolkit : 10.0.0

Capacitor:

Capacitor CLI : 5.6.0 @capacitor/android : 5.6.0 @capacitor/core : 5.6.0 @capacitor/ios : 5.6.0

Cordova:

Cordova CLI : not installed Cordova Platforms : not available Cordova Plugins : not available

Utility:

cordova-res : not installed globally native-run : 2.0.0

System:

NodeJS : v18.20.0 npm : 10.5.0 OS : Windows 10

Additional Information

No response

[thetaPC]

Thank you for submitting the issue! I was as able to replicate this.

A solution should be implemented soon!