Skip to content

New fields / notes with show js should be announced to screen readers #44

Description

@BryceStevenWilley

On the "Do you already have a child support order in your case?" page, selecting "Yes" reveals additional form fields (a date input), but this new content is not announced to screen reader users. This is a framework-level pattern that likely affects all conditionally revealed fields across the platform. During user testing, tester A (JAWS, Firefox, Desktop) acknowledged the WCAG concern but found the implementation handled it "about as cleanly as it could. It pops it up below, so, you know, if I'm going down the form, it's not like it popped up a new field above. You shouldn't miss it". He suggested a general note at the beginning of the form: "Maybe, if anything, at the very beginning of this whole thing, there might be just a quick [note] to say, hey, depending on the answers that you select, other options might appear". Tester B (VoiceOver, iPhone) was momentarily confused when the date field appeared on the main form: "That's probably where it threw me, and it threw me for a second". However, on the sandbox form, VoiceOver did announce the conditional content, suggesting the behavior may be inconsistent across different pages or implementations.

When conditional content appears, announce it with a brief status message (e.g., "Additional fields have appeared below") using a dedicated "aria-live=polite" region, or move focus to the newly revealed content, or both. As JJ suggested, a general note at the beginning of the interview that "depending on the answers you select, additional options may appear" would also help set expectations. See MDN's documentation on aria-live regions: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-live

(See A11Y-14)

Metadata

Metadata

Assignees

No one assigned

    Labels

    accessibilityWCAG or related accessibility flaw

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions