Skip to content

Add async/retryable findBy* and findAllBy* version of the queries #203

Closed
@kentcdodds

Description

@kentcdodds

Describe the feature you'd like:

@alexkrolick has brought this up before and we ultimately decided to not go for it at the time, but I've been thinking about it more and I think it's time to revisit the decision.

There are some UI frameworks that are completely async. In my TestingJavaScript.com course when I show how to use dom-testing-library with these, I had to create a fire-event-async.js file to deal with those, but that wasn't enough for mithril's tests because mithril does not re-render on the next tick all the time (for who knows what reason 🤷‍♂️).

The findBy* and findAllBy* variants of the queries would return promises that resolve when the query is satisfied, or timeout after 3500ms or so.

Suggested implementation:

I'm thinking it'd be something like this:

const findByText = (...args) => waitForElement(() => getByText(...args))
const findAllByText = (...args) => waitForElement(() => getAllByText(...args))

Describe alternatives you've considered:

So far the alternative is to have people write this themselves:

const successMessage = await waitForElement(() => getByText(/.*success.*/i))
expect(successMessage).toHaveTextContent('Welcome back Nancy')

That's worked pretty well most of the time, but I think it would be nicer to write that like this:

const successMessage = await findByText(/.*success.*/i)
expect(successMessage).toHaveTextContent('Welcome back Nancy')

Teachability, Documentation, Adoption, Migration Strategy:

We do have query explosion going on and I think the docs could be improved slightly around this to document first the types of queries (label text, text, placeholder, etc), and then the variants (getBy*, queryAllBy*, etc.).

This would be a new feature, so no breaking change/migration strategy necessary.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions