Multiple matching elements error message returns only new line characters

• cypress-testing-library version: 7.0.3
• node version: 14.14.0
• npm (or yarn) version: yarn 1.22.5

Relevant code or config

// In the test file
findByLabelText('Label 1');

// In the HTML
<label for="by-text-input">Label 1</label>
<input type="text" placeholder="Input 1" id="by-text-input" />

<label for="by-text-input-1">Label 1</label>
<input type="text" placeholder="Input 1" id="by-text-input-1" />

What you did:

Run a Cypress test using the query cy.findByLabelText('Label 1') where more than one matching element existed on the page

What happened:

The expected TestingLibraryElementError is displayed, but the text below “Here are the matching elements:” contains only new line characters. See a screenshot of an example below:

NB: this screenshot is taken after I:

• downloaded the cypress-testing-library repo
• Added an extra input with “Label 1” to the test app
• Ran the find* dom-testing-library commands spec

Suggested solution:

If it is possible to include the list of matching elements in the error message it will make failures much easier to debug, especially in CI.

[istateside]

@leschdom that was helpful, thank you!

PR’s linked above

I think the issue is not related to which Cypress version is used, but rather that, at the time the decision was made to stop logging in Cypress, there was no default enforced maximum length on the string output. So we should be safe to bring back the behavior, since people will need to opt into a version update in dom-testing-library or cypress-testing-library to get the new logs

[leschdom]

Thanks for checking the issue @istateside !

I also did a little research some weeks ago and came across this. Here are some links I noted:

• https://github.com/testing-library/dom-testing-library/commit/99760f08a9f0b5f78da3885f06a427c144440780
• https://github.com/testing-library/dom-testing-library/pull/950
• https://github.com/testing-library/dom-testing-library/pull/45

When passing in Cypress window.document to prettyDOM, it crashes because document.outerHTML.length results in Cannot read property length of undefined error. (prettyDOM error when container is document #44)

• https://github.com/testing-library/dom-testing-library/issues/44

So it seems older versions of Cypress (like v3.0.x) crashed with the implementation of prettyDOM (which was later changed for different reasons). But the newer versions don’t seem to have that problem, which makes me think if either the dom-testing-library should not contain any special logic just for Cypress at all or if this logic has to be “scoped” for the old versions only (to be backwards compatible).

Hope it is somewhat useful when opening a PR 😃