[michelengelen]

• I have followed (at least) the PR section of the contributing guide.

Adds axe coverage, WCAG unit tests, and a WCAG 2.2 Level A/AA conformance report for FormGroup. This is Wave 1, item 8 of #49260. Part of #49412.

FormGroup

Result	Count
✅ Supports	7
⚠️ Partially Supports	0
❌ Does Not Support	0
➖ Not Applicable	48
🚩 Flagged	3/7

FormGroup renders a div with no role. Its group semantics come from a fieldset with a legend, or from role="group" with a name. The docs show only the fieldset pattern. No docs page or demo documents role="group" on FormGroup. Every rated criterion is ✅ · ◐ Shared, and the report states what the author must add.

Report: FormGroup/accessibility.md

Rating decisions

The report rates a criterion only when FormGroup's own output governs it:

• Layout. FormGroup sets the flex layout and flex-wrap, so it rates 1.3.2, 1.4.10, and 2.4.3.
• Group. With role="group" and a name, FormGroup is the named group element, so it rates 1.3.1, 2.4.6, and 3.3.2.
• Text. FormGroup renders no text of its own, so 1.4.3, 1.4.4, 1.4.5, and 1.4.12 are not applicable. The CSS layout suite skips 1.4.4 and 1.4.12 for FormGroup.
• Color. FormGroup gets the error class, but no error style, so 1.4.1 is not applicable.
• 4.1.2. FormGroup sets no role and supplies no name through its own markup, so 4.1.2 is not applicable. The group role and name pattern is rated under 1.3.1.
• One root cause, one gap. The required state of a group is the FormLabel 1.3.1 gap. The 3.3.2 entry links to the FormLabel report.

Changes

• Tests. A test is evidence only if it fails when FormGroup's own output regresses. The "WCAG 2.2 conformance" block in FormGroup.test.js has two tests:
  • 1.3.1: role="group" with aria-labelledby gives a named group. This fails if FormGroup stops passing props to its root.
  • 2.4.3: in the browser test projects only, a row group shows its controls from left to right in tab order.
  • Three tests have no criterion number in their title, because they do not depend on FormGroup's output: "renders no role of its own", "gets its group name from a fieldset legend", and "makes the controls of a row group tab stops in DOM order".
• axe. FormGroup has no docs page of its own, so it follows the pattern of [test][FormControlLabel] Add axe tests and WCAG conformance report #49524: one fixture, FormGroupA11yStates, owns a new form-group slug and asserts every rule. It covers a legend, row, an error group, role="group", an unnamed group, and a wide row.
• Playwright. FormGroup is in the CSS layout suite on its fixture, with skipCriteria: ['1.4.4', '1.4.12']. The five-checkbox row wraps at 320 px.
• Docs page. The hard-coded component count is removed, with the same text as the other Wave 1 PRs.

Findings recorded in the report

• 3.3.2. The demo survey covers the checkbox, switch, app bar, list, focus-visible, Popper, and CRUD dashboard demos.
  • With a group label: CheckboxesGroup, SwitchesGroup, both FormControlLabelPosition demos, and FocusVisibleCustomIcons.
  • No group label, but each control is a separate option with its own label: CheckboxLabels, SwitchLabels, CustomizedSwitches, MenuAppBar, InteractiveList, and FullFocusVisibleDemo.
  • EmployeeForm uses FormGroup as a layout wrapper for the whole form. Each field has its own label.
• 1.3.1.
  • The two FormControlLabelPosition demos put aria-label on a FormGroup with no role. ARIA does not allow this. axe reports it only as incomplete, and no fixture exercises it.
  • ScrollPlayground puts a Typography heading inside each FormGroup. Nothing connects the heading to the group, so the group has no name.
  • FormControl does not connect a FormHelperText to the group.
  • In the error state, the checkboxes get no aria-invalid.

Merge order with the sibling Wave 1 PRs

Do not hand-merge the generated blocks: after each rebase, run pnpm a11y:scorecard.

Not done in this PR

• The screen-reader checks from the issue have steps and pass conditions in the report. Nobody has run them yet.
• The CheckboxesGroup "You can display an error" helper text is a FormHelperText finding. The FormHelperText report records it.

Follow-ups (tracked in #49477)

• Docs: checkboxes.md and switches.md should say that a group needs a fieldset and legend, or role="group" with a name. Document the role="group" pattern on FormGroup.
• Demos: fix aria-label on the role-less FormGroup in FormControlLabelPosition. Connect the group headings in ScrollPlayground to their groups.

🤖 Generated with Claude Code

[code-infra-dashboard]

Deploy preview

• docs/data/material/components/form-group/form-group.a11y.json

  
  
• docs/data/material/getting-started/accessibility/accessibility.md

  
  

Bundle size

Bundle	Parsed size	Gzip size
@mui/material	0B(0.00%)	0B(0.00%)
@mui/lab	0B(0.00%)	0B(0.00%)
@mui/private-theming	0B(0.00%)	0B(0.00%)
@mui/system	0B(0.00%)	0B(0.00%)
@mui/utils	0B(0.00%)	0B(0.00%)

Details of bundle changes

Performance

No regressions in 32 benchmarks · ran 4m 13s · details

---

Check out the code infra dashboard for more information about this PR.