tessl/npm-nx--jest

Nx plugin for Jest testing with executors, generators, and configuration utilities for monorepo testing workflows.

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Overview

Eval results

Files

Preset Configuration

Name: tessl/npm-nx--jest
Author: tessl

Pre-configured Jest settings optimized for Nx workspaces with TypeScript support, modern JavaScript features, and monorepo-specific optimizations. The preset provides sensible defaults that work well with Nx's build system and caching mechanisms.

Capabilities

Nx Jest Preset

Default Jest configuration preset optimized for Nx workspaces.

/**
 * Nx Jest preset with optimized configuration for monorepos
 */
const nxPreset: Config;

/**
 * Default export of the Nx Jest preset
 */
export default nxPreset;

Preset Configuration Object

Complete Jest configuration object with Nx-specific optimizations.

interface NxJestPreset extends Config {
  /** Test file matching patterns */
  testMatch: string[];
  /** Custom Jest module resolver for Nx projects */  
  resolver: string;
  /** Supported file extensions for modules */
  moduleFileExtensions: string[];
  /** Coverage report formats */
  coverageReporters: string[];
  /** File transformation rules */
  transform: Record<string, [string, any]>;
  /** Default test environment */
  testEnvironment: string;
  /** Test environment configuration options */
  testEnvironmentOptions: {
    customExportConditions: string[];
  };
}

Default Configuration Values

The preset includes the following default configuration:

const nxPreset: Config = {
  /** Jest's default test file patterns with additional extensions */
  testMatch: ['**/?(*.)+(spec|test).?([mc])[jt]s?(x)'],
  /** Nx-specific module resolver for better monorepo support */
  resolver: '@nx/jest/plugins/resolver',
  /** Extended file extensions including modern JS/TS variants */
  moduleFileExtensions: ['ts', 'js', 'mts', 'mjs', 'cts', 'cjs', 'html'],
  /** HTML coverage reports by default */
  coverageReporters: ['html'],
  /** TypeScript and JavaScript transformation with ts-jest */
  transform: {
    '^.+\\.(ts|js|mts|mjs|cts|cjs|html)$': [
      'ts-jest',
      { tsconfig: '<rootDir>/tsconfig.spec.json' }
    ]
  },
  /** JSDOM environment for DOM testing */
  testEnvironment: 'jsdom',
  /** CommonJS compatibility settings */
  testEnvironmentOptions: {
    customExportConditions: ['node', 'require', 'default']
  }
};

Usage Examples:

// Basic preset usage
import { nxPreset } from '@nx/jest/preset';

export default {
  ...nxPreset,
  displayName: 'my-project',
  coverageDirectory: '../../coverage/apps/my-project'
};

// CommonJS usage
const { nxPreset } = require('@nx/jest/preset');

module.exports = {
  ...nxPreset,
  displayName: 'my-project'
};

Customizing the Preset

The preset can be extended and customized for specific project needs:

import { nxPreset } from '@nx/jest/preset';

export default {
  ...nxPreset,
  // Override test environment
  testEnvironment: 'node',
  
  // Add custom test patterns
  testMatch: [
    ...nxPreset.testMatch,
    '**/*.integration.spec.ts'
  ],
  
  // Extend transformations
  transform: {
    ...nxPreset.transform,
    '^.+\\.vue$': 'vue-jest'
  },
  
  // Add module name mapping
  moduleNameMapper: {
    '^@/(.*)$': '<rootDir>/src/$1'
  },
  
  // Custom setup files
  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts']
};

Test Environment Configuration

The preset defaults to jsdom with CommonJS compatibility settings:

interface TestEnvironmentOptions {
  /** Export conditions for module resolution */
  customExportConditions: string[];
}

Environment Customization:

// Node.js environment for backend testing
export default {
  ...nxPreset,
  testEnvironment: 'node',
  testEnvironmentOptions: {
    // Node-specific export conditions
    customExportConditions: ['node', 'require']
  }
};

// Browser environment with custom options
export default {
  ...nxPreset,
  testEnvironment: 'jsdom',
  testEnvironmentOptions: {
    ...nxPreset.testEnvironmentOptions,
    url: 'http://localhost:3000'
  }
};

File Extension Support

The preset supports a comprehensive set of file extensions:

