department-of-veterans-affairs / va-mobile-library

https://department-of-veterans-affairs.github.io/va-mobile-library/
ISC License
1 stars 0 forks source link

Radio button - Intermittent issue with VoiceOver selecting a new radio #596

Open TimRoe opened 4 days ago

TimRoe commented 4 days ago

Description

It was noticed late working on #521 to create the Radio button component that there was an intermittent issue with VoiceOver in iOS (Android seemed to work fine). When you swipe onto one of the radio buttons that is unselected, it will read "[text/a11yLabel] unchecked" and then if you double tap to activate that radio it will sometimes read: "[text/a11yLabel] unchecked, [text/a11yLabel] checked" in succession while it should only read the "checked" part. This is confusing. My assumption is it's related to rerendering and it reading the "unchecked" associated with a rerender after the action then reading again once it rerenders to reflect that it has been checked. Given the state of what's selected should live outside the component, it was not immediately clear how best to resolve it.

Video of it working correctly (around 30-43 seconds):

https://github.com/user-attachments/assets/56cd2c16-1217-4602-9a24-3d06d8fb580d

Video of the improper behavior:

https://github.com/user-attachments/assets/b76829d5-8af8-44c6-b439-0f063516013c

Acceptance Criteria

- [ ] Update Radio button to not incorrectly read that a radio is unchecked immediately after checking it **Accessibility Requirements** - [ ] VoiceOver should not read that a radio is unchecked (then that it is checked) after you just checked it as it is confusing