Skip to content

Commit 3e92b6e

Browse files
authored
Update example-intro.mdx to use findBy instead of waitFor (#1242)
Closes #1186.
1 parent d80c584 commit 3e92b6e

File tree

1 file changed

+7
-11
lines changed

1 file changed

+7
-11
lines changed

docs/react-testing-library/example-intro.mdx

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ See the following sections for a detailed breakdown of the test
7474
import React from 'react'
7575
import {rest} from 'msw'
7676
import {setupServer} from 'msw/node'
77-
import {render, fireEvent, waitFor, screen} from '@testing-library/react'
77+
import {render, fireEvent, screen} from '@testing-library/react'
7878
import '@testing-library/jest-dom'
7979
import Fetch from '../fetch'
8080

@@ -93,7 +93,7 @@ test('loads and displays greeting', async () => {
9393

9494
fireEvent.click(screen.getByText('Load Greeting'))
9595

96-
await waitFor(() => screen.getByRole('heading'))
96+
await screen.findByRole('heading')
9797

9898
expect(screen.getByRole('heading')).toHaveTextContent('hello there')
9999
expect(screen.getByRole('button')).toBeDisabled()
@@ -110,7 +110,7 @@ test('handles server error', async () => {
110110

111111
fireEvent.click(screen.getByText('Load Greeting'))
112112

113-
await waitFor(() => screen.getByRole('alert'))
113+
await screen.findByRole('alert')
114114

115115
expect(screen.getByRole('alert')).toHaveTextContent('Oops, failed to fetch!')
116116
expect(screen.getByRole('button')).not.toBeDisabled()
@@ -136,7 +136,7 @@ import {rest} from 'msw'
136136
import {setupServer} from 'msw/node'
137137

138138
// import react-testing methods
139-
import {render, fireEvent, waitFor, screen} from '@testing-library/react'
139+
import {render, fireEvent, screen} from '@testing-library/react'
140140

141141
// add custom jest matchers from jest-dom
142142
import '@testing-library/jest-dom'
@@ -207,13 +207,9 @@ events to simulate user actions.
207207
fireEvent.click(screen.getByText('Load Greeting'))
208208

209209
// wait until the `get` request promise resolves and
210-
// the component calls setState and re-renders.
211-
// `waitFor` waits until the callback doesn't throw an error
212-
213-
await waitFor(() =>
214-
// getByRole throws an error if it cannot find an element
215-
screen.getByRole('heading'),
216-
)
210+
// the component calls setState and re-renders,
211+
// throwing an error if it cannot find an element
212+
await screen.findByRole('heading')
217213
```
218214

219215
### Assert

0 commit comments

Comments
 (0)