0
# Configuration
1

2
Jest Expo provides advanced configuration utilities for customizing Jest presets, platform-specific settings, and watch plugins. These utilities enable fine-tuned control over test execution and development workflows.
3

4
## Capabilities
5

6
### Platform Preset Configuration
7

8
Functions for generating and customizing platform-specific Jest configurations with advanced options and display settings.
9

10
#### Get Web Preset
11

12
```javascript { .api }
13
/**
14
 * Generate web-specific Jest configuration
15
 * @param options - Web preset options
16
 * @returns Complete Jest configuration for web testing
17
 */
18
function getWebPreset(options?: WebPresetOptions): JestConfig;
19

20
interface WebPresetOptions extends PresetOptions {
21
  testEnvironment?: "jsdom";
22
  setupFilesAfterEnv?: string[];
23
}
24
```
25

26
**Features:**
27
- Uses jsdom test environment for DOM testing
28
- Web-specific snapshot resolver (`.web.snap` files)
29
- Browser-compatible module mocks and polyfills
30
- ShadowRoot global workaround for web components
31

32
**Usage Example:**
33

34
```javascript
35
const { getWebPreset } = require("jest-expo/config");
36

37
module.exports = getWebPreset({
38
  displayName: {
39
    name: "Web Tests",
40
    color: "cyan"
41
  },
42
  setupFilesAfterEnv: ["<rootDir>/test-setup-web.js"]
43
});
44
```
45

46
#### Get iOS Preset
47

48
```javascript { .api }
49
/**
50
 * Generate iOS-specific Jest configuration  
51
 * @param options - iOS preset options
52
 * @returns Complete Jest configuration for iOS testing
53
 */
54
function getIOSPreset(options?: IOSPresetOptions): JestConfig;
55

56
interface IOSPresetOptions extends PresetOptions {
57
  testEnvironment?: "react-native";
58
  setupFilesAfterEnv?: string[];
59
}
60
```
61

62
**Features:**
63
- React Native test environment for iOS
64
- iOS-specific snapshot resolver (`.ios.snap` files)
65
- iOS platform module mocks and native module stubs
66
- Metro bundler configuration for iOS
67

68
**Usage Example:**
69

70
```javascript
71
const { getIOSPreset } = require("jest-expo/config");
72

73
module.exports = getIOSPreset({
74
  displayName: {
75
    name: "iOS Tests", 
76
    color: "blue"
77
  },
78
  testMatch: ["**/__tests__/**/*.ios.test.js"]
79
});
80
```
81

82
#### Get Android Preset
83

84
```javascript { .api }
85
/**
86
 * Generate Android-specific Jest configuration
87
 * @param options - Android preset options  
88
 * @returns Complete Jest configuration for Android testing
89
 */
90
function getAndroidPreset(options?: AndroidPresetOptions): JestConfig;
91

92
interface AndroidPresetOptions extends PresetOptions {
93
  testEnvironment?: "react-native";
94
  setupFilesAfterEnv?: string[];
95
}
96
```
97

98
**Features:**
99
- React Native test environment for Android
100
- Android-specific snapshot resolver (`.android.snap` files)
101
- Android platform module mocks and native module stubs
102
- Metro bundler configuration for Android
103

104
**Usage Example:**
105

106
```javascript
107
const { getAndroidPreset } = require("jest-expo/config");
108

109
module.exports = getAndroidPreset({
110
  displayName: {
111
    name: "Android Tests",
112
    color: "green"  
113
  },
114
  testTimeout: 10000
115
});
116
```
117

118
#### Get Node Preset
119

120
```javascript { .api }
121
/**
122
 * Generate Node.js-specific Jest configuration for SSR testing
123
 * @param options - Node preset options
124
 * @returns Complete Jest configuration for Node.js testing
125
 */
126
function getNodePreset(options?: NodePresetOptions): JestConfig;
127

128
interface NodePresetOptions extends PresetOptions {
129
  testEnvironment?: "node";
130
  setupFilesAfterEnv?: string[];
131
}
132
```
133

134
**Features:**
135
- Node.js test environment for server-side rendering
136
- Node.js-specific snapshot resolver (`.node.snap` files)
137
- Server-side module mocks and Node.js globals
138
- SSR-compatible configurations
139

140
**Usage Example:**
141

142
```javascript
143
const { getNodePreset } = require("jest-expo/config");
144

145
module.exports = getNodePreset({
146
  displayName: {
147
    name: "SSR Tests",
148
    color: "yellow"
149
  },
150
  testMatch: ["**/__tests__/**/*.ssr.test.js"]
151
});
152
```
153

154
### Generic Platform Preset
155

156
Core function for generating any platform-specific Jest configuration with full customization options.
157

