Skip to content

LG-12842: More Accessible Form Errors for Document Capture#10443

Merged
charleyf merged 11 commits intomainfrom
charley/lg-12842-form-errors-for-document-capture
Apr 22, 2024
Merged

LG-12842: More Accessible Form Errors for Document Capture#10443
charleyf merged 11 commits intomainfrom
charley/lg-12842-form-errors-for-document-capture

Conversation

@charleyf
Copy link
Contributor

@charleyf charleyf commented Apr 16, 2024

🎫 Ticket

https://cm-jira.usa.gov/browse/LG-12842

🛠 Summary of changes

This PR moves the field error inside the HTML <label> for that field to make the association clearer. The ticket says that this is so that screen readers work better. The iPhone screenreader seems to work fine on both main and this branch.

Note: What/when to focus is somewhat confusing and does different things depending on whether there's a red box/banner displayed on the top of the screen. See this note in Jira.

📜 Testing Plan

Provide a checklist of steps to confirm the changes.

  • Get to the front/back/selfie page
  • Scroll to the bottom of the page so the "Submit" button is visible.
  • Turn on screenreader (Siri - "Turn on screenreader")
  • Click the submit button (double click to submit with screenreader on)
  • The first error field is highlighted and the error text is read.

👀 Screenshots

IMG_4975

@charleyf charleyf changed the title Charley/lg 12842 form errors for document capture LG-12842: More Accessible Form Errors for Document Capture Apr 16, 2024
@charleyf charleyf marked this pull request as ready for review April 16, 2024 13:26
charleyf and others added 2 commits April 16, 2024 10:19
Co-authored-by: Andrew Duthie <1779930+aduth@users.noreply.github.com>
@amirbey amirbey self-requested a review April 16, 2024 17:57
Copy link
Contributor

@amirbey amirbey left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM .. i tested each photo field and the field error was focused to and read out 👍🏿

Copy link
Contributor

@aduth aduth left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we add some test coverage?

@charleyf charleyf merged commit 02061f7 into main Apr 22, 2024
@charleyf charleyf deleted the charley/lg-12842-form-errors-for-document-capture branch April 22, 2024 18:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants