*ByRole "status" for <output/> element doesn't handle name attribute correctly
Closed this issue · 1 comments
Yimiprod commented
@testing-library/reactversion: ^15.0.4- Testing Framework and version: Jest ^29.7.0
- DOM Environment: JSDom ^29.7.0
Relevant code or config:
const Test = () => {
return (
<>
<output name="not-found">NOT FOUND</output>
<output aria-label="found">IS FOUND</output>
</>
);
};
describe('not founding status role with standard name attribute', () => {
it('should have found both status', () => {
const { getByRole } = render(<Test />);
const statusOne = getByRole('status', { name: 'not-found' }); // this one will fail
const statusTwo = getByRole('status', { name: 'found' });
expect(statusOne).toHaveValue('NOT FOUND');
expect(statusTwo).toHaveValue('IS FOUND');
});
});What you did:
Tried to find by role a "status" with <output/> element, with the attribute name on it.
What happened:
It is flagged as an empty name:

Reproduction:
Run example code in jest environnement. The one named with aria-label is correctly named, the one with name attribute isn't.
Problem description:
The name attribute is a standard for input and output naming, the fact that we have to use aria-label mean that the name is lost in the process.
Suggested solution:
*ByRole() for <output/> should find by name for aria-label and name both.