158
```javascript { .api }
159
/**
160
 * Generate platform-specific Jest configuration with full customization
161
 * @param displayOptions - Display options for Jest runner
162
 * @param extensions - File extensions to handle
163
 * @param platform - Target platform name
164
 * @param options - Additional preset options including isServer and isReactServer flags
165
 * @returns Complete Jest configuration object
166
 */
167
function getPlatformPreset(
168
  displayOptions?: DisplayOptions,
169
  extensions?: string[],
170
  platform?: string,
171
  options?: { isServer?: boolean; isReactServer?: boolean } & PlatformPresetOptions
172
): JestConfig;
173

174
interface DisplayOptions {
175
  name?: string;
176
  color?: "black" | "red" | "green" | "yellow" | "blue" | "magenta" | "cyan" | "white";
177
}
178

179
interface PlatformPresetOptions {
180
  testEnvironment?: string;
181
  setupFiles?: string[];
182
  setupFilesAfterEnv?: string[];
183
  snapshotResolver?: string;
184
  testMatch?: string[];
185
  collectCoverageFrom?: string[];
186
}
187
```
188

189
**Usage Example:**
190

191
```javascript
192
const { getPlatformPreset } = require("jest-expo/config");
193

194
module.exports = getPlatformPreset(
195
  { name: "Custom Platform", color: "magenta" },
196
  [".js", ".jsx", ".ts", ".tsx", ".json"],
197
  "custom-platform",
198
  {
199
    testEnvironment: "jsdom",
200
    setupFilesAfterEnv: ["<rootDir>/custom-setup.js"],
201
    testMatch: ["**/__tests__/**/*.custom.test.js"]
202
  }
203
);
204
```
205

206
### Watch Plugins Configuration
207

208
Utilities for configuring Jest watch plugins to enhance the development experience with interactive test running.
209

210
#### With Watch Plugins
211

212
```javascript { .api }
213
/**
214
 * Merge custom and default watch plugins with Jest configuration
215
 * @param jestConfig - Base Jest configuration object
216
 * @returns Jest configuration with watch plugins configured
217
 */
218
function withWatchPlugins(jestConfig: JestConfig): JestConfig;
219
```
220

221
**Features:**
222
- Adds `jest-watch-select-projects` for project selection
223
- Adds `jest-watch-typeahead` for test name and filename filtering
224
- Preserves existing watch plugins from configuration
225
- Enables interactive test filtering during development
226

227
**Usage Example:**
228

229
```javascript
230
const { withWatchPlugins } = require("jest-expo/config");
231

232
const baseConfig = {
233
  preset: "jest-expo",
234
  projects: [
235
    { displayName: "iOS", preset: "jest-expo/ios" },
236
    { displayName: "Android", preset: "jest-expo/android" }
237
  ]
238
};
239

240
module.exports = withWatchPlugins(baseConfig);
241
```
242

243
#### Get Watch Plugins
244

245
```javascript { .api }
246
/**
247
 * Generate watch plugin configuration for Jest
248
 * @param jestConfig - Jest configuration object
249
 * @returns Array of watch plugin configurations
250
 */
251
function getWatchPlugins(jestConfig: JestConfig): WatchPlugin[];
252

253
interface WatchPlugin {
254
  name: string;
255
  config?: Record<string, any>;
256
}
257
```
258

259
**Features:**
260
- Returns standardized watch plugin configurations
261
- Includes project selection and typeahead filtering
262
- Compatible with multi-project Jest setups
263
- Configurable plugin options
264

265
**Usage Example:**
266

267
```javascript
268
const { getWatchPlugins } = require("jest-expo/config");
269

270
const jestConfig = {
271
  projects: ["ios", "android", "web"]
272
};
273

274
const watchPlugins = getWatchPlugins(jestConfig);
275

276
module.exports = {
277
  ...jestConfig,
278
  watchPlugins
279
};
280
```
281

282
### Multi-Project Configuration
283

284
Advanced patterns for configuring multi-platform Jest projects with shared and platform-specific settings.
285

286
#### Universal Multi-Project Setup
287

288
```javascript { .api }
289
/**
290
 * Create universal multi-project Jest configuration
291
 * @param projectConfigs - Array of project-specific configurations
292
 * @param globalConfig - Shared configuration for all projects
293
 * @returns Complete multi-project Jest configuration
294
 */
295
function createUniversalConfig(
296
  projectConfigs: ProjectConfig[],
297
  globalConfig?: GlobalConfig
298
): JestConfig;
299

300
interface ProjectConfig {
301
  displayName: string | DisplayOptions;
302
  preset?: string;
303
  testMatch?: string[];
304
  setupFilesAfterEnv?: string[];
305
}
306

307
interface GlobalConfig {
308
  collectCoverage?: boolean;
309
  coverageDirectory?: string;
310
  watchPlugins?: WatchPlugin[];
311
}
312
```
313

314
**Usage Example:**
315

