Egységgel teszteljük a normál JavaScript-függvényeket, hogy megbizonyosodjunk arról, hogy megfelelően működnek-e. Egy bizonyos bemenet esetén a megfelelő kimenetet kell visszaadnia.
Ez egy jó teszt. Azt teszteli, hogy mi érdekel minket; hogy megkapjuk a helyes választ. Nem foglalkozunk az összegfüggvény belső megvalósításával. Képzeljük el, ha az összegfüggvénynek ez a kiagyalt megvalósítása lenne.
A korábban elvégzett teszt továbbra is működik ennél az új megvalósításnál.
Elképzelhető egy rossz teszt a funkció belső megvalósításának tesztelésével. Vessen egy pillantást a következő tesztre:
Ez egy rossz teszt, mert olyasmit tesztelünk, ami nem érdekel minket.
Így kell gondolkodnunk a React komponensek tesztelésén is. Képzeld el, hogy megvan ez az alapvető React komponens.
Ebben az alapösszetevőben egy gomb lekapcsolja a letiltott állapotát, amikor a másik gombra kattintok. Erre jó teszt lehet:
Egy rossz teszt az, ha megvizsgáljuk, hogyan valósítjuk meg ezt a logikát. Az összeg függvény példájában a megvalósítási részlet a rendelkezésünkre álló tömb volt. A React Component példánkban a megvalósítás részletei az általunk használt állapot.
Ez ismét egy rossz teszt, mert az Összetevőnket átalakíthatjuk erre:
A komponensünk továbbra is azt csinálja, amit akarunk, de az új tesztünk most kudarcot vall.
Ne feledje, hogy a React összetevői függvények. Átadja a bemeneteket (mint kellékeket), és kap egy kimenetet (a render funkciójából). Az összetevő állapota egy megvalósítási részlet.
Mielőtt tesztelné az összetevő állapotát, lépjen vissza, és ellenőrizze, hogy a megfelelő dolgot teszteli-e.
