README.md
1# jest-expo
2
3A [Jest](https://facebook.github.io/jest/) preset to painlessly test your Expo / React Native apps.
4
5### Installation
6
7- To install the compatible version of `jest-expo` and `jest` for your project, run: `npx expo install jest-expo jest`.
8- Add the following config to `package.json`:
9
10 ```json
11 "scripts": {
12 ...
13 "test": "jest"
14 },
15 "jest": {
16 "preset": "jest-expo"
17 }
18 ```
19
20- Create a `__tests__` directory anywhere you like and a `Example-test.js` file inside of it, and add this code:
21
22 ```js
23 it('works', () => {
24 expect(1).toBe(1);
25 });
26 ```
27
28- Run `npm test` and it should pass
29
30> You can use a different version of `jest` than the one that is installed with `expo install`, but keep in mind that the SDK and `jest-expo` are built against that version.
31
32## Platforms
33
34You can use `jest-expo` to test any Expo supported platform. For legacy purposes `jest-expo` runs your tests in the standard React Native environment (iOS).
35The recommended way to test your project is with `jest-expo/universal` which runs your tests with every Expo supported platform. Currently this includes iOS, Android, web, and Node (which is used for testing SSR compliance).
36
37Pressing **X** will open a platform-selection dialog that you can use to test individual platforms. You can also create a custom Jest config and combine the individual platforms with `jest-expo/ios`, `jest-expo/android`, `jest-expo/web`, and `jest-expo/node`.
38
39### Snapshots
40
41Because a test is run with multiple different platforms, `jest-expo` saves snapshots using the name of the platform as the extension. This is very useful for testing something like view styles, which are computed differently across web and native.
42
43Here is an example output:
44
45|- `View-test.tsx`
46|-- `__snapshots__/View-test.tsx.snap.android`
47|-- `__snapshots__/View-test.tsx.snap.ios`
48|-- `__snapshots__/View-test.tsx.snap.node`
49|-- `__snapshots__/View-test.tsx.snap.web`
50
51### Extensions
52
53To test specific platforms you can use the following extensions:
54
55- iOS: `-test.ios.*`, `-test.native.*`
56- Android: `-test.android.*`, `-test.native.*`
57- web: `-test.web.*`
58- Node: `-test.node.*`, `-test.web.*`
59
60### Mixing runners
61
62If you don't want to use every runner you can always mix runners by using the `projects` field of your Jest config. This will only work with single-runner projects like `jest-expo/ios`, `jest-expo/android`, `jest-expo/web`, and `jest-expo/node`.
63
64```diff
65"jest": {
66- "preset": "jest-expo/universal"
67// Skip web and Node tests
68+ "projects": [
69+ { "preset": "jest-expo/ios" },
70+ { "preset": "jest-expo/android"}
71+ ]
72},
73```
74
75### Testing JSX Components
76
77To test the output of your React components you can use the library **jest-expo-enzyme**, which extends `jest-expo` and adds universal [Enzyme](https://airbnb.io/enzyme/) support.
78
79### ⚙️ Configuring your preset
80
81When building a custom preset you may want to use some of features provided by this preset. You can access these features through the `jest-expo/config` directory.
82
83#### `getWatchPlugins(jestConfig)`
84
85When given an existing Jest config this will return the `watchPlugins` used in `jest-expo`. This reads the `projects` field to determine which watchPlugins to return for single-project and multi-project configs.
86
87Currently this returns type-ahead plugins for all projects:
88
89- `jest-watch-typeahead/filename`
90- `jest-watch-typeahead/testname`
91
92And a custom platform selection dialog for universal multi-projects:
93
94- `jest-watch-select-projects`
95
96#### `withWatchPlugins(jestConfig)`
97
98Given a Jest config, this will ensure any existing `watchPlugins` are safely merged with `getWatchPlugins(jestConfig)`.
99
100#### `getWebPreset()`
101
102Alternative to `jest-expo/web`. This runs in a JSDOM environment for testing **Expo web**.
103
104#### `getIOSPreset()`
105
106Alternative to `jest-expo/ios`. Runs in a mock native environment.
107
108#### `getAndroidPreset()`
109
110Alternative to `jest-expo/android`. Also runs in a mock native environment.
111
112#### `getNodePreset()`
113
114Alternative to `jest-expo/node`. This runs in a Node environment for testing **SSR**.
115
116### Learning Jest
117
118[Read the Jest documentation](https://facebook.github.io/jest/)
119