Unable to properly specify aria-labelledby on RadioButtonGroup
Closed this issue · 3 comments
Duplicates
- I have searched the existing issues
Latest version
- I have tested the latest version
Summary 💡
I am testing my application with @testing-library/react. I have a form that has a RadioButtonGroup labelled with "I am signing up as" and then some choices. When I use screen.getByLabelText from the testing library to try to find the label of a RadioButtonGroup, I get the following error:
Found a label with the text of: I am signing up as, however no form control was found associated to that label. Make sure you're using the "for" attribute or "aria-labelledby" attribute correctly.
The correct way to implement this would be to set the id attribute on the Label and then the the aria-labelledby attribute to MUI's RadioGroup component where the value is the id of the label. A properly implemented example is shown in the first example of the MUI Radio Group demo page.
For easier developer use, you can automatically generate the id and aria-labelledby attributes within the library. A possible reasonable id to use would be radio-button-group-${props.name}. An alternative solution would be to just allow us to pass the aria-labelledby attribute (or any MUI RadioGroup prop) to the MUI RadioGroup component ourselves. We can already set an id on the form label via the formLabelProps prop so setting aria-labelledby would allow us to finish the implementation.
Examples 🌈
No response
Oh, I just noticed that it seems like you already generate id and for attribute for your components. The for attribute also works, but this stuff isn't being generate for RadioButtonGroup still.
@Blargel do you have time to prepare a PR for this? I am not sure as {...formLabelProps} is available isnt that enough to set the aria properties?
@dohomi Sorry, I didn't seem to get a notification for this and forgot about this issue until now. I think I tried formLabelProps but it wasn't setting the values to the right place for some reason. The details are a little fuzzy now after a few weeks but I'll give it a shot on a PR this weekend.