Screen Reader: Reports: The radio buttons are announced as buttons and without a state

[olenamihno]

Action Performed:

Prerequisites:

• the user is signed in

1. Using VoiceOver on iOS or TalkBack on Android, open the application.
2. Once the Inbox screen opens, swipe right to navigate to the Reports tab and double-tap to activate it.
3. Once the "Reports" screen opens, swipe right to navigate to the "Date" dropdown and double-tap to activate it.
4. Once the "Date" dropdown expands, swipe right to navigate to the radio buttons like “This month” and “Last month,” which are available under the "Date" dropdown
5. Observe the screen reader announcement.

Expected Result:

Each option here behaves like a radio button - only one can be selected at once, so it is expected to announce them with a checkbox role and checked or not checked state.

Actual Result:

Each option here behaves like a radio button - only one can be selected at once; however, they are announced without a button role and without state.

Area issue was found in:

Reports > Filters

Failed WCAG checkpoints

WCAG 4.1.2 Name, Role, Value
https://www.w3.org/WAI/WCAG22/Understanding/name-role-value

User impact:

Providing role, state, and value information on all user interface components enables compatibility with assistive technology, such as screen readers, screen magnifiers, and speech recognition software, used by people with disabilities.

Suggested resolution:

Use the appropriate accessibility properties to correctly expose the role and state, such as accessibilityRole="radio button" and accessibilityState={​{ Selected : true/false }​}. Ensure that these properties are updated dynamically when the selection changes. This will allow screen readers to announce the controls as radio buttons and accurately reflect their selected or unselected state.
https://reactnative.dev/docs/accessibility#accessibilityrole
https://reactnative.dev/docs/accessibility#accessibilitystate

Environment:

Apple iPhone 16 - iOS 18.2, Wi-Fi - Native (No mobile browser)
Vivo IQOO Z9s 5G - Android 15, Wi-Fi - Native (No mobile browser)

Screenshots/Videos

Bug7007067_1763448461455.The_Radio_buttons_are_announced_as_buttons_and_without_a_state.mp4

Version Number: Production
Reproducible in staging?: NA
Reproducible in production?: Yes
Email or phone of affected tester (no customers): No
Logs: https://stackoverflow.com/c/expensify/questions/4856 NA
Notes/Photos/Videos: Any additional supporting documentation Yes
Expensify/Expensify Issue URL: https://platform.applause.com/company/12102/products/36628/community-issues/7007067
Issue reported by: NA
Slack conversation: NA

[melvin-bot]

📣 @olenamihno! 📣
Please report bugs or suggest features in the #expensify-open-source Slack channel, don't directly open issues in this repo!
Instructions here to join the channel 📖

[melvin-bot]

This issue has not been updated in over 15 days. eroding to Monthly issue.

P.S. Is everyone reading this sure this is really a near-term priority? Be brave: if you disagree, go ahead and close it out. If someone disagrees, they'll reopen it, and if they don't: one less thing to do!