The findBy Variant
Explore how to use the findBy variant in React Testing Library to write asynchronous tests that wait for elements to appear with adjustable timeouts. Understand how findBy throws errors if elements are missing or duplicated, and how findAllBy helps verify multiple elements. This lesson helps improve test reliability for components rendering delayed data.
We'll cover the following...
Starter project
The starter project for this lesson contains the same PersonPage component as in the last lesson. It also contains the failing test from the last lesson that verifies that a person’s name is rendered after the data is fetched.
A copy of the project is in the code widget below. Clicking the “Run” button will automatically run the project’s tests.
export default "test-file-stub";
Confirm that the test fails by running it. We’ll resolve the problem in this test in this lesson.
We will resolve the problem in this test in this lesson.
The findBy variant
The problem with the failing test is that getBy doesn’t wait or retry if the element isn’t ...