Open wbolduc opened 1 year ago
I had the same issue, and ended up here as well. For what it's worth, while I also think it would be intuitive to be able to chain finds like above, I found that chaining non-testing-library
queries was a workaround in this case.
// Above example
cy.get(".list-unstyled")
.findAllByRole("listitem")
.findByRole("link", { name: "5: BB" })
.should("exist")
// A working alternative
cy.get(".list-unstyled")
.findAllByRole("listitem")
.find("link")
.contains("5: BB")
.should("exist")
Same problem here but with findByText()
I think they only search on first container element https://github.com/testing-library/cypress-testing-library/blob/main/src/index.js#L58
cypress-testing-library
version: 9.0.0cypress
version: 12.3.0node
version: 16.13.2npm
version: 8.19.2Relevant code or config
What you did: I have a list of 2 links that I want to check are:
First I would like to find the list items (to check the count) and then verify that there's a list item that has that link text
What happened: The above test code works for the first link but fails for the second link. It appears that only one of the found listItems is being passed to the following selector
//rendered html - Note: These links render async but cypress retryability should work to avoid this![image](https://user-images.githubusercontent.com/16736623/210858537-8932a265-0fab-47a9-87a0-ad9615ac1d6f.png)
//actual html - oops {...rest} properties but that shouldn't matter![image](https://user-images.githubusercontent.com/16736623/210857617-237815a5-babb-471a-9ae6-da9dddfc6434.png)
//failing test assertion
//same failing test (2 screenshots because there's a bunch of api between these two)
![image](https://user-images.githubusercontent.com/16736623/210857844-e2e8e8dd-45b5-4217-8dd0-b6c799416e59.png)
Reproduction repository:
Problem description: 'findAll' and 'find' selectors either don't chain correctly or should have prevSubject set to false on the custom command
Suggested solution: I think you should be able to chain finds like this to narrow a selection on a page with a lot of content on it