cypress-testing-library
cypress-testing-library copied to clipboard
Feature Request: respect `includeShadowDom` cypress option
-
cypress-testing-library
version: 7.0.0 -
node
version: v12.16.2 -
npm
(oryarn
) version: yarn 1.22.5
Problem description:
Cypress recently released shadow DOM support and it is no longer experimental. They also recently let you specify an includeShadowDom
option on describe and it blocks. This is very convenient if your entire test operates within the shadow DOM. Ideally, cypress-testing-library would respect this option and this would work even when something is inside a shadow DOM:
it ("works", { includeShadowDOM: true }, () => {
cy.findByLabelText(<label>)
cy.findByTestId(<testId>)
});
At the moment, it is necessary to get inside the shadow DOM first and then use cypress-testing-library functions, so you are forced to do something like this instead:
cy.get("#root-of-shadow-dom").shadow().findByLabelText(<label>)
cy.get("#root-of-shadow-dom").shadow().findByTestId(<testId>)
Suggested solution:
After reading through https://github.com/testing-library/dom-testing-library/issues/413, it looks like the current recommendation for testing within a shadow DOM with testing library is to use this package that wraps around dom-testing-library and replaces querySelectorAll with a version that traverses shadow DOMs. So in theory, a cypress package could be created that wraps around test-library__dom, but that wouldn't quite work since it needs to either include the shadow DOM or not based on the includeShadowDom
option from Cypress.
So to me, it feels like the best solution would be to add a similar includeShadowDom
option to the dom-testing-library functions the same as cypress did and pass it on through. Obviously shadow DOM support was proposed once before and it was decided not to build it in, but perhaps that should be reconsidered as shadow DOM becomes more common and testing frameworks like cypress add official support for it. if we want to go this route, assume I should open an issue in dom-testing-library but wanted to open an issue here first since it relates specifically to Cypress.
Hi @TLadd,
If you can add support for shadow DOM without making this codebase really complicated then I would consider merging that. Otherwise a fork would be more appropriate.
I guess resolving https://github.com/testing-library/dom-testing-library/issues/413 would resolve this issue as well.