量角器 - 如何处理动画严重的网站？

Question

我必须为一个Angular应用程序的网站编写测试,并且有大量的动画.几乎所有的东西都有一个"迷你"的窗口,从顶部滑入并进入中心,然后它的内容从右边进入,直到进入它们,依此类推.

这打破了我的测试,很多.量角器看到元素,因为它们被显示但是它们无法点击它们,因为它们正在移动并且它抛出一个错误,说其他元素将接收到点击.这经常发生,我不知道如何处理它(除了使用browser.sleep(xxxx)).

除了使用睡眠功能外,有没有解决方法呢？如果我真的没有其他选择,我必须在第二排使用它...

**我试过这个browser.manage().timeouts().implicitlyWait(30000);并没有帮助.

PS我也有一些案例,其中量角器试图在元素可见之前点击它.

我可以制作一个简短的视频来展示动画是什么,如果需要的话.

test.describe('Profile tests: ', function(){
this.timeout(0);

test.before(function(){
    browser.get('......');
});

test.it('Change Username', function() {
    var newUsername = 'Sumuser';

    welcome.continueLink.click();  
    bonus.takeBonus.isDisplayed().then(function() {                
        bonus.takeBonus.click();            
    });
    entrance.openEntrance.click();

    browser.sleep(300);
    loginBasic.openNormalLogin.isDisplayed().then(function() {
        loginBasic.openNormalLogin.click();
    });

    browser.sleep(300);
    login.usernameField.isDisplayed().then(function() {
        login.usernameField.sendKeys(username);
    });

    login.passwordField.sendKeys(password);
    login.loginButton.click();
    infoBar.avatar.click();

    browser.sleep(1000);
    myProfile.editProfileButton.click();

    browser.sleep(1000);
    username.field.clear();
    username.field.sendKeys(newUsername);
    editProfileButtons.saveChanges.click();

    browser.sleep(1000);
    myProfile.username.getText().then(function (text){
        expect(text).to.equal(newUsername);
    });
});
});

我也尝试在配置文件中添加以下内容以禁用动画:

onPrepare: function() {
    var disableNgAnimate = function() {
        angular.module('disableNgAnimate', []).run(['$animate', function($animate) {
            $animate.enabled(false);
        }]);
    };

    browser.addMockModule('disableNgAnimate', disableNgAnimate);
}

Answer 1

显式等待browser.wait()可能会使测试更可靠.

例如,等待元素变为可点击:

var EC = protractor.ExpectedConditions;
var elm = element(by.css(".myclass"));

browser.wait(EC.elementToBeClickable(elm), 5000);

您也可以完全关闭角度动画,请参阅:

• 如何在角度js应用程序中禁用量角器中的动画