hypeserver / react-date-range

A React component for choosing dates and date ranges.
MIT License
2.58k stars 667 forks source link

Accessibility Issues with month and year picker #416

Closed nikeeshi closed 3 years ago

nikeeshi commented 3 years ago

Subject of the issue

The month and year picker do not follow WCAG, violating the rule "Form elements must have lables"

[BUG] Bug Reproduce Steps

  1. Install Axe. https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd
  2. Run the test in the demo page. https://hypeserver.github.io/react-date-range/ Instead of this step, you can also run yarn start locally in this repository.
  3. Axe reports issues of the month and year picker that "Form elements must have labels".

[BUG] Expected behaviour

No issue should be reported.

The react-date-range picker should include in their API a way to set a aria-label to the month and year picker.

Environment

Package Version: - (The current version on Oct 14th in demo page.) React version: - Node version: - Browser: Chrome 85

month
kamyar commented 3 years ago

Should be fixed please feel free to open a new issue if something is missing