Is it possible to use findByRole for input of type search?

3.7k views Asked by At

I am trying to select a search input using react-testing-library in the more semantic way possible. I tagged the input with type=search, and I was expecting to be able to do something like this:

  cy.findByRole('search').click().clear().type(content);

However the type fails because there is no element with the role search. Is this a limitation? Or is it supposed to be put in a different place? For example in a wrapping form? Currently the search input is just that, an isolated input that triggers search queries.

2

There are 2 answers

4
Fody On BEST ANSWER

If you don't have an explicit role attribute on the element,

<input type="search">

the role to use is searchbox

cy.findByRole('searchbox').click().clear().type(content);  // passes
1
Alapan Das On

If you want to use the command findByRole, then you have to tag your input as role="search", then the below command should work-

 cy.findByRole('search').click().clear().type(content);