316
```javascript
317
const { 
318
  getIOSPreset, 
319
  getAndroidPreset, 
320
  getWebPreset, 
321
  withWatchPlugins 
322
} = require("jest-expo/config");
323

324
module.exports = withWatchPlugins({
325
  projects: [
326
    getIOSPreset({ 
327
      displayName: { name: "iOS", color: "blue" },
328
      testMatch: ["**/__tests__/**/*.ios.test.js"]
329
    }),
330
    getAndroidPreset({ 
331
      displayName: { name: "Android", color: "green" },
332
      testMatch: ["**/__tests__/**/*.android.test.js"] 
333
    }),
334
    getWebPreset({ 
335
      displayName: { name: "Web", color: "cyan" },
336
      testMatch: ["**/__tests__/**/*.web.test.js"]
337
    })
338
  ],
339
  collectCoverage: true,
340
  coverageDirectory: "coverage"
341
});
342
```
343

344
### Custom Configuration Patterns
345

346
#### Environment-Specific Configuration
347

348
```javascript
349
const { getWebPreset, getNodePreset } = require("jest-expo/config");
350

351
const isDevelopment = process.env.NODE_ENV === "development";
352

353
module.exports = isDevelopment 
354
  ? getWebPreset({ 
355
      verbose: true,
356
      watch: true 
357
    })
358
  : getNodePreset({ 
359
      collectCoverage: true,
360
      coverageThreshold: {
361
        global: {
362
          branches: 80,
363
          functions: 80,
364
          lines: 80,
365
          statements: 80
366
        }
367
      }
368
    });
369
```
370

371
#### Conditional Platform Testing
372

373
```javascript
374
const { 
375
  getIOSPreset, 
376
  getAndroidPreset, 
377
  getWebPreset 
378
} = require("jest-expo/config");
379

380
const platforms = process.env.TEST_PLATFORMS?.split(",") || ["ios", "android", "web"];
381

382
const projectMap = {
383
  ios: () => getIOSPreset({ displayName: "iOS" }),
384
  android: () => getAndroidPreset({ displayName: "Android" }),
385
  web: () => getWebPreset({ displayName: "Web" })
386
};
387

388
module.exports = {
389
  projects: platforms.map(platform => projectMap[platform]())
390
};
391
```
392

393
## Types
394

395
```typescript { .api }
396
// Configuration function types
397
declare function getWebPreset(options?: WebPresetOptions): JestConfig;
398
declare function getIOSPreset(options?: IOSPresetOptions): JestConfig;  
399
declare function getAndroidPreset(options?: AndroidPresetOptions): JestConfig;
400
declare function getNodePreset(options?: NodePresetOptions): JestConfig;
401

402
declare function getPlatformPreset(
403
  displayOptions?: DisplayOptions,
404
  extensions?: string[],
405
  platform?: string, 
406
  options?: PlatformPresetOptions
407
): JestConfig;
408

409
declare function withWatchPlugins(jestConfig: JestConfig): JestConfig;
410
declare function getWatchPlugins(jestConfig: JestConfig): WatchPlugin[];
411

412
// Configuration interfaces
413
interface DisplayOptions {
414
  name?: string;
415
  color?: "black" | "red" | "green" | "yellow" | "blue" | "magenta" | "cyan" | "white";
416
}
417

418
interface PresetOptions {
419
  displayName?: string | DisplayOptions;
420
  testEnvironment?: string;
421
  setupFiles?: string[];
422
  setupFilesAfterEnv?: string[];
423
  testMatch?: string[];
424
  collectCoverageFrom?: string[];
425
  coverageThreshold?: CoverageThreshold;
426
}
427

428
interface WebPresetOptions extends PresetOptions {
429
  testEnvironment?: "jsdom";
430
}
431

432
interface IOSPresetOptions extends PresetOptions {
433
  testEnvironment?: "react-native";
434
}
435

436
interface AndroidPresetOptions extends PresetOptions {
437
  testEnvironment?: "react-native";
438
}
439

440
interface NodePresetOptions extends PresetOptions {
441
  testEnvironment?: "node";
442
}
443

444
interface PlatformPresetOptions extends PresetOptions {
445
  snapshotResolver?: string;
446
  isServer?: boolean;
447
  isReactServer?: boolean;
448
}
449

450
interface WatchPlugin {
451
  name: string;
452
  config?: Record<string, any>;
453
}
454

455
interface JestConfig {
456
  preset?: string;
457
  projects?: (string | JestConfig)[];
458
  displayName?: string | DisplayOptions;
459
  testEnvironment?: string;
460
  setupFiles?: string[];
461
  setupFilesAfterEnv?: string[];
462
  testMatch?: string[];
463
  transform?: Record<string, string | [string, any]>;
464
  moduleNameMapper?: Record<string, string>;
465
  snapshotResolver?: string;
466
  watchPlugins?: WatchPlugin[];
467
  collectCoverage?: boolean;
468
  collectCoverageFrom?: string[];
469
  coverageDirectory?: string;
470
  coverageThreshold?: CoverageThreshold;
471
}
472

473
interface CoverageThreshold {
474
  global?: {
475
    branches?: number;
476
    functions?: number;
477
    lines?: number;
478
    statements?: number;
479
  };
480
}
481
```