Войти
  • 37Просмотров
  • 4 дня назадОпубликованоQA Routine

Vitest for React with Vite: Unit & Integration Testing with API Mocking

In this video, we build a real-world React testing example using Vitest. You’ll learn how to write unit and integration tests for a React app that fetches weather data from a public API — and how to mock API calls properly. Repository with test code: Commands to use: npm create vite@latest vitest-weather -- --template react-ts cd vitest-weather npm install npm install -D vitest @testing-library/react @testing-library/jest-dom jsdom Weather API: Vitest: Vite: We’ll cover: - Setting up Vitest with React + Vite - Keeping tests close to components for better maintainability - Testing a standalone Weather component - Mocking fetch for API-driven UI tests - Handling loading, success, and error states - Best practices for frontend testing (what to test & what NOT to test) Tech stack used: - React - Vite - Vitest ⏱️ Chapters: 00:00 – Intro 01:25 – Install required tools 04:40 – Create weather component 11:15 – Writing unit/integration vitest 18:40 – Conclusions