Open coforma-jamie opened 1 year ago
@coforma-jamie We might have to open a ticket with Platform to address this. When building a form, we write our content in a schema / uiSchema
which tells the Platform Forms Library which components to render in our form.
Based on how the form was built, the Forms Library is rendering ObjectField.jsx (component renders content inside <fieldset />)
and TitleField.jsx (component renders title inside <legend />)
on step 2 of the form. The result is what we see here.
cc: @tblackwe @steele-lm
Point of contact
Jamie Klenetsky Fay @coforma-jamie
Severity level
3, Moderate. Should be fixed in 1-3 sprints post-launch.
Details
On step 2 of the form, the "What's your level of education?" and "Are you moving in the next 30 days?" fields are contained within a![image](https://github.com/department-of-veterans-affairs/va.gov-team/assets/135633989/2a25a5f7-e0bf-43b2-9f34-6290d4ab58fb)
<fieldset>
with the<legend>
"Additional information":There are two issues with this:
<fieldset>
. There's only 1 "Additional information" page on this form, and these two questions aren't related to each other, so this extra layer of grouping is superfluous and leads to the second issue:<legend>Additional Information</legend>
is duplicative of the "Step 2 of 4: Additional Information" heading. A screen reader user would hear something like this:Heading level 2, Step 2 of 4: Additional information. ... Additional information, group.
This adds more for the SR user to have to parse through unnecessarily.Reproduction steps
<legend>
above the "What's your level of education?" field. You can also use a screen reader like VoiceOver or NVDA to hear what it sounds like.Proposed solution or next steps
Take the "education" and "moving" fields out of their grouping
<fieldset>
; remove the<legend>
. The page will look like this, in pseudocode:References, articles, or WCAG support
When to use a fieldset and legend, from gov.uk
Type of issue
Reproduction steps
<legend>
above the "What's your level of education?" field. You can also use a screen reader like VoiceOver or NVDA to hear what it sounds like.Proposed solution or next steps
Take the "education" and "moving" fields out of their grouping
<fieldset>
; remove the<legend>
. The page will look like this, in pseudocode:References, articles, or WCAG support
When to use a fieldset and legend, from gov.uk
Type of issue