Before each step \\ Event emitter in Protractor to

问题:

I am trying to handle animation in my protractor tests. One of the options is to disable animation. But I don't want to do it. The second option is to do this way before each step:

var EC = protractor.ExpectedConditions;
browser.wait(EC.stalenessOf(element(by.css('[class*="ng-animate"]'))), 5000);

It works because Angular adds "ng-animate" to the class of element which is in animation.

So there are two questions:

1. How to add before each step in Protractor?
2. How to add eventEmitter in protractor which emit something on predefined methods like "click"?

Appreciate any answers on this two questions even if it don't dedicate to animation handling.

回答1:

Here is my solution. It requires knowledge of how plugins work in protractor. There is "waitForPromise" hook which works unclear, but this example helped me to perform the solution.

waitForPromise: function(){
    return browser.executeAsyncScript(function(){
        var callback = arguments[arguments.length - 1];

        var counter = 0;
        var checker = setInterval(function(){
            if (counter>100){
                clearInterval(checker);
                callback();
            }

            if ($('[class*="ng-animate"]').length>0) {
                // console.log('catched');
            } else {
                // console.log('notPresent or Disappeared');
                clearInterval(checker);
                callback();
            }
            counter++;
        },50);

    }).then(function() {
        console.log('done');
    });
}

On each promise during the execution of tests, it just checks if there is any element with class "ng-animate" and if it does, it waits for this element to disappear or counter>100 (5 seconds). Probably this is not the best solution because it could be any animation during steps of the test. In this case, you will get a huge delay of overall tests execution.