greedychipmunk__agent-skills/angularjs-unit-test/resources/jest-migration-guide.md

Jest Migration Guide for AngularJS

Overview

Jest is a modern testing framework from Facebook with powerful capabilities including built-in mocking, snapshot testing, and code coverage. This guide explains how to migrate AngularJS tests from Jasmine to Jest or run both frameworks in parallel.

When to Use Jest

Jest is ideal for:

• New projects: Modern TypeScript/ES6 codebases
• React/Vue testing: Native support for modern frameworks
• Snapshot testing: Visual regression testing
• Fast test execution: Parallel test runner with isolated environments
• Zero configuration: Sensible defaults out of the box
• Built-in coverage: Coverage reporting built-in

Jasmine is ideal for:

• Legacy AngularJS 1.x projects: Extensive AngularJS integration
• Browser testing: Tests run in real browsers via Karma
• CI/CD pipelines: Mature Karma integration
• Team familiarity: Existing codebases and team expertise

Key Differences Between Jasmine and Jest

Feature	Jasmine	Jest
Test Runner	Karma (browser-based)	Jest (Node.js-based)
Module System	CommonJS/globals	CommonJS/ES6 modules
Syntax	function() { }	Arrow functions () => { }
Test Functions	it()	test() or it()
Mocking	spyOn(), manual mocks	jest.mock(), auto-mocking
Assertions	Same expect() API	Same expect() API
Setup/Teardown	beforeEach/afterEach	beforeEach/afterEach
Coverage	Istanbul/nyc (plugin)	Built-in, fast
Snapshots	Not supported	Built-in toMatchSnapshot()
Isolation	Shared environment	Isolated per test file

Installation

Option 1: Jest Only (New Projects)

npm install --save-dev jest jest-preset-angular
npm install --save-dev ts-jest @types/jest  # For TypeScript

Option 2: Jasmine + Jest (Gradual Migration)

# Keep existing Jasmine/Karma setup
npm install --save-dev jasmine karma karma-jasmine

# Add Jest for new tests
npm install --save-dev jest jest-preset-angular

Configuration

Jest Configuration (jest.config.js)

module.exports = {
  preset: 'jest-preset-angular',
  setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'],
  testPathIgnorePatterns: ['/node_modules/', '/dist/'],
  globals: {
    'ts-jest': {
      tsconfig: '<rootDir>/tsconfig.spec.json',
      stringifyContentPathRegex: '\\.(html|svg)$',
    },
  },
  collectCoverage: true,
  collectCoverageFrom: [
    'src/**/*.ts',
    '!src/**/*.spec.ts',
    '!src/main.ts',
  ],
};

setup-jest.ts

import 'jest-preset-angular/setup-jest';

Object.defineProperty(window, 'CSS', {value: null});
Object.defineProperty(window, 'getComputedStyle', {
  value: () => ({display: 'none'})
});

Migration Patterns

Pattern 1: Converting Jasmine to Jest

// BEFORE (Jasmine)
describe('UserService', function() {
  var userService, $httpBackend;

  beforeEach(module('myApp'));
  beforeEach(inject(function(_UserService_, _$httpBackend_) {
    userService = _UserService_;
    $httpBackend = _$httpBackend_;
  }));

  it('should fetch users', function() {
    $httpBackend.expectGET('/api/users').respond([]);
    userService.getUsers();
    $httpBackend.flush();
  });
});

// AFTER (Jest)
describe('UserService', () => {
  let userService;

  beforeEach(() => {
    userService = require('./UserService').default;
  });

  test('should fetch users', async () => {
    global.fetch = jest.fn().mockResolvedValueOnce({
      ok: true,
      json: async () => []
    });

    const users = await userService.getUsers();
    expect(users).toBeDefined();
  });
});

Pattern 2: Mocking Services

// Jasmine Spies
spyOn(userService, 'getUser').and.returnValue(
  Promise.resolve({ id: 1, name: 'John' })
);

// Jest Mocks
userService.getUser = jest.fn()
  .mockResolvedValue({ id: 1, name: 'John' });

Running Tests

Jest Commands

npm test                    # Run all tests
npm test -- --watch        # Watch mode
npm test -- --coverage     # With coverage
npm test -- --updateSnapshot  # Update snapshots
npm test -- --ci           # CI mode

Karma Commands (Jasmine)

npm test                    # Run tests
npm run test:watch         # Watch mode
npm run test:coverage      # With coverage

---

Last Updated: January 10, 2026