search

testing-library / dom-testing-library

🐙 Simple and complete DOM testing utilities that encourage good testing practices.
https://testing-library.com/dom
MIT License
3.26k stars 466 forks source link

Add option to *ByText to search by innerText #1216

Open steinybot opened 1 year ago

steinybot commented 1 year ago

Describe the feature you'd like:

I'd like to have an includeDescendents option to *ByText which would effectively be the same as searching by innerText (but it's not that simple since it needs to respect the ignore option).

I'm new to testing-library and have more familiarity with Cypress. I was hoping to find similar behaviour to cy.contains.

Suggested implementation:

Describe alternatives you've considered:

cy.contains but this is always an { exact: false} match which is usually less than ideal.

Teachability, Documentation, Adoption, Migration Strategy:

Given this:

      <p>
        Refer to the
        <a
          href="https://testing-library.com/docs/dom-testing-library/api-custom-queries"
          >Custom Queries</a
        >
        section for more details.
      </p>

Then this:

findByText('Refer to the Custom Queries section for more details.', { includeDescendents: true })

Should match the p node.

MatanBobi commented 1 year ago

As a general idea, the getBy* queries can accept a function that will be called for every element you're rendering and let you query the way you want. You can have a look at this solution that searches for textContent and gives you the direct parent that has the content you're looking for. Hope it will help :)