8 - Testning och debugging

Kunskaper 6. Redogöra för felsökning och tekniker för att debugga sitt program 7. Redogöra för testdriven utveckling och tekniker för enhets-, funktions- och systemtestning 8. Redogöra för testning av programvara Färdigheter: 9. Tillämpa webbteknologier för att utveckla avancerade applikationer/webbplatser

Var börjar man egentligen med testning och debugging?

Med user stories och acceptanskriterier. De blir dina testfall. Sen kan du skriva tester före kod – TDD med Red → Green → Refactor.

När ska jag använda Jest, Vitest eller Cypress?

Jest eller Vitest passar bäst för små enhetstester och komponenttester. Vitest + React Testing Library ger användarcentrerade tester. Cypress använder du när du vill testa hela flöden i webbläsaren.

Hur skriver jag bra tester?

Namnge efter beteende, t.ex. ”ska visa fel vid tom input”. Testa edge cases. Mocka nätverk i enhetstester. Låt E2E täcka det viktigaste användarflödet.

Vad betyder Red → Green → Refactor?

Skriv ett fallerande test, gör minsta kod som passerar/klarar testet, refaktorera/förbättra koden.

När behöver du Babel i ett Jest-projekt?

När du använder modern syntax/JSX/ESM som Node inte förstår

Vad är Babel i programmering

Babel är en populär JavaScript-kompilator som gör det möjligt för utvecklare att skriva modern JavaScript-kod samtidigt som den säkerställer kompatibilitet med äldre webbläsare eller miljöer.

Vad är skillnaden mellan Jest/Vitest och Cypress?

Jest/Vitest för enhet/komponent; Cypress för E2E i webbläsare

Vad testar du med React Testing Library?

Användarens perspektiv via roller/text och interaktion

Var bör jsdom användas?

I komponenttester utan riktig webbläsare (Vitest/Jest)

Varför räcker det inte att bara säga “appen är klar när kraven är kodade”?

Det är vattenfallsmetoden - fungerar dåligt i agilt arbete

Vad är en user story?

En beskrivning av en funktion ur användarens perspektiv

Varför behövs acceptanskriterier?

För att göra user stories testbara och tydliga

Exempel: Vilket acceptanskriterium kan höra till en user story om API-fel?

“Om det inte går att hämta data ska ett felmeddelande visas.”

Vilka tre huvudtyper av test finns?

Unit test, Interagtion test, End-to-End (E2E) test

Vad är ett enhetstest (unit test)?

Testar en liten del (funktion/komponent) isolerat. Snabba och många

Vad är ett integrationstest?

Testar att flera delar fungerar ihop (t.ex. knapp skickar fomulär)

vad är ett E2E-test?

Testar hela användarflödet i webbläsaren från början till slut

Vad står TDD för?

Test-Driven Development

Vad är Jest?

Ett JavaScript-testframework för enhetstester och komponentsttester

Vad kan du testa med Jest?

Fuktioner, komponenter, API-anrop, händelser

Vad är React Testing Library?

Ett verktyg som testar React-komponenter på samma sätt som användaren upplever dem?

Vad är Vitest?

En testmotor för JavaScript/react som kör tester snabbt (alternativ till Jest)

Varför behöver man ofta kombienra Vitest och React Testing Library?

Vitest kör testerna, men kan inte rendera komponenter själv

Vad är Cypress?

Ett verktyg för end-to-end testing i en riktig webbläsares

Skillnaden mellan Jest och Cypress?

Jest = funktioner/komponenter isolerat

Cypress = hela appens flöden (klick, navigation, formulär)

Vad bör man fokusera på i tester?

Användarens upplevelse (kan de klicka? sker rätt sak?), inte implementation (className etc)

Exempel: Vad testar man i renderingstest?

Om rätt rubrik/text visas

Exempel: Vad testar man i interaktionstest?

Om något händer när man klickar på en knapp