Is your feature request related to a problem? Please describe.

Follow up to #5760 & #5835.

If a screen reader user navigates via the tab key, they will arrive on the validation component input without being made aware of the validation requirements.

Describe the solution you'd like

Screen readers should call out the requirements of a validation import upon arrival to the component, similar to the way they are updated upon input change.

Describe alternatives you've considered

Before #5835, the checklist items dynamically set tabindex which would allow them to become focused via tab.

We decided this was unexpected behavior in #5760 and decided to remove. Focus states should be reserved for interactable elements only.

Additional context

There is an usa-sr-only element that gets updated with the validation state on input change but is empty upon initialization. We should explore ways to allow this span to be pre-populated with the validation requirements on init.

There are various functions we could access via validate() that will allow us to resolve this issue.

Methods tested to update the sr-only span on initialization

We can populate the screen reader span by running the validate() function on init. We could alternatively look into setting the sr-only text content on createInitialStatus().

However, I noticed that with VoiceOver, users had to use a "more information" command in order for the span to be read.

I tried replacing aria-describedby with aria-labelledby which will allow the requirements to be read without the more information command but this replaces the validation label (i.e. "code" in our component example) which I feel we should avoid.

I was also able to run validate() on focus, which appropriately updates and reads the sr-only span the first time the element is focused, but it is not read on any subsequent focus. I believe this is due to the status of the input/validation not changing. This behavior is consistent with text input behaviors where the status gets read out only if/when it changes.

For example, if you enter a number, the screen reader will read out the number requirement as complete. It will not read the number requirement status again unless the number is removed or another validation requirement is met.

While this is fine for input changes, it seems problematic for focus behaviors if users miss the validation requirements the first time they visit the input. It also seems a bit heavy-handed to call every time the component is focused.