Accessibility-spec-driven component development
Maciek Pekala @penzington
A common scenario for every frontend dev...
1. Design spec
2. Styling + Markup
3. Behaviour
4. Accessibility
1. Picture of a dropdown
2. Styling the divs
3. Crafting the javascripts
4. Does the focus work?
Been there, done that
1. Accessibility spec
2. Markup
3. Behaviour
4. Design + Styling
Why Accessibility?
ComboBox: What we'll need
ComboBox: Roles and attributes
role - combobox / listbox / option
aria-haspopup
aria-owns
aria-expanded
aria-autocomplete
aria-controls
aria-activedescendant
aria-labelledby
aria-selected
Live coding session!
👋
Maciek Pekala
@penzington
Software Developer @pleo
Accessibility-spec-driven component development
By pekala
Accessibility-spec-driven component development
TDD style component development using WAI-ARIA specs and react-testing-library. Video of the talk here: https://www.youtube.com/watch?v=oGBQWLWHIOY and code is here: https://codesandbox.io/s/a11y-combobox-done-mtt2o
