[Bug]: [v5] When Talkback is enabled and a modal is displayed, the items below the modal sheet are still accessible by tap and the sheet is not focused

[hraschan]

Version

v5

Reanimated Version

v3

Gesture Handler Version

v2

Platforms

Android

What happened?

1. When Talkback is enabled Modal is not focused when presented
2. Elements below the Modal are accessible.
3. When dismissing modal, elements are no longer accessible/focusable (no green marker around them and no announcements)

There was already an issue in v4 #1641 but this issue still persists.

In general the accessibility behavior is questionable. Why is the backdrop accessible? Why is each element accessible. Handle, Container, Background. Content elements are not accessible seperatly.

Reproduction steps

1. When Talkback is enabled Modal is not focused when presented
2. Elements below the Modal are accessible
3. When dismissing modal, elements are no longer accessible/focusable (no green marker around them and no announcements)

Describe what you expected to happen:

1. When Talkback is enabled, if user opens Modal, it should get focus automatically
2. Elements below the Modal should not be accessible by default (some prop needed maybe)
3. After dismissing Modal, elements that were below it should be accessible/focusable again

Reproduction sample

https://snack.expo.dev/@gorhom/bottom-sheet---issue-reproduction-template

Relevant log output

No response

[janReitan]

We're having the same issue.

[laijoann]

++ Would love a resolution for this as well

[marcogravbrot]

Made a patch-package to fix this issue if anyone's interested in a quick fix:

• Added importantForAccessibility prop to BottomSheet, BottomSheetModal, BottomSheetBackdrop, BottomSheetBackground and BottomSheetContainer
• Added logic to the BottomSheetModalProvider to disable accessibility for app child elements while giving accessibility to the modal content.

Based on the suggestions in #687
Manually focusing the modal does not seem to be necessary once the rest of the content is non-accessible, as the screen reader will jump to the first available element.

@gorhom+bottom-sheet+5.0.6.patch
Gist

I would suggest creating a custom handle for closing the modal that you can make accessible while hiding the backdrop like this:

[ochodnicky]

@marcogravbrot thank you for the patch, works well! 😊

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[DylanWard14]

+1 for this, please re-open, this is likely failing accessibility standards

[MisterMaroki]

Does not meet accessibility requirements. Please fix asap.

[tastydev]

Made a patch-package to fix this issue if anyone's interested in a quick fix:

• Added importantForAccessibility prop to BottomSheet, BottomSheetModal, BottomSheetBackdrop, BottomSheetBackground and BottomSheetContainer
• Added logic to the BottomSheetModalProvider to disable accessibility for app child elements while giving accessibility to the modal content.

Based on the suggestions in #687 Manually focusing the modal does not seem to be necessary once the rest of the content is non-accessible, as the screen reader will jump to the first available element.

@gorhom+bottom-sheet+5.0.6.patch Gist

I would suggest creating a custom handle for closing the modal that you can make accessible while hiding the backdrop like this:

Ty mate! I also added accessibilityElementsHidden to the portal children wrapper to achieve same behaviour on iOS:

<PortalProvider>
            <View style={{flex: 1}} importantForAccessibility={isModalVisible ? "no-hide-descendants" : "yes"} accessibilityElementsHidden={!!isModalVisible} >
                {children}
            </View>
</PortalProvider>

This way i fixed the issue on iOS when the bottomsheetbackdrop and bottomsheetbackground had assessible false applied.

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[DylanWard14]

Bump, still an issue