SauceLabs é uma plataforma de teste que possibilita realizar testes automáticos ou manuais em aplicações móveis e web (incluindo navegadores como Internet Explorer, Opera, Safari, Android, iPhone, Chrome etc). Essa plataforma permite executar os testes em diversas linguagem de programação, porém, em nosso exemplo, iremos utilizar o NodeJS (JavaScript).
O NodeJS e o Gerenciador de Pacotes do Node (traduzido do inglês Node Package Manager – NPM) podem ser baixados no site oficial. Esse gerenciador de pacotes permite a interação com um repositório online via linha de comando, facilitando a instalação de várias ferramentas.
Nesse exemplo, será utilizado uma ferramenta chamada Test’em, que é gerenciada e instalada pelo NPM. Essa ferramenta permite rodar os testes unitários de JavaScript localmente em diferentes plataformas, tornando a execução mais fácil e divertida. Test’em suporta vários frameworks de teste, tais como: Jasmine, QUnit e Mocha. Para instalar, basta digitar no terminal:
npm install testem -g
No exemplo, será utilizado o framework Jasmine. Mesmo código do tutorial oficial do SauceLabs. As especificações do código estão descritas no arquivo PastaSpec.js e a implementação no arquivo Pasta.js. Ambos arquivos encontra-se abaixo:
PastaSpec.js
describe("Pasta", function() { it("should make spaghetti bolognese", function() { var pasta = new Pasta(); pasta.add("tomatoes"); pasta.add("garlic"); pasta.add("olive"); pasta.add("herbs"); pasta.add("meat"); expect(pasta.getType()).toEqual("bolognese"); expect(pasta.isTasty()).toEqual(true); }); it("should make pasta with no sauce", function() { var pasta = new Pasta(); pasta.add("meat"); expect(pasta.getType()).toEqual(undefined); // pasta with no sauce? yeah that's not too tasty expect(pasta.isTasty()).toEqual(false); }); });
Pasta.js
function Pasta() { // recipes for good pasta sauces this.sauces = { 'bolognese': ["tomatoes", "garlic", "olive", "herbs", "meat"] }; this.sauceIngredients = []; } Pasta.prototype.add = function (ingredient) { this.sauceIngredients.push(ingredient); }; Pasta.prototype.getType = function () { for (var posssibleSauce in this.sauces) { var ingredientsValid = true; // checking if arrays are equal if (!(this.sauceIngredients.sort() > this.sauces[posssibleSauce].sort() || this.sauceIngredients.sort() < this.sauces[posssibleSauce].sort())) { return posssibleSauce; } } return undefined; }; Pasta.prototype.isTasty = function () { if (this.getType() !== undefined) { return true; } return false; };
Uma vez criado o arquivo de especificação ‘PastaSpec.js’ e a implementação ‘Pasta.js’, é preciso criar um arquivo de configuração ‘testem.json‘. Necessário apenas informar o framework utilizado e os arquivos JavaScript. Conforme escrito abaixo:
testem.json
{ "framework": "jasmine", "src_files": [ "Pasta.js", "PastaSpec.js" ] }
O Test’em usa como padrão a porta 7357. O parâmetro ‘–port’ serve para especificar uma outra. Nesse caso, vamos utilizar a 8080, digitando:
testem --port=8080
Após a execução do comando, o resultado dos testes pode ser visto pela url https://localhost:8080/. Caso a url seja aberta no Chrome, os testes serão executados no navegador Chrome. Caso aberta no Safari, será executado no Safari. Como ilustra a figura seguinte.
Para testar o código em diversos navegadores ou diversos sistemas operacionais, não é necessário ter máquinas virtuais nem mesmo outros dispositivos, como celulares ou tablet. O Sauce Labs prover o conector Sauce Connect. Com ele é possível criar uma conexão entre a nossa máquina e os servidores do SauceLabs, assim é possível rodar os testes dentro do firewall do Sauce Labs Cloud. Cloud que disponibiliza mais de 200 plataformas, que inclui dispositivos móveis, diversos SO e navegadores. Uma vez baixado o Sauce Connect, essa conexão é feita pelo comando:
java -jar Sauce-Connect.jar --tunnel-identifier "tabless" $SAUCE_USERNAME $SAUCE_ACCESS_KEY
Vale ressaltar que _$SAUCEUSERNAME e $SAUCE_ACCESS_KEY são variáveis de ambientes. Método recomendado para evitar a divulgação de dados privados. Para obter dados de acesso, acesse a página de cadastro. Após a criação da conta, uma chave de acesso já é fornecida, conforme é ilustrado na figura abaixo.
Na página inicial, o botão New Interactive Session permite a criação de uma instância de navegador. Uma popup (ilustrada na imagem abaixo) será exibida ao clicar no botão, com várias opções de sistema operacional e de navegador.
Ao instanciar o navegador, é possível visualizar o resultado dos testes no terminal (ilustração na imagem abaixo). Os testes sempre serão executados novamente caso haja alguma alteração tanto no código quanto nas especificações, possibilitando assim a prática de TDD ou BDD, utilizando qualquer tipo de navegador.
Esse exemplo contempla apenas a execução de testes de forma manual. Essas ferramentas que foram utilizadas também oferecem suporte para a automatização de testes, mas isso ficará para um próximo capítulo. Para quem se interessar, todo código está disponível em um gist. Muito obrigado.