getByRole('search') does not find <search /> #1359
Description
@testing-library/domversion: Unknown
I rannpm list | grep @testling-libraryand I didn't get@testing-library/dom:
├── @testing-library/jest-dom@6.5.0 ├── @testing-library/react@15.0.6 ├── @testing-library/user-event@14.6.1 - Testing Framework and version: Vitest 3.1.3
- DOM Environment: jsdom 22.1.0
Relevant code or config:
it('contains search role', async () => { render(<search />); expect(screen.getByRole('search')).toBeInTheDocument(); });What you did:
I searched the search element by role search and expected it will be found. As it seems the proper role for that element.
What happened:
My test failed:
TestingLibraryElementError: Unable to find an element with the role "search" There are no available roles. Ignored nodes: comments, script, style <body> <div> <search /> </div> </body> ❯ Object.getElementError ../../node_modules/@testing-library/dom/dist/config.js:37:19 ❯ ../../node_modules/@testing-library/dom/dist/query-helpers.js:76:38 ❯ ../../node_modules/@testing-library/dom/dist/query-helpers.js:52:17 ❯ ../../node_modules/@testing-library/dom/dist/query-helpers.js:95:19 ❯ test.spec.tsx:30:19 28| it('contains search role', async () => { 29| render(<search />); 30| expect(screen.getByRole('search', { hidden: true })).toBeInTheDocument(); | ^ 31| }); Reproduction:
https://stackblitz.com/edit/dtl-template-ryhamkss?file=src%2Fmain.test.ts
Problem description:
The search element is not found by getByRole('search'). I was expecting the role search was okay for that element since that's mentioned in this table.
Suggested solution:
Maybe a change like the one done to solve this issue could be the answer.