Skip to content

Commit ee4d3d8

Browse files
committed
remove update alias to rerender
1 parent 16e350f commit ee4d3d8

File tree

9 files changed

+60
-16
lines changed

9 files changed

+60
-16
lines changed

src/matchers/__tests__/to-be-on-the-screen.test.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ test('toBeOnTheScreen() example test', async () => {
1313
const child = screen.getByTestId('child');
1414
expect(child).toBeOnTheScreen();
1515

16-
await screen.update(<View />);
16+
await screen.rerender(<View />);
1717
expect(child).not.toBeOnTheScreen();
1818
});
1919

@@ -47,7 +47,7 @@ test('toBeOnTheScreen() on detached element', async () => {
4747

4848
const element = screen.getByTestId('text');
4949
// Next line will unmount the element, yet `element` variable will still hold reference to it.
50-
await screen.update(<ShowChildren show={false} />);
50+
await screen.rerender(<ShowChildren show={false} />);
5151

5252
expect(element).toBeTruthy();
5353
expect(element).not.toBeOnTheScreen();

src/matchers/__tests__/to-be-visible.test.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -169,7 +169,7 @@ test('toBeVisible() on inaccessible view', async () => {
169169
const test = screen.getByTestId('test', { includeHiddenElements: true });
170170
expect(test).not.toBeVisible();
171171

172-
await screen.update(<View testID="test" />);
172+
await screen.rerender(<View testID="test" />);
173173
expect(test).toBeVisible();
174174
});
175175

@@ -190,7 +190,7 @@ test('toBeVisible() on inaccessible view (iOS)', async () => {
190190
const test = screen.getByTestId('test', { includeHiddenElements: true });
191191
expect(test).not.toBeVisible();
192192

193-
await screen.update(<View testID="test" accessibilityElementsHidden={false} />);
193+
await screen.rerender(<View testID="test" accessibilityElementsHidden={false} />);
194194
expect(test).toBeVisible();
195195
});
196196

@@ -211,7 +211,7 @@ test('toBeVisible() on inaccessible view (Android)', async () => {
211211
const test = screen.getByTestId('test', { includeHiddenElements: true });
212212
expect(test).not.toBeVisible();
213213

214-
await screen.update(<View testID="test" importantForAccessibility="auto" />);
214+
await screen.rerender(<View testID="test" importantForAccessibility="auto" />);
215215
expect(test).toBeVisible();
216216
});
217217

src/render.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,6 @@ export async function render<T>(element: React.ReactElement<T>, options: RenderO
8181
const result = {
8282
...getQueriesForElement(renderer.container),
8383
rerender,
84-
update: rerender, // alias for `rerender`
8584
unmount,
8685
toJSON,
8786
debug: makeDebug(renderer),

src/screen.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,6 @@ const defaultScreen: Screen = {
2222
},
2323
debug: notImplemented,
2424
rerender: notImplemented,
25-
update: notImplemented,
2625
unmount: notImplemented,
2726
toJSON: notImplemented,
2827
getByLabelText: notImplemented,

website/docs/14.x/docs/advanced/understanding-act.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -86,10 +86,10 @@ So far we learned that `act` function allows tests to wait for all pending React
8686
Therefore, we should use `act` whenever there is some action that causes element tree to render, particularly:
8787

8888
- initial render call - `ReactTestRenderer.create` call
89-
- re-rendering of component -`renderer.update` call
89+
- re-rendering of component -`renderer.rerender` call
9090
- triggering any event handlers that cause component tree render
9191

92-
Thankfully, for these basic cases RNTL has got you covered as our `render`, `update` and `fireEvent` methods already wrap their calls in `act` so that you do not have to do it explicitly.
92+
Thankfully, for these basic cases RNTL has got you covered as our `render`, `rerender` and `fireEvent` methods already wrap their calls in `act` so that you do not have to do it explicitly.
9393

9494
Note that `act` calls can be safely nested and internally form a stack of calls. However, overlapping `act` calls, which can be achieved using async version of `act`, [are not supported](https://github.com/facebook/react/blob/main/packages/react/src/ReactAct.js#L161).
9595

website/docs/14.x/docs/api/misc/other.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ function getQueriesForElement(element: HostElement): Queries {}
1111
`within` (also available as `getQueriesForElement` alias) performs [queries](docs/api/queries) scoped to given element.
1212

1313
:::note
14-
Please note that additional `render` specific operations like `update`, `unmount`, `debug`, `toJSON` are _not_ included.
14+
Please note that additional `render` specific operations like `rerender`, `unmount`, `debug`, `toJSON` are _not_ included.
1515
:::
1616

1717
```jsx
@@ -33,7 +33,7 @@ Use cases for scoped queries include:
3333
function act<T>(callback: () => T | Promise<T>): Promise<T>;
3434
```
3535

36-
Useful function to help testing components that use hooks API. By default any `render`, `update`, `fireEvent`, and `waitFor` calls are wrapped by this function, so there is no need to wrap it manually.
36+
Useful function to help testing components that use hooks API. By default any `render`, `rerender`, `fireEvent`, and `waitFor` calls are wrapped by this function, so there is no need to wrap it manually.
3737

3838
**In v14, `act` is now async by default and always returns a Promise**, making it compatible with React 19, React Suspense, and `React.use()`. This ensures all pending React updates are executed before the Promise resolves.
3939

website/docs/14.x/docs/api/render.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,6 @@ See [this article](https://kentcdodds.com/blog/common-mistakes-with-react-testin
6363

6464
:::warning Async lifecycle methods
6565

66-
When using `render`, the lifecycle methods `rerender`, `update`, and `unmount` are async and must be awaited.
66+
When using `render`, the lifecycle methods `rerender` and `unmount` are async and must be awaited.
6767

6868
:::

website/docs/14.x/docs/api/screen.mdx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,8 +35,6 @@ test('example', async () => {
3535

3636
### `rerender`
3737

38-
_Also available under `update` alias_
39-
4038
```ts
4139
function rerender(element: React.Element<unknown>): Promise<void>;
4240
```

website/docs/14.x/docs/migration/v14.mdx

Lines changed: 50 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -163,7 +163,25 @@ screen.rerender(<MyComponent />);
163163
await screen.rerender(<MyComponent />);
164164
```
165165
166-
##### 4. Update `unmount` calls to await
166+
##### 4. Replace `update` alias with `rerender`
167+
168+
The `update` alias for `rerender` has been removed in v14. If you were using `screen.update()` or `renderer.update()`, replace it with `rerender()`:
169+
170+
```ts
171+
// Before (v13)
172+
screen.update(<MyComponent />);
173+
// or
174+
const { update } = render(<MyComponent />);
175+
update(<MyComponent />);
176+
177+
// After (v14)
178+
await screen.rerender(<MyComponent />);
179+
// or
180+
const { rerender } = await render(<MyComponent />);
181+
await rerender(<MyComponent />);
182+
```
183+
184+
##### 5. Update `unmount` calls to await
167185
168186
```ts
169187
// Before
@@ -216,6 +234,36 @@ it('should update component', async () => {
216234
217235
For more details, see the [`render` API documentation](/docs/api/render).
218236
237+
### `update` alias removed
238+
239+
In v14, the `update` alias for `rerender` has been removed. You must use `rerender` instead.
240+
241+
**What changed:**
242+
243+
- `screen.update()` has been removed
244+
- `renderer.update()` has been removed
245+
- Only `rerender` is now available
246+
247+
**Migration:**
248+
249+
Replace all `update` calls with `rerender`:
250+
251+
```ts
252+
// Before (v13)
253+
screen.update(<MyComponent />);
254+
// or
255+
const { update } = render(<MyComponent />);
256+
update(<MyComponent />);
257+
258+
// After (v14)
259+
await screen.rerender(<MyComponent />);
260+
// or
261+
const { rerender } = await render(<MyComponent />);
262+
await rerender(<MyComponent />);
263+
```
264+
265+
**Note:** This change is included in the step-by-step migration guide for async `render` above.
266+
219267
### `renderHook` is now async by default
220268
221269
In v14, `renderHook` is now async by default and returns a Promise. This change makes it compatible with React 19, React Suspense, and `React.use()`.
@@ -290,7 +338,7 @@ unmount();
290338
await unmount();
291339
```
292340
293-
##### 5. Update `act` calls to use async `act`
341+
##### 6. Update `act` calls to use async `act`
294342
295343
```ts
296344
// Before

0 commit comments

Comments
 (0)