CasperJS è un tool per la navigazione e il testing. Si appoggia su due strumenti di navigazione PhantomJS e SlimerJS, il primo simula il motore di renderizzazione di Chrome, il secondo di Firefox.
E’ completamente basato su javascript ed è fortemente orientato alla navigazione asincrona, quindi ha delle caratteristiche che lo rendono adatto all’interazione con applicazioni web moderne.
L’installazione è molto semplice, fate riferimento alla guida ufficiale.
Essenzialmente fa da wrapper alle chiamate native dei due browser headless su cui si appoggia oltre a mettere a disposizione altre comode funzioni. L’esecuzione di una suite è molto più veloce rispetto ad altri tool, tra cui Selenium, proprio perchè si appoggia a questi due browser. Lo svantaggio, è che simulando i veri e proprio browser, l’utilità di test relativi a come viene renderizzata la pagina è abbastanza limitata. L’esecuzione di un test CasperJS porterà, ad esempio, all’esecuzione di un processo phantomjs, ed essendo headless non verrà aperta alcuna finestra di navigazione, ma il tutto avviene a linea di comando.
Su windows uso cmd per eseguire test CasperJS.
Modulo tester
Il modulo che uso io per i test è quello tester che ha diverse funzioni per la verifica degli elementi, le asserzioni.
Per eseguire un file casperjs ed usare le api di tale modulo, basta digitare casperjs test nome_del_file.js
Il costrutto then()
L’unico costrutto di cui voglio parlarvi è quello then() che è uno dei più importanti. then() non ha altro che aggiungere allo stack di navigazione un nuovo passo.
[code]
casper.then(function () {
this.open("http://www.google.it/");
});
casper.then(function() {
this.echo(this.getTitle());
});
[/code]
Essenzialmente allo stack sono aggiunti due passi di navigazione, quando la url sarà caricata, verrà eseguito il secondo passo che consiste nello stampare il titolo della pagina.
Esempio
Vi riporto l’esempio di prima con in aggiunta un’istruzione propria del modulo tester, cioè assertTitle.
[code]
casper.test.begin(‘Test Google’, 1, function suite(test) {
var titleFound;
casper.start();
casper.then(function () {
this.open("http://www.google.it/");
});
casper.then(function() {
titleFound= this.getTitle();
this.echo("Il titolo e’ "+this.getTitle());
});
casper.then(function() {
test.assertTitle("Google", titleFound);
});
casper.run(function() {
test.done();
casper.test.renderResults(true, 0);
this.exit();
});
});
[/code]
Lo script è molto semplice, carica il titolo della pagina e poi lo confronta con quello fornito.
Faccio notare, che almeno con la versione di casperjs 1.1.0 dev3 è bene aggiungere l’istruzione renderResults che fornisce un riepilogo dei test eseguiti.
Questo è l’output dell’esecuzione
In 1 sec, ha caricato Google ed effettuato il test.
Asincronicità
Ne parleremo in un tutorial apposito. Vi lascio però questo consiglio. Prima di effettuare delle asserzioni secche, come fatto prima, è bene assicurarsi che elemento di cui controllare il valore esista effettivamente. A me è capitato che dei test fallissero in maniera randomica…. il problema è che alcune volte casperjs o meglio phamtomjs è talmente veloce nell’eseguire i passi del test che, anche se manualmente gli stessi passi non danno problemi, in maniera automatica possono fallire perchè magari la reazione ad un determinato evento impiega, qualche volta, un pò di tempo in più per cui rischiate di fare un test su un qualcosa che non è ancora avvenuto o non completamente. In questi casi vi consiglio di usare i costrutti waitFor, che rispecchiano proprio l’asincronicità
