Usando CasperJS para testar a navegação em um site

CasperJS é uma ferramenta poderosa para gerar scripts de navegação e testes com o PhantomJS. Quer saber mais sobre ele? Veja o site, é a melhor referência.
Vou me ater a mostrar um script que testa uma navegação simples aqui do And After: carregar a home, testar o título, clicar no primeiro link do menu, verificar se a url está correta e checar se um certo nó do DOM existe.

O grande barato do CasperJS é poder programar (fazer o script) de teste funcional, simulando carregamento de páginas, clique em elementos, preenchimento de formulários, etc… (relativamente todo tipo de interação possível do usuário) e com isso automatizar testes.

Bem, vamos ao código (comentado linha-a-linha), que é efetivamente simples e direto:

//carrega o casperjs
var casper = require('casper').create();

//define a página inicial
casper.start("https://andafter.org");

//testa, usando a API de testes, se o título da página é And After
casper.then(function() {
    this.test.assertEquals(this.getTitle(), "And After", "Título da página é And After");
});

//então clica no primeiro link dentro da ul#level-2
casper.then(function() {
    this.click("ul#level-2 li a:first-child");
});

//testa se o endereço aberto tem a url da categoria Carreira
casper.then(function() {
    this.test.assertEquals(this.getCurrentUrl(), "https://andafter.org/categoria/carreira", "Navega para primeiro item do menu, que é de categoria Carreira");
    //e testa se existe um elemento ul.posts
    this.test.assertExists("ul.posts", "Deve existir ul.posts, que lista os posts");
});

//roda o script
casper.run(function() {
    this.test.renderResults(true);
});

 

Tendo esse script salvo em um arquivo chamado teste.js é só rodar na linha de comando:
casperjs test teste.js

O output será algo como:

CasperJS - outpu

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *