11 Feb Tester med đJest och đ§ȘEnzyme
SĂ„ vad Ă€r Jest och Enzyme – och hur kan de förbĂ€ttra din kod? ?
Jest Àr ett bibliotek och testramverk för JavaScript som kan testa enkel kod eller React-komponenter. Enzyme Àr ett annat bibliotek/ramverk som skapar en simulerad DOM för att testa om komponenter rendrerats korrekt.
?Jest fungerar Ă€ven med Babel, TypeScript, Node, React, Angular, Vue, mm. Genom Jests API gĂ„r det att göra antaganden om hur funktioner skall bete sig. Jest Ă€r vĂ€ldigt lĂ€tt att sĂ€tta upp och anvĂ€nda. En smart funktion i Jest Ă€r sĂ„ kallade “snapshots”. Detta Ă€r ögonblicksbilderav komponenter som sedan jĂ€mförs varje gĂ„ng tester körs. PĂ„ sĂ„ sĂ€tt Ă€r det enkelt att upptĂ€cka om nĂ„got förĂ€ndrats. NĂ€r Jest och Enzyme arbetar ihop sĂ„ kan komponenter testas genom en simulerad DOM (mock).
?Enzyme Ă€r ett ramverk som ofta anvĂ€nds ihop med Jest eller Mocha och Chai. Enzyme skapar en “mock DOM” sĂ„ att man kan testa om komponenter rendrerats korrekt samt om de beter sig korrekt vid interaktion (klick, Ă€ndra vĂ€rde, spara, etc). Enzyme kan “mocka” rendrering genom antingen “shallow rendering” eller “full DOM rendering”.
Shallow rendering anvÀnds för enhets-tester av komponenter. Komponenterna testas isolerade, utan att ta hÀnsyn till interaktion med andra komponenter.
Full DOM rendering rendrerar komponenten och samtliga underkomponenter (children components). Komponenterna kan dÄ testas mer utförligt med interaktion mellan komponenter.
? Bra “cheat sheets” för Jest och Enzyme finns hĂ€r:
Jest: https://devhints.io/jest
Enzyme: https://devhints.io/enzyme
Ett anvÀndbart trick att komma ihÄg nÀr man skriver tester Àr att bara testa den sviten man skriver för tillfÀllet. Att köra alla tester mellan varje Àndring kan ta flera minuter!
Gör sÄhÀr:
NĂ€r testerna Ă€r klara – tryck pĂ„ “w“.
Tryck sedan pĂ„ “p” och skriv in namnet pĂ„ testsviten.
FĂ„r att Ă„tergĂ„ – tryck pĂ„ “p” igen.
Test Suites: 50 passed, 50 total
Tests: 154 passed, 154 total
Snapshots: 36 passed, 36 total
Time: 54.687s
Ran all test suites.
Watch Usage: Press w to show more.
Watch Usage
âș Press a to run all tests.
âș Press p to filter by a filename regex pattern.
âș Press t to filter by a test name regex pattern.
âș Press q to quit watch mode.
âș Press Enter to trigger a test run.