bug: aria-expanded is ignored when used in ion-item (TalkBack) #30558
Description
Prerequisites
- I have read the Contributing Guidelines.
- I agree to follow the Code of Conduct.
- I have searched for existing issues that already report this problem, without success.
Ionic Framework Version
v8.x
Current Behavior
In our app we have some cases where we display some collapsible information without using ion-accordion, we implement the collapse/expand ourselves. The "expand" action is done clicking an ion-item, so we added aria-expanded to it. But Google Talkback is ignoring the aria-expanded attribute (I haven't tested it with VoiceOver yet).
The same implementation using a div works fine.
Expected Behavior
Talkback should be able to detect aria-expanded, so it should read "expanded" or "collapsed".
Steps to Reproduce
- Open this URL in an Android device (e.g. in Chrome): https://stackblitz.com/edit/prza28ny-qihwpnvt?file=src%2Fapp%2Fapp.component.ts,src%2Fapp%2Fapp.component.html
- Open the "Preview" panel and wait for the project to run.
- Enable Talkback.
- Select the "Content title" below "Using ion-item". Talkback will only read "Content title", it doesn't read the aria-expanded.
- Now select the "Content title" below "Using div". Talkback will now read "Collapsed. Content title"
Code Reproduction URL
Ionic Info
Ionic:
Ionic CLI : 7.2.1
Ionic Framework : @ionic/angular 8.6.4
@angular-devkit/build-angular : 20.1.0
@angular-devkit/schematics : 19.2.15
@angular/cli : 20.1.0
@ionic/angular-toolkit : 12.2.0
Cordova:
Cordova CLI : 12.0.0 ([email protected])
Cordova Platforms : android 14.0.1, ios 7.1.1
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, (and 16 other plugins)
Utility:
cordova-res : not installed globally
native-run : 2.0.1
System:
ios-sim : 8.0.2
NodeJS : v22.17.0
npm : 10.9.2
OS : macOS Unknown
Xcode : Xcode 16.2 Build version 16C5032a
Additional Information
No response