CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-jest-expo

A Jest preset to painlessly test your Expo / React Native apps.

—

Pending
Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

SecuritybySnyk

Pending

The risk profile of this skill

Overview
Eval results
Files

configuration.mddocs/

Configuration

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.

Capabilities

Platform Preset Configuration

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

Get Web Preset

/**
 * Generate web-specific Jest configuration
 * @param options - Web preset options
 * @returns Complete Jest configuration for web testing
 */
function getWebPreset(options?: WebPresetOptions): JestConfig;

interface WebPresetOptions extends PresetOptions {
  testEnvironment?: "jsdom";
  setupFilesAfterEnv?: string[];
}

Features:

  • Uses jsdom test environment for DOM testing
  • Web-specific snapshot resolver (.web.snap files)
  • Browser-compatible module mocks and polyfills
  • ShadowRoot global workaround for web components

Usage Example:

const { getWebPreset } = require("jest-expo/config");

module.exports = getWebPreset({
  displayName: {
    name: "Web Tests",
    color: "cyan"
  },
  setupFilesAfterEnv: ["<rootDir>/test-setup-web.js"]
});

Get iOS Preset

/**
 * Generate iOS-specific Jest configuration  
 * @param options - iOS preset options
 * @returns Complete Jest configuration for iOS testing
 */
function getIOSPreset(options?: IOSPresetOptions): JestConfig;

interface IOSPresetOptions extends PresetOptions {
  testEnvironment?: "react-native";
  setupFilesAfterEnv?: string[];
}

Features:

  • React Native test environment for iOS
  • iOS-specific snapshot resolver (.ios.snap files)
  • iOS platform module mocks and native module stubs
  • Metro bundler configuration for iOS

Usage Example:

const { getIOSPreset } = require("jest-expo/config");

module.exports = getIOSPreset({
  displayName: {
    name: "iOS Tests", 
    color: "blue"
  },
  testMatch: ["**/__tests__/**/*.ios.test.js"]
});

Get Android Preset

/**
 * Generate Android-specific Jest configuration
 * @param options - Android preset options  
 * @returns Complete Jest configuration for Android testing
 */
function getAndroidPreset(options?: AndroidPresetOptions): JestConfig;

interface AndroidPresetOptions extends PresetOptions {
  testEnvironment?: "react-native";
  setupFilesAfterEnv?: string[];
}

Features:

  • React Native test environment for Android
  • Android-specific snapshot resolver (.android.snap files)
  • Android platform module mocks and native module stubs
  • Metro bundler configuration for Android

Usage Example:

const { getAndroidPreset } = require("jest-expo/config");

module.exports = getAndroidPreset({
  displayName: {
    name: "Android Tests",
    color: "green"  
  },
  testTimeout: 10000
});

Get Node Preset

/**
 * Generate Node.js-specific Jest configuration for SSR testing
 * @param options - Node preset options
 * @returns Complete Jest configuration for Node.js testing
 */
function getNodePreset(options?: NodePresetOptions): JestConfig;

interface NodePresetOptions extends PresetOptions {
  testEnvironment?: "node";
  setupFilesAfterEnv?: string[];
}

Features:

  • Node.js test environment for server-side rendering
  • Node.js-specific snapshot resolver (.node.snap files)
  • Server-side module mocks and Node.js globals
  • SSR-compatible configurations

Usage Example:

const { getNodePreset } = require("jest-expo/config");

module.exports = getNodePreset({
  displayName: {
    name: "SSR Tests",
    color: "yellow"
  },
  testMatch: ["**/__tests__/**/*.ssr.test.js"]
});

Generic Platform Preset

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

/**
 * Generate platform-specific Jest configuration with full customization
 * @param displayOptions - Display options for Jest runner
 * @param extensions - File extensions to handle
 * @param platform - Target platform name
 * @param options - Additional preset options including isServer and isReactServer flags
 * @returns Complete Jest configuration object
 */
function getPlatformPreset(
  displayOptions?: DisplayOptions,
  extensions?: string[],
  platform?: string,
  options?: { isServer?: boolean; isReactServer?: boolean } & PlatformPresetOptions
): JestConfig;

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

interface PlatformPresetOptions {
  testEnvironment?: string;
  setupFiles?: string[];
  setupFilesAfterEnv?: string[];
  snapshotResolver?: string;
  testMatch?: string[];
  collectCoverageFrom?: string[];
}

Usage Example:

const { getPlatformPreset } = require("jest-expo/config");

module.exports = getPlatformPreset(
  { name: "Custom Platform", color: "magenta" },
  [".js", ".jsx", ".ts", ".tsx", ".json"],
  "custom-platform",
  {
    testEnvironment: "jsdom",
    setupFilesAfterEnv: ["<rootDir>/custom-setup.js"],
    testMatch: ["**/__tests__/**/*.custom.test.js"]
  }
);

Watch Plugins Configuration

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

With Watch Plugins

/**
 * Merge custom and default watch plugins with Jest configuration
 * @param jestConfig - Base Jest configuration object
 * @returns Jest configuration with watch plugins configured
 */
function withWatchPlugins(jestConfig: JestConfig): JestConfig;

Features:

  • Adds jest-watch-select-projects for project selection
  • Adds jest-watch-typeahead for test name and filename filtering
  • Preserves existing watch plugins from configuration
  • Enables interactive test filtering during development

Usage Example:

const { withWatchPlugins } = require("jest-expo/config");

const baseConfig = {
  preset: "jest-expo",
  projects: [
    { displayName: "iOS", preset: "jest-expo/ios" },
    { displayName: "Android", preset: "jest-expo/android" }
  ]
};

