Skip to content

Commit f96d782

Browse files
brmenchlEsemesek
authored andcommitted
Improvement: Add act to update call to support hooks (#137)
### Summary Currently `render` and `fireEvent` are wrapped in `act` to support hooks. This pull request wraps the update call in `act` to support testing component updates (e.g. prop changes). ### Test plan * I have added a test for update in `__tests__/act.test.js`. * A useEffect hook should run again on `update` calls (if the hook dependency array is satisfied).
1 parent ccad804 commit f96d782

File tree

3 files changed

+18
-2
lines changed

3 files changed

+18
-2
lines changed

docs/API.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -384,4 +384,4 @@ expect(submitButtons).toHaveLength(3); // expect 3 elements
384384

385385
## `act`
386386

387-
Useful function to help testing components that use hooks API. By default any `render` and `fireEvent` calls are wrapped by this function, so there is no need to wrap it manually. This method is re-exported from [`react-test-renderer`](https://github.com/facebook/react/blob/master/packages/react-test-renderer/src/ReactTestRenderer.js#L567]).
387+
Useful function to help testing components that use hooks API. By default any `render`, `update`, and `fireEvent` calls are wrapped by this function, so there is no need to wrap it manually. This method is re-exported from [`react-test-renderer`](https://github.com/facebook/react/blob/master/packages/react-test-renderer/src/ReactTestRenderer.js#L567]).

src/__tests__/act.test.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,14 @@ test('render should trigger useEffect', () => {
2828
expect(effectCallback).toHaveBeenCalledTimes(1);
2929
});
3030

31+
test('update should trigger useEffect', () => {
32+
const effectCallback = jest.fn();
33+
const { update } = render(<UseEffect callback={effectCallback} />);
34+
update(<UseEffect callback={effectCallback} />);
35+
36+
expect(effectCallback).toHaveBeenCalledTimes(2);
37+
});
38+
3139
test('fireEvent should trigger useState', () => {
3240
const { getByTestId } = render(<Counter />);
3341
const counter = getByTestId('counter');

src/render.js

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export default function render(
2626
return {
2727
...getByAPI(instance),
2828
...queryByAPI(instance),
29-
update: renderer.update,
29+
update: updateWithAct(renderer),
3030
unmount: renderer.unmount,
3131
toJSON: renderer.toJSON,
3232
debug: debug(instance, renderer),
@@ -46,6 +46,14 @@ function renderWithAct(
4646
return ((renderer: any): ReactTestRenderer);
4747
}
4848

49+
function updateWithAct(renderer: ReactTestRenderer) {
50+
return function(component: React.Element<any>) {
51+
act(() => {
52+
renderer.update(component);
53+
});
54+
};
55+
}
56+
4957
function debug(instance: ReactTestInstance, renderer) {
5058
function debugImpl(message?: string) {
5159
return debugDeep(renderer.toJSON(), message);

0 commit comments

Comments
 (0)