← ClaudeAtlas

typescript-testinglisted

TypeScript testing patterns with Vitest and MSW. Use when writing unit tests, mocking APIs, creating typed mocks for dependency injection, or using snapshot testing.
martinffx/atelier · ★ 28 · Testing & QA · score 83
Install: claude install-skill martinffx/atelier
# TypeScript Testing Patterns Comprehensive testing patterns using Vitest for unit testing, MSW for API mocking, and snapshot testing for complex object validation. ## Quick Start ### Installation ```bash # Core testing dependencies bun add -d vitest @vitest/ui # MSW for API mocking bun add -d msw # Optional: coverage reporting bun add -d @vitest/coverage-v8 ``` ### Basic Test Structure ```typescript import { describe, it, expect, vi, beforeEach } from 'vitest' describe('UserService', () => { beforeEach(() => { vi.clearAllMocks() }) it('creates user with valid data', async () => { const result = await userService.create({ name: 'Alice' }) expect(result).toMatchObject({ name: 'Alice' }) }) }) ``` ## Typed Mock Objects Create type-safe mocks for dependency injection using `vi.mocked()`: ```typescript import { vi } from 'vitest' import type { UserRepository } from './user-repository' // Mock the entire module vi.mock('./user-repository') // Get typed mock instance const mockUserRepo = vi.mocked<UserRepository>({ findById: vi.fn(), save: vi.fn(), delete: vi.fn(), }) // Type-safe mock return values mockUserRepo.findById.mockResolvedValue({ id: '123', name: 'Alice', email: 'alice@example.com', }) // Assertions with full type safety expect(mockUserRepo.findById).toHaveBeenCalledWith('123') ``` ### Mock Return Values ```typescript // Single return value mockRepo.findById.mockResolvedValue(user) // Multiple calls, different returns m