Lavora con noi

JavaScript

Siti tematici

Speciali

Ajax

JavaScript » Articoli » Mondo Javascript

Pagine:

RSS

QUnit, unit test per JavaScript

di: Andrea Chiarelli 14 Febbraio 2012

QUnit è un framework per la creazione di unit test in JavaScript nato all'interno del progetto jQuery come tool ufficiale per i test sul codice del progetto, ma utilizzabile per verificare le funzionalità di qualsiasi codice JavaScript.

Per vederlo all'opera è sufficiente un comune browser, l'importazione della libreria in una pagina HTML e poche righe di codice. In questo articolo vedremo come utilizzarlo per creare unit test anche in presenza di chiamate asincrone, come ad esempio quelle effettuate con Ajax.

Preparare l'ambiente di test consiste nella creazione di una pagina HTML che include la libreria QUnit, il codice JavaScript da testare ed il codice degli unit test, come mostrato di seguito:

<html>
<head>
	<title>QUnit Test Suite</title>
	<link rel="stylesheet" href="qunit/qunit.css" type="text/css" media="screen">
	<script type="text/javascript" src="qunit/qunit.js"></script>
	<script type="text/javascript" src="myCode.js"></script>
	<script type="text/javascript" src="myUnitTest.js"></script>
</head>
<body>
	<h1 id="qunit-header">QUnit Test Suite</h1>
	<h2 id="qunit-banner"></h2>
	<div id="qunit-testrunner-toolbar"></div>
	<h2 id="qunit-userAgent"></h2>
	<ol id="qunit-tests"></ol>
	<div id="qunit-fixture"></div>
</body>
</html>

In questo esempio myCode.js indica il codice JavaScript da sottoporre al test mentre myUnitTest.js rappresenta appunto gli Unit Test. Il corpo della pagina HTML è costituito da un insieme di elementi che conterranno il risultato dell'esecuzione dei test formattato secondo le regole CSS contenute nel foglio di stile standard qunit.css.

Sviluppare ed eseguire uno Unit Test per Javascript

La scrittura di un test case con QUnit è basata sulla funzione test() che prevede due argomenti:

una descrizione del test
una funzione che si occupa di eseguire il codice da testare e di verificare il risultato tramite apposite asserzioni

Supponendo di voler sottoporre a test una funzione somma(x, y) che deve effettuare la somma dei due valori passati in ingresso, possiamo scrivere il nostro test case come segue:

test("Test della funzione somma()",
	function () {
		ok(somma(0,0) == 0, "La somma di 0 con 0 è 0");
		ok(somma(2,0) == 2, "La somma di 2 con 0 è 2");
		ok(somma(2,1) == 3, "La somma di 2 con 1 è 3");
		ok(somma(2,-1) == 1, "La somma di 2 con -1 è 1");
		ok(somma(-2,1) == -1, "La somma di -2 con 1 è -1");
	});

Il corpo della funzione di test contiene nel nostro caso una serie di chiamate alla funzione ok(). È questa la funzione di QUnit per la verifica delle asserzioni.

Per eseguire il test non dobbiamo fare altro che aprire la pagine HTML in un browser e, se le asserzioni sono valide, avremo un risultato come quello mostrato nella figura seguente:

Figura 1. Primo QUnit risultato valido