TabPanel Content Accessibility on Android's Talk Back

[yaeda]

Provide a general summary of the issue here

When the content of a TabPanel consists only text, Talk Back seems unable to focus and read the content. However, if the TabPanel includes interactive components (such as links or input fields) alongside the text, Talk Back is able to focus on and read the content without issue.

This might be a TalkBack's bug, is there a workaround?

🤔 Expected Behavior?

TalkBack can focus and read TabPanel's contents when it has only text.

😯 Current Behavior

TalkBack can focus TabPanel but cannot focus/read its contents.

💁 Possible Solution

No response

🔦 Context

No response

🖥️ Steps to Reproduce

• https://www.w3.org/WAI/ARIA/apg/patterns/tabs/examples/tabs-manual/
• https://react-spectrum.adobe.com/react-aria/Tabs.html

Version

2.27.0

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

Android

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[yihuiliao]

Just wanted to tag the original discussion post here: #6148

I have verified on my own device that if the tab panel contains only text, it does not read the contents. It is focusable and the TalkBack cursor does move to the tab panel (at least on my device) but it doesn't actually read it out loud.

Device: Samsung Galaxy S23

[yaeda]

my env

• Pixel 7 (Android 14)
• Pixel 4 (Android 12)

[yaeda]

I found another strange condition.

When Tab only has svg (Perhaps a or input is OK), TalkBack could announce the contents of corresponding text-only TabPanel.