diff --git a/README.md b/README.md index 9eb7d37..ba7ea8c 100644 --- a/README.md +++ b/README.md @@ -99,8 +99,59 @@ Når man har lagt inn denne skal prosjektet kunne kjøre lokalt, og api-kall ska > Filen `.env.local` er derfor lagt til i `.gitignore`. ## testing -_Clemens skriv om testing her_ -_Hva som er testet: hvilke nettlesere, hvilke enheter, og hva de automatiske testene dekker_ + +I dette prosjektet bruker vi _Vitest_ med jsdom og React Testing Library. Disse kjøres med: +``` +pnpm test + +#watch-modus som kjører blir stående å kjøre tester i bakgrunnen mens du lager nye + +pnpm test:run # 1 gjennomkjørign + + +``` + +Vi har per nå 18 tester frodelt på 5 filer: + +**sortAndFilterMovies.test.ts** er ren logikk uten React. Den tester filtreringen på minmumsvurdering etter alle tre sorteringene og at funksjonen ikke endrer lista den får inn. + +**SeachField.test.tsx** denne tester brukerinteraksjon. Feltet finnes via getByLabelText, som betyr at koblingen mellom htmlFor og id er riktig. Dette er samme kobling en skjermleser bruker. Skrivingen med userEvent bekrefter at feltet er kontrollert. Det melder fra oppover for hvert tastetrykk i stedet for å holde egen state. + +**Sidebar.test.tsx** er for React State. Å klikke på pil ai sidebar endrer både menyen og aria-expanded samtidig, og aria-current settes riktig på favorittsiden. + +**MovieCard.test.tsx** – props og snapshot. Sjekker at tittel og rating vises, og at favorittknappen kaller tilbake med riktig film-id. + + +**MovieList.test.tsx** er for mocking. vi.mock bytter ut API-modulen, og testen sjekker i itillegg at global fetch aldri kalles. Dette er slik at vi vet at testene ikke går ut på nettet. + +Testoppsettet ligger som det er nå i src/test/setup.ts . Den inneholder en stub for window.matchMedia som ikke finnes i jsdom. Uten den kr@sjer alt som rendrer Sidebar, fordi useMediaQuery kaller den ved føeste render... + + +### Manuell testing + + Testet på: + + - Firefox på macOs for det meste, men har også sjekket at det fungerer på Windows Os og en Ubuntu Os. + + - Da nettsiden ikke var lagt ut på serveren før 15. September har vi benyttet oss av Firefox sin innebygd developer tools(Control + Shift + m på windows og option + cmd + m på macOs) for å sjekke mobil view på nettsiden og tilrettelegge etter det. Etter dette har vi nå på 15.september brukt mye tid på manuell testing av nettsiden på telefon, da det er noen ting som man bare oppdager ved faktisk bruk på telefon. Dette har vi opprettet flere issues på git for. + + - Vi har også satt responsivt oppsett i devtools ned til 320px bredde. + + Sjekket manuelt: + - at søk oppdaterer resultater mens man skriver + - at sortering og filtrering på søkesiden overlever en reload + - at favoritter overlever at nettleseren lukkes helt + - at menyen bytter mellom sidefeltet og bunnlinje ved 700px uten en reload + - detaljvisningen kan åpnes og lukkes både fra kortet og ved å klikke på bakgrunnen + + ### Ikke dekket i tester + +Vi har ingen ende-til-ende-tester, og layout testes ikke automatisk. +Responsivt design er kun verifisert manuelt. +TreningPreview, SortfilterBar og MovieDetails har ingen egne tester som det står nå. + + + ## prosjektstruktur, komponenter, hooks, layout, types