Skip to content

Instantly share code, notes, and snippets.

@zth
Created August 22, 2018 18:50
Show Gist options
  • Save zth/01e2cf8bdc858119f8d32612861bb377 to your computer and use it in GitHub Desktop.
Save zth/01e2cf8bdc858119f8d32612861bb377 to your computer and use it in GitHub Desktop.
Tests for sample App component.
// @flow
import * as React from 'react';
import { queryMock } from '../../__testUtils__/queryMock'; // Or wherever your queryMock is located
import { App } from '../App';
import { render, wait } from 'react-testing-library';
describe('App', () => {
it('should render the current user count', async () => {
/**
* App fetches the query AppQuery. Here, we mock all requests for that query.
*/
queryMock.mockQuery({
name: 'AppQuery',
data: {
viewer: {
id: '1',
currentUserCount: 12
}
}
});
/**
* We mount the app and wait for our element that displays the app's content
* to be visible.
*/
const r = render(<App />);
// If App works, we'll see "User count: 12" when it has made its request and rendered.
await wait(() => r.getByText('User count: 12'));
// There! That's all that's needed. If "User count: 12" does not appear within the timeout, something's up and the test will fail.
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment