A React Native alkalmazás tesztelése (1. rész)

(2020. december 21.)

Bevezetés

A legtöbb fejlesztő unalmasnak és fárasztónak tartja a tesztelést, de tudod mit? Nagy készség és tapasztalat szükséges ahhoz, hogy tudjunk értelmes és fenntartható teszteket írni. A kód tesztelésének elsajátításával megszerzett tudás megváltoztatja a kódírás módját is a fejlesztés során. Ez a cikk segít abban, hogy elindulhasson a tesztelés során.

Útmutató a jobb teszteléshez

Ezeket az irányelveket ismertem meg, miután azt kutattam, hogy más fejlesztők hogyan tesztelik a kódjukat. Ezen irányelvek betartása megkönnyítette számomra a tesztek írását és karbantartását az egész kódalapon.

1. Ne tesztelje a kód megvalósítását

Hogy megértsük, miért fontos ez, menjünk át egy forgatókönyvet. Tegyük fel, hogy olyan függvényt írt, amely n -t veszi bemenetként, és az első n számok.

Tegyük fel, hogy a getSumOfFirstN tesztelést végzi a n=2 számára azzal állítva, hogy a add nevet 2 times a (0, 2) és (2, 1) argumentummal, valamint a 3.

Később kiderül, hogy van egy jobb módszer az első n számokat, és írja felül a fenti kódot.

A teszt elromlik, mert már nem hívod a következőt: add

Ez egy egyszerű példa volt, és ez y ellentmondó intuitívnak tűnhet, de sok fejlesztőt láttam pontosan ilyen tesztelésen, ahol a hibát nem olyan könnyű észrevenni.

2. Ne hagyja, hogy tesztjei újabb technikai adóssággá váljanak

A tesztelés fontos, de a kódot is időben el kell juttatnia az érintett érdekelt felekhez. Ha bármikor új funkciót ír vagy módosít egy meglévőt, az megszakítja a régi teszteseteket, vagy a kiosztott idő jelentős részét a régi tesztesetek kijavítására fordítja, nem pedig a szükséges funkciók kiépítésére, akkor végül törli az összes régi tesztet kockáztatja, hogy a projekt meghiúsul a gyártásban.

Ezen irányelvek követése segíthet abban, hogy a tesztek könnyen javíthatók legyenek, vagy egyáltalán ne törjenek el, amikor a kódbázis megváltozik.

3. A felhasználói felület tesztelésekor írjon teszteket úgy, hogy szimulálja a tényleges felhasználói viselkedést.

Tegyük fel, hogy tesztel hogy ez a gomb renderelt-e és a várakozásoknak megfelelően működött-e vagy sem, akkor először gondolkodjon el azon, hogy a felhasználó hogyan találja meg és hogyan lépne kapcsolatba vele. Remélem, hogy meglátják a „Küldés” szöveget, majd megnyomják, és így pontosan ezt szimulálnánk. Tesztes esetünkben először a „Submit” szöveget keressük meg, majd az „onPress” eseményt szimuláljuk rajta, majd állítunk bármit, amire kellett volna.

Bizonyos esetekben előfordulhat, hogy nem könnyen egyedileg azonosítható a megcélozni kívánt összetevő, és ebben az esetben használhatja a testID prop elemet, de ne feledje, hogy nem a teljes felhasználói viselkedést fogja szimulálni, ha a testID, mert a felhasználók nem célozzák meg az összetevőket testID alapján.

Miért fontos ez? Miért kell megpróbálnunk a felhasználói viselkedést a lehető legjobban szimulálni a felhasználói felület tesztelésekor? Ennek oka, hogy végül egy ember lesz az, aki nem a számítógépével, hanem az Ön felhasználói felületével fog interakcióba lépni, és ha a „Hello” -ot látja a gombjában, nem pedig a „Submit” -et, akkor a tesztesete sikertelen lehet, mert ez eldobhatja a végfelhasználót.

4. A tiszta funkciókat könnyebb tesztelni, mint a tisztátalan funkciókat

A tiszta függvények olyan funkciók, amelyek mindig ugyanazt a kimenetet adják meg egy megfelelő bemenethez, azaz ha egy tiszta függvény kiszivattyúzza 2 egy 1 esetén, akkor mindig ezt tenné, míg a tisztátalan funkciók az első híváskor kiszivattyúzhatják a 2 -t, majd kiszivároghatnak div id = “6c36b2fd42”> a második hívásnál.

