sebmarkbage / jest

🃏 Painless JavaScript Testing.

Jest

Painless JavaScript Testing

• Adaptable: Jest uses Jasmine assertions by default and Jest is modular, extendible and configurable.

• Sandboxed and Fast: Jest virtualizes JavaScript environments, provides browser mocks and runs tests in parallel across workers.

• Snapshot Testing: Jest can capture snapshots of React trees or other serializable values to write tests quickly and it provides a seamless update experience.

Getting Started

<generated_getting_started_start /> Install Jest with npm by running npm install --save-dev jest. Let's get started by writing a test for a hypothetical sum.js file:

module.exports = (a, b) => a + b;

Create a directory __tests__/ with a file sum-test.js or name it sum.test.js or sum.spec.js and put it anywhere in your project:

test('adds 1 + 2 to equal 3', () => {
  const sum = require('../sum');
  expect(sum(1, 2)).toBe(3);
});

Add the following to your package.json:

"scripts": {
  "test": "jest"
}

Run npm test and Jest will print this message: PASS __tests__/sum-test.js. You just successfully wrote your first test using Jest!

You are ready to use Jest! Here are some more resources to help you get started:

• Read the API Documentation to learn about all available assertions, ways of writing tests and Jest specific APIs.
• Jest Configuration.
• Example Code.
• Migration from other test runners.
• Introductory guide at Plotly Academy that walks you through testing a React and Redux application.
• The React, Relay and react-native repositories have excellent examples of tests written by Facebook engineers.

Babel Integration

If you'd like to use Babel, it can easily be enabled: npm install --save-dev babel-jest babel-polyfill.

Don't forget to add a .babelrc file in your project's root folder. For example, if you are using ES2015 and React.js with the babel-preset-es2015 and babel-preset-react presets:

{
  "presets": ["es2015", "react"]
}

You are now set up to use all ES2015 features and React specific syntax.

Note: If you are using a more complicated Babel configuration, using Babel's env option, keep in mind that Jest will automatically define NODE_ENV as test. It will not use development section like Babel does by default when no NODE_ENV is set.

React, React Native and Snapshot Testing

Check out the React tutorial and the React Native tutorial to get started with React or React Native codebases. You can use React's test renderer (npm install --save-dev react-test-renderer) to capture snapshots with Jest's snapshot feature and the toMatchSnapshot matcher:

import renderer from 'react-test-renderer';
test('Link renders correctly', () => {
  const tree = renderer.create(
    <Link page="http://www.facebook.com">Facebook</Link>
  ).toJSON();
  expect(tree).toMatchSnapshot();
});

and it will produce a snapshot like this:

exports[`Link renders correctly 1`] = `
<a
  className="normal"
  href="http://www.facebook.com"
  onMouseEnter={[Function]}
  onMouseLeave={[Function]}>
  Facebook
</a>
`;

On subsequent test runs, Jest will compare the stored snapshot with the rendered output and highlight differences. If there are differences, Jest will ask you to fix your mistake and can be re-run with -u or --updateSnapshot to update an outdated snapshot. <generated_getting_started_end />

API & Configuration

• API Reference
• Configuration