obter o texto do elemento durante o tempo limite angular $ no transferidor

Question

Observação:usando MEAN - Mocha, Express, Angular e Node para o aplicativo

Estou aprendendo a fazer o teste e2e e criei um pequeno aplicativo para testar.Uma coisa que ele faz é que sempre que você executa uma ação, ele exibe uma mensagem por X segundos e depois desaparece.Estou usando angulares $timeout.

$scope.displayMessage = function(messageIn, borderColor){

        var timeoutTime = 5000; //clear the message after x seconds
        $scope.borderType = "1px solid " + borderColor;

        $scope.messages = messageIn;

        $scope.visibility = true; //reveal the div
        $timeout.cancel($scope.timeout); //cancel any previous timers

        $scope.timeout = $timeout(function(){ //Set and start new timer.

            $scope.visibility = false;
            $scope.messages = "";
        }, timeoutTime);
    };

Agora estou tentando testar isso.Atualmente eu tenho

 it("should display message", function(done){

        var button = element(by.id("getStudents"));

        console.log("clicking button");

        var messageElem = element(by.binding("messages"));

        button.click().then(function () {

            console.log("button clicked");

            messageElem.getText().then(function(text){

               console.log("The text should equal: " + text);
            });

            //expect(messageElem.getText()).toBe("Students retrieved");
            console.log("test executed");

        });

        done();
    });

Mas parece estar esperando até o tempo limite para fazer o messageElem.getText().then() ponto em que o div foi limpo.O log “teste executado” será impresso durante o tempo limite, mas não a função “getText()”.Suponho que isso tenha algo a ver com o ciclo de vida angular.

Ah, e aqui está o HTML (no formato Jade)

 div(ng-model="messages",ng-show = "visibility", style = "clear:both;padding-top:3em;border:{{borderType}};text-align:center;")

    h3
        {{messages}}

ignore meu estilo, tive preguiça de fazer um arquivo css para esse aplicativo de teste :D

Answer 1

Tente usar $interval em vez de $timeout.

O transferidor tenta esperar até que a página seja completamente carregada antes de executar qualquer ação (como encontrar um elemento ou enviar um comando para um elemento).

Ler aqui.Detalhes aqui.

Answer 2

Eu hackeei isso usando o bloco de código abaixo.Eu tinha uma barra de notificação de um pacote de nó de terceiros (ng-notifications-bar) que usava $timeout em vez de $interval, mas precisava esperar que o texto do erro tivesse um determinado valor.Eu usei um sleep() curto para permitir que a animação da barra de notificação aparecesse, mudei ignoreSynchronization para true para que o Transferidor não esperasse que o $timeout terminasse, configurei meu expect() e mudei o ignoreSynchronization de volta para false para que o Transferidor possa continue o teste dentro da cadência regular do AngularJS.Sei que os sonos não são os ideais, mas são muito curtos.

browser.sleep(500);
browser.ignoreSynchronization = true;
expect(page.notification.getText()).toContain('The card was declined.');
browser.sleep(500);
browser.ignoreSynchronization = false;