Skip to content

Commit dbca6ec

Browse files
committed
Update doc
1 parent 67cd16c commit dbca6ec

1 file changed

Lines changed: 10 additions & 10 deletions

File tree

packages/mui-material/src/Checkbox/accessibility.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
88
| ⚠️ Partially Supports | 3 |
99
| ❌ Does Not Support | 0 |
1010
| ➖ Not Applicable | 30 |
11-
| 🚩 Flagged | 12/25 |
11+
| 🚩 Flagged | 7/25 |
1212

1313
## Known gaps
1414

@@ -22,7 +22,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
2222

2323
#### 1.3.2 Meaningful Sequence · A
2424

25-
`🚩` · `✅ Supports` · `○ Author`
25+
`✅ Supports` · `○ Author`
2626

2727
- The checkbox is one control: the hidden `<input>` followed by the `aria-hidden` checkmark icon, with `FormControlLabel` placing the label and control in source order, so the exposed reading order matches the visual order. The component applies no CSS reordering to itself.
2828
- Order carries meaning only across several controls, which the surrounding layout sets. `labelPlacement="start"` flips the label/control visually with `row-reverse`, so confirm the reading order of a checkbox group still matches its visual order.
@@ -37,7 +37,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
3737

3838
#### 1.3.3 Sensory Characteristics · A
3939

40-
`🚩` · `✅ Supports` · `○ Author`
40+
`✅ Supports` · `○ Author`
4141

4242
- The component renders no instructional text of its own, so it introduces no shape-, color-, or position-only instructions.
4343
- Surrounding copy must not rely on sensory characteristics alone (for example "check the green box" or "the boxes on the right"). That is authored content.
@@ -51,7 +51,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
5151

5252
#### 1.4.5 Images of Text · AA
5353

54-
`🚩` · `✅ Supports` · `○ Author`
54+
`✅ Supports` · `○ Author`
5555

5656
- Labels and helper text render as live DOM text; the checkmark icon is a vector graphic, not an image of text, and it carries no textual information.
5757
- This fails only if an author passes an image of text as the label. Use real text unless it is a logo.
@@ -65,7 +65,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
6565

6666
#### 2.4.11 Focus Not Obscured (Minimum) · AA
6767

68-
`🚩` · `✅ Supports` · `○ Author`
68+
`✅ Supports` · `○ Author`
6969

7070
- The checkbox is an ordinary focusable control and never places itself behind other content. Obscuring comes from sticky headers, banners, or overlays in the surrounding layout.
7171
- It passes as long as that content never hides a focused checkbox completely; partial overlap is fine.
@@ -79,7 +79,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
7979

8080
#### 3.2.4 Consistent Identification · AA
8181

82-
`🚩` · `✅ Supports` · `○ Author`
82+
`✅ Supports` · `○ Author`
8383

8484
- The author supplies the name through a `FormControlLabel` or an `aria-label`. Whether the same function is identified consistently across pages is up to the author.
8585
- Consistency is a cross-page property. Confirm that checkboxes with the same function share a label, and that one label is not reused for different functions.
@@ -103,7 +103,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
103103

104104
**Manual testing steps**
105105

106-
1. In the accessibility tree, inspect a labelled checkbox (`Checkbox` inside a `FormControlLabel`) and confirm it shows `role=checkbox` with the visible label as its name.
106+
1. In the accessibility tree, inspect alabelledcheckbox (`Checkbox` inside a `FormControlLabel`) and confirm it shows `role=checkbox` with the visible label as its name.
107107
2. Inspect a bare `<Checkbox />` with no label and confirm its name is empty, the failure mode authors must avoid.
108108
3. Confirm the checkmark icon's SVG is `aria-hidden`.
109109

@@ -120,7 +120,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
120120

121121
**Manual testing steps**
122122

123-
1. For a required labelled checkbox (`Checkbox required` inside a `FormControlLabel`), confirm `role=checkbox`, the name, `required`, and the wrapping `<label>`.
123+
1. For a requiredlabelledcheckbox (`Checkbox required` inside a `FormControlLabel`), confirm `role=checkbox`, the name, `required`, and the wrapping `<label>`.
124124
2. Toggle indeterminate and confirm `aria-checked` cycles `true`/`false`/`mixed`.
125125
3. In a fieldset group (`FormControl component="fieldset"` + `FormLabel component="legend"` around a `FormGroup`), confirm the `<fieldset>`/`<legend>` name is exposed but any error or required constraint is not (no `aria-describedby`/`aria-invalid`).
126126

@@ -229,7 +229,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
229229

230230
**Manual testing steps**
231231

232-
1. For a labelled checkbox (`Checkbox` inside a `FormControlLabel` reading "Remember me"), confirm the accessible name contains "Remember me".
232+
1. For alabelledcheckbox (`Checkbox` inside a `FormControlLabel` reading "Remember me"), confirm the accessible name contains "Remember me".
233233
2. If an `aria-label` is set, confirm it includes the visible text.
234234
3. Try a voice command speaking the visible label and confirm it activates the checkbox.
235235

@@ -262,7 +262,7 @@ Rated against WCAG 2.2 Level A and AA. See the [reports legend](../accessibility
262262

263263
**Manual testing steps**
264264

265-
1. Inspect a labelled checkbox (`Checkbox` inside a `FormControlLabel`) and confirm `role=checkbox` with a non-empty name in the accessibility tree.
265+
1. Inspect alabelledcheckbox (`Checkbox` inside a `FormControlLabel`) and confirm `role=checkbox` with a non-empty name in the accessibility tree.
266266
2. Toggle it with a screen reader running and confirm the state change is announced.
267267
3. With `indeterminate` set, confirm "mixed" or partially checked is announced.
268268

0 commit comments

Comments
 (0)