tech
Defaultdeesfrzh

Jest

JavaScript-Testframework - Zero-Config, Snapshots, Mocking und Code-Coverage sofort einsatzbereit

TL;DR

Was: Ein erfreuliches JavaScript-Testing-Framework mit Null-Konfiguration.

Warum: Schnell, Snapshot-Testing, großartiges Mocking, eingebaute Coverage, weit verbreitet.

Quick Start

Installation:

npm install --save-dev jest

Zu package.json hinzufügen:

{
  "scripts": {
    "test": "jest"
  }
}

Testdatei erstellen (sum.test.js):

const sum = (a, b) => a + b;

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});

Tests ausführen:

npm test

Cheatsheet

MatcherBeschreibung
toBe(value)Exakte Gleichheit
toEqual(obj)Tiefe Gleichheit
toBeTruthy()Truthy-Wert
toBeNull()Null-Prüfung
toContain(item)Array enthält
toThrow()Wirft Fehler
toHaveBeenCalled()Mock wurde aufgerufen

Gotchas

Async testing

// Async/await
test('fetches data', async () => {
  const data = await fetchData();
  expect(data).toBe('data');
});

// Promises
test('resolves to data', () => {
  return expect(fetchData()).resolves.toBe('data');
});

Mocking

// Mock-Funktion
const mockFn = jest.fn();
mockFn.mockReturnValue(42);
mockFn.mockResolvedValue('async result');

// Modul mocken
jest.mock('./api', () => ({
  fetchUser: jest.fn().mockResolvedValue({ name: 'John' })
}));

Snapshot testing

test('renders correctly', () => {
  const tree = renderer.create(<Button>Click</Button>).toJSON();
  expect(tree).toMatchSnapshot();
});

Setup and teardown

beforeAll(() => { /* Einmal vor allen Tests ausführen */ });
afterAll(() => { /* Einmal nach allen Tests ausführen */ });
beforeEach(() => { /* Vor jedem Test ausführen */ });
afterEach(() => { /* Nach jedem Test ausführen */ });

Next Steps