In questo articolo impari come scrivere i test in JavaScript. Non è necessario avere una conoscenza approfondita di JavaScript perché ti farò vedere qualcosa di davvero semplice.
Quello che stiamo per fare si basa su una web app che gira su Node.js ed è totalmente indifferente l’utilizzo di una libreria come React o di un framework come Angular.
Come scrivere i test in JavaScript
Prima di imparare come scrivere i test in JavaScript è necessario che utilizzi Node.js. Questo perché questa guida fa affidamento sull’utilizzo della libreria assert di Node.
Nel mio caso utilizzerò lo stesso progetto con il quale ho fatto il tutorial su ReactJS del quale puoi leggere di più in questa guida.
Cosa sono gli Unit Test?
So che vuoi imparare come scrivere i test in JavaScript, ma non ti posso lasciar libero senza che capisci cosa sono gli Unit Test.
Gli Unit Test, o test unitari, sono dei test che vengono fatti su delle unità del codice o del software. Ci sono test unitari che vanno a testare il funzionamento di un singolo metodo o funzione e dei test che al contrario vanno a testare anche unità di software più ampie così come possibili comportamenti del software (vedremo nel prossimo articolo che questo può essere molto utile con ReactJS).
Perché è importante testare il codice?
Ti prometto che subito dopo ti spiego come scrivere i test in JavaScript, però devi anche capire perché è importante testare il codice.
Testare il codice è importante perché ti fa dormire tranquillamente. Con questo voglio chiaramente dire che un test ben scritto non ti farà mai trovare sorprese di bug improvvisi.
Capire l’importanza dei test unitari ti porta a capire anche meglio come scrivere i test in JavaScript. Il fatto è che scrivere i test velocizza enormemente il tuo lavoro, la produzione dell’azienda e ti assicura di aver un codice scritto anche meglio e sicuramente funzionante.
In che modo?
Mentre moltissime persone ed aziende credono che scrivere i test unitari sia una perdita di tempo e hanno l’impressione che non ci sia mai tempo per scriverli, nella realtà dei fatti è proprio quì che si crea un’ampia falla nel meccanismo di produzione di un software.
Ricordati sempre che i test:
- Ti permettono di debuggare il codice in ogni caso.
Quindi se stai creando una web app non devi far partire il server locale ogni volta, fare click dove si rompe e vedere cosa succede. - Ti permettono di trovare gli errori più velocemente.
Un test ben scritto deve essere anche “parlante”. E quando si scrive buon codice il test solitamente è molto rapido da capire. A volte capita che un test non è stato scritto con un occhio critico e che dia come risultato “Success” invece di “Error” anche se c’è un bug. Grazie alla presenza del test però è molto più facile andare in debug, capire quale fosse l’intenzione di chi ha creato il metodo/funzione e sistemare tutto. - Velocizzano la produzione.
Non tutti utilizzano ancora le metodologie Agili. In ogni caso l’idea di dare la possibilità al cliente di cambiare in corsa le idee ed il fatto che comunque è normale modificare il codice per effettuare del refactoring, fa sì che i test diventino qualcosa di fondamentale.
Grazie ai test puoi infatti modificare tutto il tuo codice conscio del fatto che non romperai quello che già funziona. Vuoi snellire un metodo? Comunque il test che avevi fatto su di lui rimane e se ora dà errore probabilmente hai tolto o aggiunto qualcosa di troppo. - Sono un mezzo per scrivere codice pulito.
Il bello dei test è che spesso capita che nessuno ha voglia di scrivere i test. Il modo migliore per scriverli ed essere rapidi è quindi quello di creare metodi / funzioni da testare molto piccole e facilmente riutilizzabili (hai detto niente!). Ogni volta dovrai scrivere test molto piccoli ed allo stesso tempo ne gioverà il tuo codice che sarà composto da un codice pulito e riutilizzabile.
Non ti dimenticare poi che tutto questo ti permette di creare un codice molto più generico (quindi riutilizzabile) dandoti lo spunto per utilizzare maggiormente le interfacce.
E quindi?
Ti ho elencato alcuni motivi del perché i test sono importanti. Ma se vuoi una spiegazione più ampia o più autorevole ti affido ad autori del calibro di Robert Martin, Kent Beck e Paul Hamill e ti consiglio questi libri:
Questi libri sono datati, ma sono del tutto attuali nei concetti.
Come scrivere i test in JavaScript
Bene a questo punto possiamo vedere rapidamente come scrivere i test in JavaScript. Come ti ho detto ti parlerò di una web app su Node.js.
Prendi il tuo progetto, che sia esso nuovo o lo stesso della guida su ReactJS (trovi la guida quì).
A questo punto devi semplicemente creare una cartella “test” nella quale andremo ad inserire i nostri test e qualcos’altro.
Per essere precisi nella cartella “test” troveremo il file App.test.js che al momento non ci interessa. Dopo di che creo la classe ExampleCalculator che avrà un metodo in grado di ritornare la somma tra due numeri e la suite di test exampleCalculator.test.js.
Ti informo che i file contenenti i test di una classe prendono il nome del file della classe al quale viene aggiunto “.test.js”.
Ovviamente solo per questo esempio trovi una classe che serve all’applicazione dentro alla cartella “tests”. Normalmente andrai a testare il codice di una classe che si trova in qualche cartella utile alla tua app. Per esempio un’utilità dentro alla cartella “utils” o “common/utils” a seconda di come strutturi il tuo progetto.
ExampleCalculator
La classe che ho creato per il test è banale. Ha un metodo add che prende in ingresso due parametri. Questi due parametri vengono ritornati al chiamante sommati:
export default class ExampleCalculator{
add(x, y){
return x + y;
}
}
Quanto abbiamo visto è il banale contenuto del file exampleCalculator.js.
Il test
Il test di questa classe che si trova nel file exampleCalculator.test.js e che rappresenta una suite di test (può contenere infatti quanti test vogliamo) è composta dal seguente codice:
import assert from "assert";
import ExampleCalculator from "./exampleCalculator";
it('exampleCalculator: add method', () =>{
var exampleCalculator = new ExampleCalculator();
var result = exampleCalculator.add(5, 3);
assert.equal(result, 8, "");
});Quello che ho fatto in ordine è:
- Importare la libreria Assert che è inclusa in Node.js come puoi vedere quì
- Importare ExampleCalculator dal file adiacente creato un attimo fa
- Dunque utilizziamo la parola chiave “it” (puoi usare anche “test”, “it” è un alias infatti). E’ una funzione che tra parentesi tonde accetta un messaggio da mostrare e poi una funzione (nel nostro caso stiamo utilizzando una arrow function)
- Dunque all’interno della funzione che passiamo al test andiamo a creare un’istanza della classe ExampleCalculator
- Quindi chiamiamo il metodo add con i valori 5 e 3 ed il risultato viene conservato nella variabile result
- Infine chiamiamo il metodo equal di assert che prende in ingresso il valore che non conosciamo, il valore che ci aspettiamo ed un messaggio da scrivere eventualmente in caso di errore (vedi quì)
Esecuzione del test
Hai imparato come scrivere i test in JavaScript. Adesso dobbiamo eseguire i test.
Per eseguire un test è necessario che ti posizioni con il terminale nel progetto e che chiami il comando npm run test o npm test. Solitamente hai già configurato nel file package.json lo script per l’esecuzione dei tests.
Se hai seguito la guida su ReactJS dovresti aver tutto pronto. Ti informo che react-scripts utilizza per fare i test il famoso Jest di Facebook. Lo puoi utilizzare anche tu che non hai seguito la guida o non lavori con React.JS. Installarlo è facilissimo, basta seguire questa guida in 2 secondi.
Il risultato nel terminale sarà il seguente:
Cosa succede in caso di fallimento?
In caso di fallimento del test il terminale manderà a schermo la descrizione del fallimento. Supponiamo che io mi aspetti dalla somma tra 5 e 3 un risultato pari ad 81. Ecco quello che accade:
Conclusioni
Hai imparato come scrivere i test con JavaScript. Ovviamente puoi approfondire il discorso man mano che vai avanti andando a scoprire anche i mock dei quali magari ti parlerò in un prossimo articolo.
Oltre ai libri che ti ho consigliato sopra, ti consiglio anche un libro specifico per JavaScript: JavaScript Unit Testing.
Iscriviti alla newsletter e non ti perderai i nuovi articoli. Mando da 1 a 4 mail al mese ricapitolando dove siamo arrivati con ogni guida. Con la newsletter hai anche accesso a libri ed ebook gratuiti, così come a coupon Udemy ? .
Per dubbi o domande scrivimi nei commenti ? .
Se ti è piaciuto l’articolo seguimi su Facebook e Twitter oppure rimani sempre aggiornato con la newsletter (da 1 a 4 mail al mese!).
