Skip to content
This repository has been archived by the owner on May 2, 2023. It is now read-only.

Await an act in generateSnapshots to resolve warnings #17

Merged
merged 4 commits into from
Aug 13, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/story-utils/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@chanzuckerberg/story-utils",
"version": "2.0.0",
"version": "2.0.1",
"license": "MIT",
"keywords": [
"stories",
Expand Down
7 changes: 7 additions & 0 deletions packages/story-utils/src/generateSnapshots.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { render, RenderResult } from '@testing-library/react';
import { getStoriesFromStoryFileExports } from './getStories';
import type { StoryData, StoryFileExports } from './getStories';
import prepareStory from './prepareStory';
import wait from './wait';

type TestOptions<Args> = {
/**
Expand Down Expand Up @@ -40,6 +41,12 @@ export default function generateSnapshots<

test(`${storyName} story renders snapshot`, async () => {
const view = render(prepareStory(story.storyFn, argOverrides));

// When components that include Apollo's useQuery are rendered we need
// to await an act that pushes the test to the end of the event loop.
// https://trojanowski.dev/apollo-hooks-testing-without-act-warnings/
await wait();

expect(await getSnapshot(view)).toMatchSnapshot();
});
}
Expand Down
1 change: 1 addition & 0 deletions packages/story-utils/src/index.ts
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
export { default as generateSnapshots } from './generateSnapshots';
export { default as getStories } from './getStories';
export { default as prepareStory } from './prepareStory';
export { default as wait } from './wait';
9 changes: 9 additions & 0 deletions packages/story-utils/src/wait.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import { act } from '@testing-library/react';

export default async function wait(ms = 0): Promise<void> {
Copy link
Contributor Author

@shlomnissan shlomnissan Aug 13, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is implemented in Along src/test/helpers.js. Once this patch is merged, we can import it from here instead.

await act(() => {
return new Promise((resolve) => {
setTimeout(resolve, ms);
});
});
}