Jest is a very popular unit testing tool for React, but it doesn’t work
with React Native out of the box. And even instruction in React Native docs
is wrong. If you use it you’ll end up without ability to disable mocks, without
working es6 imports and with ton of ReferenceError
.
So, I accumulated information from Jest issues and got working config.
First of all we need to install jest-cli
and babel-jest
:
npm install --save-dev jest-cli babel-jest babel-polyfill babel-preset-react-native
Then fill .babelrc
with:
{
"presets": ["react-native"],
"retainLines": true
}
Without retainLines
you’ll get wrong line numbers in tests traces.
And update package.json
:
{
...
"scripts": {
...
"test": "jest"
},
"jest": {
"haste": {
"defaultPlatform": "android",
"platforms": [
"ios",
"android"
],
"providesModuleNodeModules": [
"react-native"
]
},
"unmockedModulePathPatterns": [
"promise",
"source-map"
]
}
}
That’s all, now you can run tests with:
npm test
Also a lot of outdated docs uses jest.autoMockOff
, it’s deprecated and doesn’t
work with es6 imports. You should use jest.disableAutomock()
.
If you want to use use enzyme for testing React Native components, you should install:
npm install --save-dev enzyme react-addons-test-utils react-dom react-native-mock
Then add react
and enzyme
to unmockedModulePathPatterns
. And create __mocks__/react-native.js
with:
import ReactNative from 'react-native-mock';
__DEV__ = true;
module.exports = ReactNative;
Now you can mock React Native and use enzyme.