Skip to content

FilterTrigger

What component has

Keyboard support

See detailed information about the keyboard support for the FilterTrigger in the Keyboard control guide.

Roles and attributes

The list below describes roles and attributes that component already has.

RoleAttributeElementUsage
buttonbuttonIdentifies the element as a button. Accessible name for the button is defined by the text content of the element.
groupdivIdentifies the div element as a group container for the buttons.
aria-labeldiv , buttonThe aria-label attribute defines a string value that labels an interactive element.

Other recommendations

See more accessibility recommendations in the common Accessibility guide.

Automated screen reader testing

Intergalactic v15.29.0, React v18.2.0, Playwright v1.25.1, Guidepup v0.13.1, MacOS Monterey 12.

Running screen reader against this file.

1. Screen reader goes into the active element.
2. Screen reader says "In web content Filter trigger with options Filter trigger with options".
3. Screen reader goes to the next element.
4. Screen reader says "Filter Select option list box pop up button".
5. Screen reader triggers element default action.
6. Screen reader goes to the next element.
7. Screen reader says "List of options list box".
8. Screen reader goes to the next element.
9. Screen reader goes to the next element.
10. Screen reader triggers element default action.
11. Screen reader says "Option 3 group Filter list box pop up group".
12. Screen reader goes out of active element.
13. Screen reader says "Filter list box pop up group".
14. Screen reader goes into the active element.
15. Screen reader says "Option 3".
16. Screen reader triggers element default action.
17. Screen reader goes to the next element.
18. Screen reader says "Option 3 button".
19. Screen reader triggers element default action.
20. Screen reader says "Filter list box pop up empty pop up button".
21. Screen reader goes out of active element.
22. Screen reader says "Out of web content".
23. Screen reader goes into the active element.
24. Screen reader says "Filter Select option list box pop up button".
25. Screen reader goes to the next element.
1. Screen reader goes into the active element.
2. Screen reader says "In web content Filter trigger with options Filter trigger with options".
3. Screen reader goes to the next element.
4. Screen reader says "Filter Select option list box pop up button".
5. Screen reader triggers element default action.
6. Screen reader goes to the next element.
7. Screen reader says "List of options list box".
8. Screen reader goes to the next element.
9. Screen reader goes to the next element.
10. Screen reader triggers element default action.
11. Screen reader says "Option 3 group Filter list box pop up group".
12. Screen reader goes out of active element.
13. Screen reader says "Filter list box pop up group".
14. Screen reader goes into the active element.
15. Screen reader says "Option 3".
16. Screen reader triggers element default action.
17. Screen reader goes to the next element.
18. Screen reader says "Option 3 button".
19. Screen reader triggers element default action.
20. Screen reader says "Filter list box pop up empty pop up button".
21. Screen reader goes out of active element.
22. Screen reader says "Out of web content".
23. Screen reader goes into the active element.
24. Screen reader says "Filter Select option list box pop up button".
25. Screen reader goes to the next element.

Released under the MIT License.

Released under the MIT License.