seas-computing / mark-one

A UI component library for building React Apps (in development)
https://seas-computing.github.io/mark-one/
BSD 3-Clause "New" or "Revised" License
0 stars 1 forks source link

adding aria-describedby to inputText and Dropdown component #79

Closed farassadek closed 3 years ago

farassadek commented 3 years ago

Adding aria-describedby to InputText and Dropdown for accessibility. Linting No testing required

codecov[bot] commented 3 years ago

Codecov Report

Merging #79 into develop will not change coverage. The diff coverage is n/a.

Impacted file tree graph

@@           Coverage Diff            @@
##           develop      #79   +/-   ##
========================================
  Coverage    98.24%   98.24%           
========================================
  Files           42       42           
  Lines          513      513           
  Branches        96       96           
========================================
  Hits           504      504           
  Misses           5        5           
  Partials         4        4           
Impacted Files Coverage Δ
src/Forms/Dropdown.tsx 100.00% <ø> (ø)
src/Forms/TextInput.tsx 100.00% <ø> (ø)

Continue to review full report at Codecov.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 71423d4...1cd6f80. Read the comment docs.

Vittorio2015 commented 3 years ago

Moving the information about the functionality of the filter in a label (and removing both 'aria-describedby' and the related 'span' with this information, as shown in this screen capture), although we should add to these labels references specific to their table headers, In this case, something along "The table will be filtered by course title, as characters are typed in this input form" Here is a recording of the screen reader test with Mac OS screen reader VoiceOver (movie available on Slack): image