Nok et forsøk på visuell regresjonstesting med Storybook

[piofinn]

💬 Endringer

Siden det har vært et par tilfeller av visuell regresjon i de siste ukene tok jeg opp igjen visuell regresjonstesting med Storybook. Tweaket litt på oppsettet så det er enda mer robust, og fikk KI til å skrive noen stories som representerer det som allerede ble testet for to av komponentene: CheckboxPanel og CookieConsent.

I tillegg til den visuelle testingen inneholdt de gamle Playwright-testene også noen tester av funksjonalitet/interaktivitet. Det er laget en egen spec.ts-fil for disse testene for hver av de to komponentene. Her skjer også tilgjengelighetstesting med Axe på samme måte som før.

Begge testene bruker altså nå nye stories fra Storybook. Det kan være samme stories for begge typer tester, eller forskjellige for hver, ut fra hva som trengs. Stories som finnes fra før kan potensielt også brukes til disse testene ved å tagge dem med visual.

📋 To Do

• Her er det laget egne stories for test av hvert color scheme og size. Dette kan vi potensielt legge inn i visual.spec.ts, slik at det gjøres for hver visuelle test (det kan jo styres vha URLen i Storybook). (mulig jeg bare fikser det i denne PRen)
• Det som trengs av tester må legges til for de andre komponentene
• Når vi er fornøyd med testene for en komponent kan vi fjerne development-mappen, den gamle spec.ts-fila og mappen med gamle screenshots fra den komponenten.

[fremtind-bot]

Hei, @piofinn! Takk for at du bidrar til Jøkul! 🙌
For å sørge for god dokumentasjon og brukeropplevelse er det fint om du husker å gjøre disse tingene:

• Test endringene dine ♿️
  Sørg for å teste endringene dine for både responsivitet og universell utforming (tastaturnavigasjon, skjermleser, etc.).
• Skriv endringslogg 📝
  Sørg for at du har dokumentert endringene i et changeset hvis de skal føre til en ny release av @fremtind/jokul.
  false

Hvis du lurer på hvordan du kommer i gang med noe av dette, er det bare å spørre oss i Jøkul-teamet om hjelp! Tagg oss i en kommentar her, eller spør oss på Teams.

[fremtind-bot]

✅ Forhåndsvisning: https://jokul.fremtind.no/preview/storybook-visual-regression-tests/
🔍 Commit: ff9d548

Forhåndsvisningen blir tilgjengelig innen et par minutter. Den fjernes automatisk når pull requesten lukkes.

[piofinn]

Hmm.. Hadde håpet at testene skulle bli trigget her. Får evt. prøve å gjøre en ubetydelig endring i en av komponentene og se.