Test della tua app React Native (Parte 1)

Pubblicato il

(21 dicembre 2020)

Introduzione

La maggior parte degli sviluppatori trova i test noiosi e una seccatura da scrivere, ma sai una cosa? Ci vuole grande abilità ed esperienza per sapere come scrivere test significativi e mantenibili. La conoscenza che ottieni imparando come testare il tuo codice cambierà anche il modo in cui scrivi codice in fase di sviluppo. Questo articolo dovrebbe aiutarti a iniziare il tuo viaggio verso i test.

Linee guida per test migliori

Queste sono alcune delle linee guida che ho imparato dopo aver studiato come altri sviluppatori stanno testando il loro codice. Seguire queste linee guida mi ha reso più facile scrivere e mantenere i test in tutta la codebase.

1. Non testare limplementazione del tuo codice

Per capire perché questo è importante, esaminiamo uno scenario. Supponi di aver scritto una funzione che accetta n come input e restituisce il risultato dellaggiunta del primo n numeri.

Supponiamo che tu stia testando getSumOfFirstN per n=2 affermando che add si chiama 2 times con gli argomenti (0, 2) e (2, 1) rispettivamente e loutput di getSumOfFirstN è 3.

Successivamente, scopri che esiste un modo migliore per trovare la somma dei primi n numeri e riscrivi il codice precedente.

Il tuo test inizierà a non funzionare perché non stai più chiamando add

Questo era un semplice esempio, ed è Potrebbe sembrare controintuitivo, ma ho visto molti sviluppatori fare esattamente questo tipo di test in cui lerrore non è così facile da vedere.

2. Non lasciare che i tuoi test diventino un altro debito tecnologico

Il test è importante, ma devi anche fornire il codice alle parti interessate in tempo. Se ogni volta che scrivi una nuova funzionalità o ne modifichi una esistente, si interrompono i vecchi casi di test o finisci per spendere una quantità significativa del tempo assegnato per correggere vecchi casi di test piuttosto che costruire le funzionalità richieste, alla fine finirai per eliminare tutti i vecchi test e rischiano che il progetto fallisca in produzione.

Seguire queste linee guida dovrebbe aiutarti a garantire che i tuoi test siano facilmente risolvibili o non si interrompano affatto quando la tua base di codice cambia.

3. Durante il test dellinterfaccia utente, scrivi test in modo da simulare il comportamento effettivo dellutente.

Supponi di eseguire il test se questo pulsante è stato renderizzato e funziona come previsto oppure no, pensa prima a come lutente lo troverà e interagirà con questo pulsante. Spero che vedano il testo “Invia” e poi lo premano e quindi è esattamente ciò che simuleremmo. Nel nostro caso di test, cercheremo prima il testo “Invia”, quindi simuleremo levento “onPress” su di esso e quindi asseriremo tutto ciò che avrebbe dovuto fare.

In alcuni casi, potrebbe non essere è facile identificare in modo univoco il componente che desideri scegliere come target e, in tal caso, puoi utilizzare testID prop ma ricorda che non simulerai il comportamento completo dellutente se utilizzi testID perché gli utenti non scelgono come target i componenti in base al loro testID.

Perché è importante? Perché dobbiamo provare a simulare il più possibile il comportamento dellutente durante il test dellinterfaccia utente? Questo perché alla fine sarà un essere umano che interagirà con la tua interfaccia utente e non un computer e se vedono un “Hello” renderizzato nel tuo pulsante anziché un “Invia”, il tuo test case dovrebbe fallire perché questo è qualcosa che può scoraggiare lutente finale.

4. Le funzioni pure sono più facili da testare rispetto alle funzioni impure

Le funzioni pure sono funzioni che daranno sempre lo stesso output per un input corrispondente, cioè se una funzione pura emette 2 per un 1 lo farebbe sempre mentre le funzioni impure potrebbero pompare 2 alla prima chiamata e poi pompare 5 alla seconda chiamata.

Questo è utile da tenere a mente quando si scrive codice. Le funzioni impure possono diventare più facili da testare se il modulo che sta introducendo l “impurità” in tali funzioni è mockable.

5.Usa i dispositivi come input e asserzioni nei tuoi test

Supponi di avere un oggetto di tipo impiegato e di avere varie funzioni che operano su di esso come una funzione per rendere maiuscolo il name, una funzione per verificare se il dipendente è un adulto o meno, ecc.

Ora, supponi di prendere questo oggetto come input in tutti i tuoi casi di test.

Questi sono i tuoi dati fittizi o il tuo “dispositivo”. Nel tuo primo caso di test che verifica se la funzione che rende il nome in maiuscolo funziona come previsto o no, asserisci che il suo output è uguale a { ...employee, name: employee.name.toUpperCase() } e nel secondo caso di test, asserisci se la funzione restituisce employee.age >= 18 o meno, e così via.

Ti starai chiedendo quale vantaggio otteniamo utilizzando i dispositivi in ​​questo modo? La risposta è che stai rendendo più facile per te stesso risolvere rapidamente i test in futuro scrivendo i tuoi test in questo modo.

Ad es. E se volessimo aggiungere unaltra proprietà maritalStatus nelloggetto dipendente perché ora tutti i nostri dipendenti sono tenuti a rivelare il loro stato civile. Se nel nostro primo caso di test, abbiamo affermato che loutput è uguale a { name: "KARTIK", age: 25, sex: "Male", children: 0 } invece di { ...employee, name: employee.name.toUpperCase() }, il nostro caso di test non funzionerà. Si interromperà anche se cambiamo il valore di name in qualcosaltro. In altre parole, il nostro test case non sarebbe affatto flessibile e quindi avrà maggiori possibilità di interruzione a causa di modifiche non correlate nella base di codice.

6. Scrivere unit test per componenti e funzioni di utilità

Queste sono parti del codice che verranno utilizzate da più moduli. Quindi, devono essere testati per tutti i possibili input / casi limite perché non sai come gli altri moduli useranno queste funzioni / componenti. Quindi, questi non dovrebbero avere alcun comportamento imprevisto.

7. Scrivere test di integrazione per gli schermi

È difficile scrivere test di unità per gli schermi perché di solito questi dipendono da un gran numero di componenti e da altre librerie di terze parti come un redux store. Quindi, per scrivere unit test per gli schermi, dovrai prima deridere tutte queste dipendenze, il che è molto lavoro. Questo è il motivo per cui in questo caso è meglio scrivere test di integrazione.

7. Scrivi test E2E per testare il codice nativo

Il codice nativo non viene eseguito in un ambiente jest. Quindi per testarlo, dovrai usare una libreria come Detox.

8. Esegui sempre il test delle istantanee per schermate e componenti

Se apporti una modifica di stile in un componente che viene utilizzato da più altri schermi / componenti, i test delle istantanee per quelli non riusciranno finché non aggiorni le istantanee. Ti aiuterà a capire quali altri moduli sono stati influenzati dalla modifica che hai apportato. Se lavori in un team, aiuta davvero il revisore durante le revisioni PR a capire quali moduli sono stati influenzati dalla particolare modifica che hai apportato al componente, perché le modifiche nelle istantanee di quei moduli si riflettono nel tuo PR.

Conclusione

Spero che questo articolo ti sia stato utile e se sei confuso da ciò che hai appena letto, non preoccuparti. La seconda parte di questa serie sarà un tutorial sulla configurazione dellambiente di test in React Native con esempi di codice di schermate, componenti e funzioni di test, seguendo le linee guida che abbiamo impostato in questa prima parte.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *