Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add src/setupTests.js to specify environment setup for Jest (#545) #548

Merged
merged 1 commit into from
Sep 2, 2016
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
3 changes: 3 additions & 0 deletions config/paths.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ module.exports = {
appHtml: resolveApp('index.html'),
appPackageJson: resolveApp('package.json'),
appSrc: resolveApp('src'),
testsSetup: resolveApp('src/setupTests.js'),
appNodeModules: resolveApp('node_modules'),
ownNodeModules: resolveApp('node_modules'),
nodePaths: nodePaths
Expand All @@ -53,6 +54,7 @@ module.exports = {
appHtml: resolveApp('index.html'),
appPackageJson: resolveApp('package.json'),
appSrc: resolveApp('src'),
testsSetup: resolveApp('src/setupTests.js'),
appNodeModules: resolveApp('node_modules'),
// this is empty with npm3 but node resolution searches higher anyway:
ownNodeModules: resolveOwn('../node_modules'),
Expand All @@ -66,6 +68,7 @@ module.exports = {
appHtml: resolveOwn('../template/index.html'),
appPackageJson: resolveOwn('../package.json'),
appSrc: resolveOwn('../template/src'),
testsSetup: resolveOwn('../template/src/setupTests.js'),
appNodeModules: resolveOwn('../node_modules'),
ownNodeModules: resolveOwn('../node_modules'),
nodePaths: nodePaths
Expand Down
10 changes: 9 additions & 1 deletion scripts/utils/createJestConfig.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,14 +9,22 @@
*/
// @remove-on-eject-end

const pathExists = require('path-exists');
const paths = require('../../config/paths');

module.exports = (resolve, rootDir) => {
const setupFiles = [resolve('config/polyfills.js')];
if (pathExists.sync(paths.testsSetup)) {
setupFiles.push(paths.testsSetup);
}

const config = {
moduleNameMapper: {
'^[./a-zA-Z0-9$_-]+\\.(jpg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm)$': resolve('config/jest/FileStub.js'),
'^[./a-zA-Z0-9$_-]+\\.css$': resolve('config/jest/CSSStub.js')
},
scriptPreprocessor: resolve('config/jest/transform.js'),
setupFiles: [resolve('config/polyfills.js')],
setupFiles: setupFiles,
Copy link
Contributor

Choose a reason for hiding this comment

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

nit: you don't need the : setupFiles piece here because of object short notation.

Copy link
Contributor

Choose a reason for hiding this comment

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

I’m not sure Node 4 supports it, does it?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

True, wasn't sure of what es6 features I could use there since there are some "var" elsewhere in the code :s

Copy link
Contributor

Choose a reason for hiding this comment

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

yes, it does! Node 4 supports let/var as well as object short notation and arrow functions.

testPathIgnorePatterns: ['<rootDir>/(build|docs|node_modules)/'],
testEnvironment: 'node'
};
Expand Down
19 changes: 19 additions & 0 deletions template/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ You can find the most recent version of this guide [here](https://github.com/fac
- [Writing Tests](#writing-tests)
- [Testing Components](#testing-components)
- [Using Third Party Assertion Libraries](#using-third-party-assertion-libraries)
- [Initializing Test Environment](#initializing-test-environment)
- [Focusing and Excluding Tests](#focusing-and-excluding-tests)
- [Coverage Reporting](#coverage-reporting)
- [Continuous Integration](#continuous-integration)
Expand Down Expand Up @@ -674,6 +675,24 @@ import { expect } from 'chai';

and then use them in your tests like you normally do.

### Initializing Test Environment

Copy link
Contributor

Choose a reason for hiding this comment

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

Please add “>Note: this feature is available since [email protected]” here. You can copy and paste an existing similar notes and change the version.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Done

>Note: this feature is available with `[email protected]` and higher.

If your app uses a browser API that you need to mock in your tests or if you just need a global setup before running your tests, add a `src/setupTests.js` to your project. It will be automatically executed before running your tests.

For example:

#### `src/setupTests.js`
```js
const localStorageMock = {
getItem: jest.fn(),
setItem: jest.fn(),
clear: jest.fn()
};
global.localStorage = localStorageMock
```

### Focusing and Excluding Tests

You can replace `it()` with `xit()` to temporarily exclude a test from being executed.
Expand Down