Skip to content

Commit 439db6c

Browse files
thymikeeEsemesek
authored andcommitted
feat: add rerender as an alias for update (#149)
<!-- Please provide enough information so that others can review your pull request. --> <!-- Keep pull requests small and focused on a single change. --> ### Summary Users of `react-testing-library` use `rerender` wording instead of `update`. Let's make it easier for them by aliasing it. See: https://testing-library.com/docs/react-testing-library/api#rerender ### Test plan Added cases for JS tests and TS typings
1 parent 488a2ca commit 439db6c

File tree

5 files changed

+9
-3
lines changed

5 files changed

+9
-3
lines changed

docs/API.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ title: API
55

66
This page gathers public API of `react-native-testing-library` along with usage examples.
77

8-
## `render`
8+
## `render`
99

1010
- [`Example code`](https://github.com/callstack/react-native-testing-library/blob/master/src/__tests__/render.test.js)
1111

@@ -98,6 +98,8 @@ A method returning an array of `ReactTestInstance`s with matching a React compon
9898
9999
### `update: (element: React.Element<any>) => void`
100100

101+
_Also available under `rerender` alias_
102+
101103
Re-render the in-memory tree with a new root element. This simulates a React update at the root. If the new element has the same type and key as the previous element, the tree will be updated; otherwise, it will re-mount a new tree. This is useful when testing for `componentDidUpdate` behavior, by passing updated props to the component.
102104

103105
[Example code](https://github.com/callstack/react-native-testing-library/blob/f96d782d26dd4815dbfd01de6ef7a647efd1f693/src/__tests__/act.test.js#L31-L37)

src/__tests__/render.test.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -237,14 +237,15 @@ test('getAllByProp, queryAllByProps', () => {
237237

238238
test('update', () => {
239239
const fn = jest.fn();
240-
const { getByName, update } = render(<Banana onUpdate={fn} />);
240+
const { getByName, update, rerender } = render(<Banana onUpdate={fn} />);
241241
const button = getByName('Button');
242242

243243
button.props.onPress();
244244

245245
update(<Banana onUpdate={fn} />);
246+
rerender(<Banana onUpdate={fn} />);
246247

247-
expect(fn).toHaveBeenCalledTimes(2);
248+
expect(fn).toHaveBeenCalledTimes(3);
248249
});
249250

250251
test('unmount', () => {

src/render.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ export default function render(
2727
...getByAPI(instance),
2828
...queryByAPI(instance),
2929
update: updateWithAct(renderer),
30+
rerender: updateWithAct(renderer), // alias for `update`
3031
unmount: renderer.unmount,
3132
toJSON: renderer.toJSON,
3233
debug: debug(instance, renderer),

typings/__tests__/index.test.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -99,6 +99,7 @@ const debugFn = tree.debug();
9999
const debugFnWithMessage = tree.debug('my message');
100100

101101
tree.update(<View />);
102+
tree.rerender(<View />);
102103
tree.unmount();
103104

104105
// fireEvent API tests

typings/index.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ export interface RenderOptions {
4343

4444
export interface RenderAPI extends GetByAPI, QueryByAPI {
4545
update(nextElement: React.ReactElement<any>): void;
46+
rerender(nextElement: React.ReactElement<any>): void;
4647
unmount(nextElement?: React.ReactElement<any>): void;
4748
toJSON(): ReactTestRendererJSON | null;
4849
debug(message?: string): void;

0 commit comments

Comments
 (0)