tusen-ai / naive-ui

A Vue 3 Component Library. Fairly Complete. Theme Customizable. Uses TypeScript. Fast.
https://www.naiveui.com
MIT License
15.97k stars 1.67k forks source link

Correctly use <label> tag for radio buttons #4631

Open woodhull opened 1 year ago

woodhull commented 1 year ago

This function solves the problem (这个功能解决的问题)

Currently when a label is supplied to the <n-radio> component it a div with a class name indicating that it is a label. Instead the component should render the semantic <label> tag with the for attribute set.

This means that forms rendered with this library are less accessible than they would otherwise be. The resulting radio buttons do not interact correctly with some automated testing libraries like Capybara / Selenium.

See also: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio

Expected API (期望的 API)

Same API, but the markup generated should more closely follow the web standard to allow for accessibility.

jahnli commented 6 months ago

This issue does not have any recent activity. If you are still experiencing similar problems, open a new error, including a minimal copy of the problem

woodhull commented 6 months ago

🙃

jahnli commented 6 months ago

At present, the problem has been submerged, I personally think that only by re-opening a problem can more people see it and be willing to add it. If this problem is closed, I am very sorry and I will re-open it