Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 53 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand Down