module.exports = withWatchPlugins(baseConfig);

Get Watch Plugins

/**
 * Generate watch plugin configuration for Jest
 * @param jestConfig - Jest configuration object
 * @returns Array of watch plugin configurations
 */
function getWatchPlugins(jestConfig: JestConfig): WatchPlugin[];

interface WatchPlugin {
  name: string;
  config?: Record<string, any>;
}

Features:

  • Returns standardized watch plugin configurations
  • Includes project selection and typeahead filtering
  • Compatible with multi-project Jest setups
  • Configurable plugin options

Usage Example:

const { getWatchPlugins } = require("jest-expo/config");

const jestConfig = {
  projects: ["ios", "android", "web"]
};

const watchPlugins = getWatchPlugins(jestConfig);

module.exports = {
  ...jestConfig,
  watchPlugins
};

Multi-Project Configuration

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

Universal Multi-Project Setup

/**
 * Create universal multi-project Jest configuration
 * @param projectConfigs - Array of project-specific configurations
 * @param globalConfig - Shared configuration for all projects
 * @returns Complete multi-project Jest configuration
 */
function createUniversalConfig(
  projectConfigs: ProjectConfig[],
  globalConfig?: GlobalConfig
): JestConfig;

interface ProjectConfig {
  displayName: string | DisplayOptions;
  preset?: string;
  testMatch?: string[];
  setupFilesAfterEnv?: string[];
}

interface GlobalConfig {
  collectCoverage?: boolean;
  coverageDirectory?: string;
  watchPlugins?: WatchPlugin[];
}

Usage Example:

const { 
  getIOSPreset, 
  getAndroidPreset, 
  getWebPreset, 
  withWatchPlugins 
} = require("jest-expo/config");

module.exports = withWatchPlugins({
  projects: [
    getIOSPreset({ 
      displayName: { name: "iOS", color: "blue" },
      testMatch: ["**/__tests__/**/*.ios.test.js"]
    }),
    getAndroidPreset({ 
      displayName: { name: "Android", color: "green" },
      testMatch: ["**/__tests__/**/*.android.test.js"] 
    }),
    getWebPreset({ 
      displayName: { name: "Web", color: "cyan" },
      testMatch: ["**/__tests__/**/*.web.test.js"]
    })
  ],
  collectCoverage: true,
  coverageDirectory: "coverage"
});

Custom Configuration Patterns

Environment-Specific Configuration

const { getWebPreset, getNodePreset } = require("jest-expo/config");

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

module.exports = isDevelopment 
  ? getWebPreset({ 
      verbose: true,
      watch: true 
    })
  : getNodePreset({ 
      collectCoverage: true,
      coverageThreshold: {
        global: {
          branches: 80,
          functions: 80,
          lines: 80,
          statements: 80
        }
      }
    });

Conditional Platform Testing

const { 
  getIOSPreset, 
  getAndroidPreset, 
  getWebPreset 
} = require("jest-expo/config");

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

const projectMap = {
  ios: () => getIOSPreset({ displayName: "iOS" }),
  android: () => getAndroidPreset({ displayName: "Android" }),
  web: () => getWebPreset({ displayName: "Web" })
};

module.exports = {
  projects: platforms.map(platform => projectMap[platform]())
};

Types

// Configuration function types
declare function getWebPreset(options?: WebPresetOptions): JestConfig;
declare function getIOSPreset(options?: IOSPresetOptions): JestConfig;  
declare function getAndroidPreset(options?: AndroidPresetOptions): JestConfig;
declare function getNodePreset(options?: NodePresetOptions): JestConfig;

declare function getPlatformPreset(
  displayOptions?: DisplayOptions,
  extensions?: string[],
  platform?: string, 
  options?: PlatformPresetOptions
): JestConfig;

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

// Configuration interfaces
interface DisplayOptions {
  name?: string;
  color?: "black" | "red" | "green" | "yellow" | "blue" | "magenta" | "cyan" | "white";
}

interface PresetOptions {
  displayName?: string | DisplayOptions;
  testEnvironment?: string;
  setupFiles?: string[];
  setupFilesAfterEnv?: string[];
  testMatch?: string[];
  collectCoverageFrom?: string[];
  coverageThreshold?: CoverageThreshold;
}

interface WebPresetOptions extends PresetOptions {
  testEnvironment?: "jsdom";
}

interface IOSPresetOptions extends PresetOptions {
  testEnvironment?: "react-native";
}

interface AndroidPresetOptions extends PresetOptions {
  testEnvironment?: "react-native";
}

interface NodePresetOptions extends PresetOptions {
  testEnvironment?: "node";
}

interface PlatformPresetOptions extends PresetOptions {
  snapshotResolver?: string;
  isServer?: boolean;
  isReactServer?: boolean;
}

interface WatchPlugin {
  name: string;
  config?: Record<string, any>;
}

interface JestConfig {
  preset?: string;
  projects?: (string | JestConfig)[];
  displayName?: string | DisplayOptions;
  testEnvironment?: string;
  setupFiles?: string[];
  setupFilesAfterEnv?: string[];
  testMatch?: string[];
  transform?: Record<string, string | [string, any]>;
  moduleNameMapper?: Record<string, string>;
  snapshotResolver?: string;
  watchPlugins?: WatchPlugin[];
  collectCoverage?: boolean;
  collectCoverageFrom?: string[];
  coverageDirectory?: string;
  coverageThreshold?: CoverageThreshold;
}

interface CoverageThreshold {
  global?: {
    branches?: number;
    functions?: number;
    lines?: number;
    statements?: number;
  };
}

docs

configuration.md

index.md

presets.md

rsc.md

testing-utilities.md

tile.json