Indo mais longe com os testes E2E angulares: estendendo o cenário DSL

O Angular oferece uma incrível DSL End-to-End (E2E) que permite escrever testes simples. O exemplo a seguir, obtido dos testes Angular E2E, mostra como escrever um teste para verificar se a localização do navegador está apontando para www.google.com

expect(browser().location().href()).toEqual('http://www.google.com')

E2E trabalha com a ideia de expectativas; a API – navegador (), elemento (), etc. retorna ‘futuros’ – essencialmente uma coisa que será satisfeita ou terá um valor em algum momento no futuro.

A API E2E é muito boa, mas no caso da Lungo Angular Bridge , precisamos ser capazes de testar a integração entre o Lungo (nosso framework de UI móvel escolhido) e o Angular; isso significa que precisamos fazer alguns testes avançados.

O que se segue é um pouco da magia do E2E angular para verificar se um elemento está visível:

expect(element('#someElement:visible').count()).toBe(1);

Estamos usando o seletor visível para jQuery (que E2E usa) e apenas nos certificando de que haja 1 elemento que corresponda.

Agora Lungo usa CSS3 para realizar seus efeitos de transição; estes usam coisas como -moz-transform e o valor disso é o valor aparece, em E2E, como uma string como esta: “matrix (1, 0, 0, 1, 0, 0)”.

Os testes LAB precisam determinar se um desses valores (a transformação X) é maior que 0 – não podemos fazer isso por meio de um teste E2E normal porque, no ponto de execução da API normal, não temos um valor .

Insira nossa adição ao DSL:

angular.scenario.dsl('xPosition', function() {
return function(selector) {
return this.addFutureAction('xPosition', function(window, $document, done) {
var transform = $document.find(selector).css('-webkit-transform');
var splitTransform = transform.split(',');
done(null, parseInt(splitTransform[4]));
});
};
});

A parte principal é a chamada para ; lá estamos fornecendo o valor que esse futuro está retornando. Se encontrarmos um problema, poderemos especificar um erro (em oposição a nulo).done(error, value)

E para chamar, podemos usar todos os matchers usuais, então o teste que estou escrevendo pode realizar o seguinte:

xPosition('#someSection').toBeGreaterThan(0);

Atualmente, tudo o que precisamos é a posição x da seção; eventualmente, testaremos mais de uma dimensão, então suponho que iremos mudar para o DSL paraposition(selector, dimension)