Testen in TypeScript: Vollständiger Leitfaden zu Frameworks und Tools

Testen in TypeScript: Frameworks und Tools für qualitativ hochwertige Entwicklung

TypeScript ist eine leistungsstarke Sprache, die JavaScript um statische Typisierung erweitert. Allerdings garantieren selbst strenge Typen nicht die Abwesenheit logischer Fehler. Um die Zuverlässigkeit des Codes zu gewährleisten, ist der Einsatz von Tests notwendig. In diesem Artikel betrachten wir die wichtigsten Tools und Frameworks zum Testen von TypeScript-Anwendungen: von Modultests bis hin zu End-to-End (E2E)-Tests.

Warum TypeScript-Code testen?

Der TypeScript-Compiler erkennt Typfehler, prüft jedoch nicht die Geschäftslogik. Tests helfen dabei:

• Regressionen beim Refactoring zu entdecken
• Das erwartete Verhalten von Funktionen zu dokumentieren
• Code-Reviews durch automatische Verifizierung zu beschleunigen
• Das Vertrauen in die Funktionsfähigkeit der Anwendung zu stärken

Hauptkategorien des Testens

• Unit-Tests — Prüfung einzelner Funktionen, Klassen oder Module.
• Integrationstests — Interaktion zwischen Modulen (z. B. mit einer Datenbank).
• E2E-Tests — Simulation von Benutzeraktionen im Browser.

1. Jest — Universelles Framework für Unit-Tests

Jest von Facebook ist die beliebteste Wahl für TypeScript. Es funktioniert „out of the box": erfordert keine komplexe Konfiguration, verfügt über eine integrierte Mock-Engine und einen Codeabdeckungsbericht.

Installation:

npm install --save-dev jest @types/jest ts-jest

Fügen Sie in jest.config.ts hinzu:

export default {  preset: 'ts-jest',  testEnvironment: 'node',};

Beispiel eines Unit-Tests für eine Funktion:

// math.tsexport const add = (a: number, b: number): number => a + b;

// math.test.tsimport { add } from './math';

describe('add', () => {  it('should return sum of two numbers', () => {    expect(add(2, 3)).toBe(5);  });

  it('should handle negative numbers', () => {    expect(add(-1, -2)).toBe(-3);  });});

Mocks in Jest:

// api.tsexport const fetchData = async (id: string) => {  const response = await fetch(`/api/${id}`);  return response.json();};

// api.test.tsjest.mock('./api', () => ({  fetchData: jest.fn().mockResolvedValue({ id: '1', name: 'Test' }),}));

import { fetchData } from './api';

test('should return mocked data', async () => {  const data = await fetchData('1');  expect(data.name).toBe('Test');});

2. Mocha + Chai — Flexible Alternative

Mocha ist ein Test-Runner, der volle Kontrolle über den Prozess bietet. Chai fügt ausdrucksstarke Assertions hinzu.

Installation:

npm install --save-dev mocha chai @types/mocha @types/chai ts-node

Beispiel eines Integrationstests mit Asynchronität:

// database.tsexport class Database {  async getUser(id: number): Promise<{ id: number; name: string }> {    // Abfrageemulation    return { id, name: 'Alice' };  }}

// database.test.tsimport { expect } from 'chai';import { Database } from './database';

describe('Database', () => {  it('should return user by id', async () => {    const db = new Database();    const user = await db.getUser(1);    expect(user).to.have.property('name', 'Alice');  });});

Verwenden Sie zum Ausführen den Befehl mocha --require ts-node/register src/**/*.test.ts.

3. Cypress — E2E-Testen für Webanwendungen

Cypress eignet sich ideal zum Testen von Frontends mit TypeScript. Es läuft in einem echten Browser und verfügt über eine benutzerfreundliche GUI-Oberfläche.

Installation:

npm install --save-dev cypress @cypress/types

Beispiel eines E2E-Tests für eine Anmeldeseite