test(config): sette opp Vitest og mocking for komponenttester

README.md

@@ -453,14 +453,50 @@ pull requests med kodegjennomgang fra et annet gruppemedlem.
 
 ## Testing
 
-Automatiske funksjons- og komponenttester settes opp i en egen issue.
+Automatiske komponent- og hook-tester kjøres med Vitest.
 Kommandoen `npm run lint` er statisk kodekontroll, ikke en funksjonstest.
 
+### Testoppsett
+
+Kjør testene én gang:
+
+```bash
+npm run test
+```
+
+Kjør testene i vaktmodus under utvikling, der de kjører på nytt ved endringer:
+
+```bash
+npm run test:watch
+```
+
+- **Miljø:** Testene kjører i jsdom, satt opp i `test`-feltet i
+  `vite.config.ts`. `defineConfig` importeres fra `vitest/config` i stedet
+  for `vite`, slik at feltet får riktige typer.
+- **Testoppsett:** `src/test/setup.ts` kjører før alle tester. Den utvider
+  `expect` med jest-dom-matchere som `toBeInTheDocument`, og nullstiller
+  DOM-et (`cleanup`), `localStorage`, `sessionStorage` og mocks/stubbede
+  globaler (for eksempel `fetch`) etter hver test. Ingen test kan dermed
+  påvirke en annen.
+- **Mocking av API-kall:** Tester som trenger `fetch`, stubber den med
+  `vi.stubGlobal('fetch', ...)` og et eget svar. Automatiske tester
+  kontakter derfor aldri det ekte API-et.
+- **QueryClient per test:** `createTestQueryClient` i `src/test/queryClient.ts`
+  gir en fersk `QueryClient` til hver test som bruker TanStack Query, slik at
+  ingen cache deles mellom tester. Klienten har `retry: false` og
+  `retryDelay: 0` som standard, slik at en feiltest ikke venter på ekte
+  forsinkelse mellom forsøk, selv om en hook som `useCountries` setter sin
+  egen `retry`.
+- **Brukerinteraksjon:** Komponenttester bruker `@testing-library/react` og
+  `@testing-library/user-event`, se `src/components/FavoriteButton.test.tsx`.
+- Se `src/hooks/useCountries.test.tsx` for et eksempel som kombinerer mocket
+  `fetch` og en isolert `QueryClient`.
+
 ### Kontroller av API-integrasjonen
 
-Vitest er ikke satt opp ennå. Kontrollene under ble kjørt manuelt eller
-med engangsskript da integrasjonen ble laget. Skriptene er ikke lagt til
-i repoet.
+Vitest var ikke satt opp da denne integrasjonen ble laget. Kontrollene
+under ble derfor kjørt manuelt eller med engangsskript. Skriptene er ikke
+lagt til i repoet.
 
 - `npm run lint`, `npm run format:check` og `npm run build` besto.
 - **Manuell API-verifisering:** Dokumentasjonen ble lest, og faktiske
@@ -638,7 +674,7 @@ Testet i nettleserens enhetsemulering:
 - Lastetilstand, feilmelding og tomt favorittutvalg passer inn i layouten.
 - Ikke testet på ekte mobil eller i Safari ennå.
 
-Automatiske tester som gjenstår når Vitest er satt opp:
+Automatiske tester som gjenstår, planlagt i en egen issue:
 
 - `fetchCountries`: vellykket henting, HTTP-feil, nettverksfeil, ugyldig
   JSON, uventet format, tom respons, manglende felter og avbrutt