A11Y: ion-modal not trapping focus with Android Talkback

I’m running into an issue with ion-modal and Android TalkBack. When I click the trigger button to open the modal TalkBack announces that a dialog has opened and sets focus to the dialog, but when I swipe (single finger, right to left) the focus moves from the modal to the content of the page behind the modal while the modal is still open.

The ion-modal instance does have role=”dialog” and aria-modal=”true” and the ion-router-outlet does have aria-hidden=”true” when the modal is open.

Any ideas or help would be much appreciated!!

HTML:

<button (click)="openModal()">Open modal</button>

TS:

async openModal() {
    const modal = await this.modalController.create({
        component: MyComponent
    });
    modal.present();
}

Device info:

Model - Pixel 10

Android version - 16

Project info:

“@ionic/angular”: “^8.5.2”

“@ionic/cli”: “^7.2.1”

“@ionic/core”: “^8.5.2”

4 posts - 2 participants

Read full topic