Tesztelés¶
ESLint¶
Az ESLint egy statikus kódelemző eszköz, amely segít azonosítani és javítani a JavaScript kód hibáit és stílusproblémáit. A React projektekben gyakran használják az ESLint-et a kódminőség fenntartása érdekében.
Telepítés¶
Futtatás¶
Vagy pedig:
Próba¶
Csináljunk egy üres projektet és hozzunk létre az App.tsx fájlban egy változót, amit nem használunk:
Ezután futtassuk az ESLint-et:
Az ESLint figyelmeztetést fog adni a unusedVariable változó miatt, mivel az nincs használatban. Ez segít abban, hogy tisztán tartsuk a kódunkat és elkerüljük a felesleges változókat.
Jest¶
A Jest egy JavaScript tesztelési keretrendszer, amelyet a Facebook fejlesztett ki. Kifejezetten a React alkalmazások tesztelésére optimalizált, és számos beépített funkcióval rendelkezik, mint például a snapshot tesztelés és a mockolás.
Husky¶
A Husky egy eszköz, amely lehetővé teszi a Git hook-ok egyszerű kezelését. Segítségével automatikusan futtathatunk teszteket vagy lintelést minden commit előtt, így biztosítva a kódminőséget.
Telepítés¶
Pre-commit hook létrehozása¶
A Husky segítségével létrehozhatunk egy pre-commit hook-ot, amely automatikusan futtatja az ESLint-et minden commit előtt. Amennyiben a lintelés hibát talál, a commit nem fog végrehajtódni, így biztosítva, hogy csak tiszta kód kerüljön a verziókezelőbe.
Hozzunk létre egy .husky könyvtárat a projekt gyökerében, majd adjuk ki az alábbi parancsot CMD-ben:
Próba¶
Most próbáljuk meg commitolni olyan fájlt, amelyben szándékosan hagyunk egy lint hibát, például egy nem használt változót.
Amikor megpróbáljuk commitolni a változtatásokat, a Husky automatikusan futtatja az ESLint-et, és ha hibát talál, megakadályozza a commit végrehajtását.
Egyéb hook-ok¶
A Husky nem csak a pre-commit hook-okat támogatja, hanem számos más Git hook-ot is, mint például a pre-push, post-merge, vagy akár a commit-msg. Ezek segítségével különböző műveleteket hajthatunk végre a Git műveletek során, például futtathatunk teszteket push előtt vagy ellenőrizhetjük a commit üzenetek formátumát.