// Supported extensions in order of precedence
moduleFileExtensions: [
  'ts',   // TypeScript
  'js',   // JavaScript
  'mts',  // ES Module TypeScript
  'mjs',  // ES Module JavaScript  
  'cts',  // CommonJS TypeScript
  'cjs',  // CommonJS JavaScript
  'html'  // HTML files
]

Transformation Rules

Default transformation configuration for various file types:

interface TransformConfig {
  [pattern: string]: [string, TransformOptions];
}

interface TransformOptions {
  /** TypeScript configuration file */
  tsconfig: string;
  /** Additional ts-jest options */
  [key: string]: any;
}

Transform Customization:

export default {
  ...nxPreset,
  transform: {
    ...nxPreset.transform,
    // Add Babel transformation for specific files
    '^.+\\.jsx?$': 'babel-jest',
    // Add SWC transformation  
    '^.+\\.(t|j)sx?$': ['@swc/jest'],
    // Static asset transformation
    '\\.(jpg|jpeg|png|gif|svg)$': 'jest-transform-stub'
  }
};

Module Resolution

The preset includes a custom resolver optimized for Nx monorepos:

// Custom resolver handles:
// - TypeScript path mapping
// - Nx library imports
// - CSS/SCSS file mocking
// - Package.json exports field
// - ESM/CommonJS compatibility
resolver: '@nx/jest/plugins/resolver'

Coverage Configuration

Default coverage reporting with HTML output:

export default {
  ...nxPreset,
  // Extend coverage reporters
  coverageReporters: [
    ...nxPreset.coverageReporters,
    'text-summary',
    'lcov'
  ],
  
  // Coverage collection patterns
  collectCoverageFrom: [
    'src/**/*.{ts,tsx,js,jsx}',
    '!src/**/*.d.ts',
    '!src/**/*.stories.{ts,tsx}'
  ],
  
  // Coverage thresholds
  coverageThreshold: {
    global: {
      branches: 80,
      functions: 80,
      lines: 80,
      statements: 80
    }
  }
};

Integration with Nx Features

The preset is designed to work seamlessly with Nx features:

Caching: Optimized for Nx's computation caching
Affected: Configured for affected test detection
Build System: Compatible with Nx's build pipeline
Workspace Libraries: Supports importing workspace libraries
Path Mapping: Handles TypeScript path mapping automatically

Common Preset Extensions

React Projects

import { nxPreset } from '@nx/jest/preset';

export default {
  ...nxPreset,
  testEnvironment: 'jsdom',
  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
  moduleNameMapper: {
    '\\.(css|less|scss|sass)$': 'identity-obj-proxy'
  },
  transform: {
    ...nxPreset.transform,
    '^.+\\.(ts|tsx)$': ['ts-jest', {
      tsconfig: '<rootDir>/tsconfig.spec.json'
    }]
  }
};

Node.js Libraries

import { nxPreset } from '@nx/jest/preset';

export default {
  ...nxPreset,
  testEnvironment: 'node',
  testEnvironmentOptions: {
    customExportConditions: ['node', 'require']
  },
  coverageDirectory: '../../coverage/libs/my-lib'
};

Angular Projects

import { nxPreset } from '@nx/jest/preset';

export default {
  ...nxPreset,
  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
  globals: {
    'ts-jest': {
      tsconfig: '<rootDir>/tsconfig.spec.json',
      stringifyContentPathRegex: '\\.(html|svg)$'
    }
  },
  transform: {
    ...nxPreset.transform,
    '^.+\\.(ts|js|html)$': 'jest-preset-angular'
  }
};

Migration from Custom Configurations

The preset simplifies migration from custom Jest configurations:

// Before: Custom configuration
export default {
  testMatch: ['<rootDir>/src/**/*.(test|spec).ts'],
  transform: {
    '^.+\\.ts$': 'ts-jest'
  },
  testEnvironment: 'jsdom',
  moduleFileExtensions: ['ts', 'js']
};

// After: Using preset
import { nxPreset } from '@nx/jest/preset';

export default {
  ...nxPreset,
  // Only specify project-specific overrides
  displayName: 'my-project',
  coverageDirectory: '../../coverage/my-project'
};

Install with Tessl CLI