HTML fieldset and nested fieldset test
Simple fieldset
Test
- The legend should be announced when entering the fieldset from the top or bottom.
Example
Code sample
OS | Browser | NVDA 2014.4 | JAWS 16 | VoiceOver |
---|---|---|---|---|
Windows 7 | IE 11 |
Down: "Personal details grouping. Name. Edit. Blank" "Address. Edit. Blank" Up: "Personal details grouping. Address. Edit. Blank" "Name. Edit. Blank" |
Down: "Personal details. Name. Edit. Type in text" "Personal details. Address. Edit. Type in text" Up: "Personal details. Address. Edit. Type in text" "Personal details. Name. Edit. Type in text" |
|
Windows 7 | IE 8 |
Down: "Personal details grouping. Name. Edit. Blank" "Address. Edit. Blank" Up: "Personal details grouping. Address. Edit. Blank" "Name. Edit. Blank" |
Down: "Personal details. Name. Edit. Type in text" "Personal details. Address. Edit. Type in text" Up: "Personal details. Address. Edit. Type in text" "Personal details. Name. Edit. Type in text" |
|
Windows 7 | Chrome 39 |
Down: "Personal details grouping. Name. Edit. Blank" "Address. Edit. Blank" Up: "Personal details grouping. Address. Edit. Blank" "Name. Edit. Blank" |
Down: "Personal details. Name. Edit. Type in text" "Personal details. Address. Edit. Type in text" Up: "Personal details. Address. Edit. Type in text" "Personal details. Name. Edit. Type in text" |
|
Windows 7 | Firefox 34 |
Down: "Personal details grouping. Name. Edit with autocomplete. Blank" "Address. Edit. Blank" Up: "Personal details grouping. Address. Edit with autocomplete. Blank" "Name. Edit. Blank" |
Down: "Personal details. Name. Edit. Type in text" "Address. Edit. Type in text" Up: "Personal details. Address. Edit. Type in text" "Name. Edit. Type in text" |
|
OSX 10.9 | Chrome 39 |
Down: "Name. Edit. Text" "Address. Edit. Text" Up: "Address. Edit. Text" "Name. Edit. Text" |
||
OSX 10.9 | Firefox 34 |
Down: "Name. Personal details. Personal details. Text" "Address. Personal details. Personal details. Text" Up: "Address. Personal details. Personal details. Text" "Name. Personal details. Personal details. Text" |
||
OSX 10.9 | Safari 7 |
Down: "Name. Personal details. Edit. Text" "Address. Personal details. Edit. Text" Up: "Address. Personal details. Edit. Text" "Name. Personal details. Edit. Text" |
Nested fieldset
Test
- The nested legend should be announced when entering the fieldset from the top or bottom.
Example
Code sample
OS | Browser | NVDA 2014.4 | JAWS 16 | VoiceOver |
---|---|---|---|---|
Windows 7 | IE 11 |
Down: "Add your details. Grouping. Phone. Edit. Blank" "Favourites. Grouping. Color. Edit. Blank" "Fruit. Edit. Blank" "Email. Edit. Blank" Up: "Add your details. Grouping. Email. Edit. Blank" "Favourites. Grouping. Fruit. Edit. Blank" "Color. Edit. Blank" "Phone. Edit. Blank" |
Down: "Add your details. Phone. Edit. Type in text" "Favourites. Color. Edit. Type in text" "Favourites. Fruit. Edit. Type in text" "Add your details. Email. Edit. Type in text" Up: "Add your details. Email. Edit. Type in text" "Favourites. Fruit. Edit. Type in text" "Favourites. Color. Edit. Type in text" "Add your details. Phone. Edit. Type in text" |
|
Windows 7 | IE 8 |
Down: "Add your details. Grouping. Phone. Edit. Blank" "Favourites. Grouping. Color. Edit. Blank" "Fruit. Edit. Blank" "Email. Edit. Blank" Up: "Add your details. Grouping. Email. Edit. Blank" "Favourites. Grouping. Fruit. Edit. Blank" "Color. Edit. Blank" "Phone. Edit. Blank" |
Down: "Add your details. Phone. Edit. Type in text" "Favourites. Color. Edit. Type in text" "Favourites. Fruit. Edit. Type in text" "Add your details. Email. Edit. Type in text" Up: "Add your details. Email. Edit. Type in text" "Favourites. Fruit. Edit. Type in text" "Favourites. Color. Edit. Type in text" "Add your details. Phone. Edit. Type in text" |
|
Windows 7 | Chrome 39 |
Down: "Add your details. Grouping. Phone. Edit. Blank" "Favourites. Grouping. Color. Edit. Blank" "Fruit. Edit. Blank" "Email. Edit. Blank" Up: "Add your details. Grouping. Email. Edit. Blank" "Favourites. Grouping. Fruit. Edit. Blank" "Color. Edit. Blank" "Phone. Edit. Blank" |
Down: "Add your details. Phone. Edit. Type in text" "Favourites. Color. Edit. Type in text" "Favourites. Fruit. Edit. Type in text" "Add your details. Email. Edit. Type in text" Up: "Add your details. Email. Edit. Type in text" "Favourites. Fruit. Edit. Type in text" "Favourites. Color. Edit. Type in text" "Add your details. Phone. Edit. Type in text" |
|
Windows 7 | Firefox 34 |
Down: "Add your details. Grouping. Phone. Edit with autocomplete. Blank" "Favourites. Grouping. Color. Edit with autocomplete. Blank" "Fruit. Edit with autocomplete. Blank" "Email. Edit with autocomplete. Blank" Up: "Add your details. Grouping. Email with autocomplete. Edit. Blank" "Favourites. Grouping. Fruit. Edit with autocomplete. Blank" "Color. Edit with autocomplete. Blank" "Phone. Edit with autocomplete. Blank" |
Down: "Add your details. Phone. Edit. Type in text" "Favourites. Color. Edit. Type in text" "Fruit. Edit. Type in text" "Email. Edit. Type in text" Up: "Add your details. Email. Edit. Type in text" "Favourites. Fruit. Edit. Type in text" "Color. Edit. Type in text" "Phone. Edit. Type in text" |
|
OSX 10.9 | Chrome 39 |
"Phone. Edit. Text" "Color. Edit. Text" "Fruit. Edit. Text" "Email. Edit. Text" |
||
OSX 10.9 | Firefox 34 |
Down: "Phone. Add your details. Add your details. Text "Colors. Favourites. Favourites. Add your details. Add your details. Text "Fruit. Favourites. Favourites. Add your details. Add your details. Text "Email. Add your details. Add your details. Text Up: "Email. Add your details. Add your details. Text "Fruit. Favourites. Favourites. Add your details. Add your details. Text "Colors. Favourites. Favourites. Add your details. Add your details. Text "Phone. Add your details. Add your details. Text |
||
OSX 10.9 | Safari 7 |
Down: "Phone. Add your details. Edit text "Colors. Favourites. Edit text "Fruit. Favourites. Edit text "Email. Add your details. Edit text Up: "Email. Add your details. Edit text "Fruit. Favourites. Favourites. Edit text "Colors. Favourites. Favourites. Edit text "Phone. Add your details. Edit text |