Ezt hasznos megjegyezni a kódírás során. A tisztátalan függvényeket könnyebben lehet tesztelni, ha az a modul, amely bevezeti az ilyen funkciók „szennyeződését”, csúfolható.

5.Használjon lámpatesteket bevitelként és állításként a tesztjeiben.

Tegyük fel, hogy van egy alkalmazott típusú objektuma, és különféle funkciók működnek rajtuk, például egy funkció, amellyel nagybetűket ír a name, egy funkció annak ellenőrzésére, hogy a munkavállaló felnőtt-e vagy sem, stb.

Most tegyük fel, hogy ezt az objektumot beveszi az összes tesztesetbe.

Ez a próbabábu adatai vagy a „berendezése”. Az első tesztesetben, amely azt teszteli, hogy a nevet nagybetűvel írt függvény a várakozásoknak megfelelően működik-e vagy sem, azt állítja, hogy a kimenete megegyezik a { ...employee, name: employee.name.toUpperCase() } értékkel, a második tesztesetben pedig azt állítja hogy a függvény kimeneti-e a employee.age >= 18 -et vagy sem, és így tovább.

Kíváncsi lehet, hogy milyen előnyre teszünk szert a készülékek ilyen használatával? A válasz az, hogy megkönnyíti a jövőben a tesztek gyors kijavítását azáltal, hogy így írja meg a teszteket.

Pl. Mi van, ha hozzá akarunk adni egy másik tulajdonságot maritalStatus a munkavállalói objektumba, mert most minden alkalmazottunk köteles nyilvánosságra hozni családi állapotát. Ha az első tesztesetünkben azt állítottuk, hogy a kimenet { name: "KARTIK", age: 25, sex: "Male", children: 0 } egyenlő a { ...employee, name: employee.name.toUpperCase() } helyett, akkor a tesztesetünk megszakad. Akkor is megszakad, ha a name értékét valami másra változtatjuk. Más szavakkal, tesztesetünk egyáltalán nem lenne rugalmas, és ennélfogva nagyobb esélye lesz a törésre a kódbázis független változásai miatt.

6. Komponensek és segédfunkciók egységtesztjeinek írása

Ezeket a kód részeit több modul fogja használni. Ezért minden lehetséges bemenetre / él-esetre tesztelni kell őket, mert nem tudod, hogy a többi modul hogyan fogja használni ezeket a funkciókat / összetevőket. Ezért ezeknek nem szabad váratlan magatartást tanúsítaniuk.

7. Integrációs tesztek írása a képernyőkhöz

Nehéz megírni az egységek tesztjeit a képernyők számára, mert ezek általában nagyszámú összetevőtől és más harmadik féltől származó könyvtáraktól függenek, például egy redux tárolótól. Tehát, hogy a képernyőkhöz egységteszteket írjon, először meg kell csúfolnia ezeket a függőségeket, ami sok munka. Ezért jobb, ha ebben az esetben integrációs teszteket írunk.

7. Írjon E2E teszteket a natív kód teszteléséhez

A natív kód nem futtatható tréfás környezetben. Tehát a teszteléshez olyan könyvtárat kell használnia, mint a Detox.

8. Mindig végezzen pillanatfelvétel-tesztelést a képernyőkön és az összetevőkön.

Ha módosít egy stílust egy olyan összetevőnél, amelyet több más képernyő / összetevő használ, akkor azok pillanatkép-tesztjei sikertelenek lesznek, amíg nem frissíti a pillanatképeket. Ez segít megérteni, hogy mely más modulokat érintette az Ön által végrehajtott változás. Ha csapatban dolgozik, akkor ez valóban segít az ellenőrnek a PR-felülvizsgálatok során megérteni, hogy mely modulokat érintette az adott komponensen végrehajtott változás, mert az adott modulok pillanatképeinek változásai tükröződnek a PR-ben.

Következtetés

Remélem, hasznosnak találta ezt a cikket, és ha összezavarja az imént olvasott, akkor ne aggódjon. A sorozat második része egy oktatóanyag lesz a tesztkörnyezet beállításáról a React Native alkalmazásban a képernyők, az alkatrészek és a funkciók kódpéldáival, követve az ebben az első részben beállított irányelveket.

Vélemény, hozzászólás?

Az email címet nem tesszük közzé. A kötelező mezőket * karakterrel jelöltük