viclafouch / mui-file-input

A file input designed for the React library MUI
https://viclafouch.github.io/mui-file-input/
MIT License
77 stars 17 forks source link

Accessibility: input does not have an associated label #53

Closed tartan75 closed 1 month ago

tartan75 commented 1 month ago

Describe the bug Axe accessibility testing reports the error "Form elements must have labels". While there is a label the for attrible has a differant ID to that of the input.

To Reproduce Steps to reproduce the behavior:

  1. Follow repo storybook example but without placeholder prop (as that prop stops Axe with another warning)

Expected behavior The input should have a valid label for accessibility WCAG2A, and other standards

Additional context The issue appears to be the result of the id of the input being set on input.tsx line 14. A change to const id = props.id appears to resolve the issue, however I have not checked if there are adverse effects from that change.

viclafouch commented 1 month ago

Hello !

Happy to open a PR ;)