Javascript 量角器-如何处理动画过多的站点?

Javascript 量角器-如何处理动画过多的站点?,javascript,angularjs,protractor,mocha.js,Javascript,Angularjs,Protractor,Mocha.js,我必须为一个有角度的应用程序和大量动画的网站编写测试。几乎所有的东西都有一个“迷你”窗口,从顶部滑入,进入中间,然后内容从右边滑入,直到进入,依此类推 这打破了我的测试,很多。量角器可以看到元素,因为它们显示了,但是它不能点击它们,因为它们正在移动,它抛出一个错误,表示其他元素将收到点击。这种情况经常发生,我不知道如何处理(除了使用browser.sleep(xxxx))之外) 除了使用sleep功能外,还有其他解决方案吗?如果我真的没有其他选择,我必须使用它每第二排 **我试过这个browse

我必须为一个有角度的应用程序和大量动画的网站编写测试。几乎所有的东西都有一个“迷你”窗口,从顶部滑入,进入中间,然后内容从右边滑入,直到进入,依此类推

这打破了我的测试,很多。量角器可以看到元素,因为它们显示了,但是它不能点击它们,因为它们正在移动,它抛出一个错误,表示其他元素将收到点击。这种情况经常发生,我不知道如何处理(除了使用browser.sleep(xxxx))之外)

除了使用sleep功能外,还有其他解决方案吗?如果我真的没有其他选择,我必须使用它每第二排

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

另外,我也有这样的情况,量角器试图在元素可见之前点击它

如果需要的话,我可以制作一个短片来展示动画

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);
}
使用显式等待可能会使测试更可靠

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

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

browser.wait(EC.elementToBeClickable(elm), 5000);
也可以完全关闭角度动画,请参见:


我刚刚添加了一个答案,您可能会发现禁用css转换很有用

为了方便起见,我将在这里重复重要的代码。我在其中一个样式表中添加了一个类,如下所示:

.notransition * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;
}
。。。在量角器中,我得到了如下结果:

_self.disableCssAnimations = function() {
  return browser.executeScript("document.body.className += ' notransition';");
};

可能有更巧妙的方法来应用这个概念,但上面的方法对我来说很有效。

关闭动画是最好的方法。要增加一点,请确保您也考虑了css动画。我不确定是否有可靠的方法关闭它们,但请确保知道它们在哪里,并对它们进行适当的等待。谢谢您的回复。不幸的是,我不能使用ExpectedConditions,因为我使用的是量角器的TS定义,它还不支持它。即使我可以,它也不能解决问题,因为我必须用browser.sleep替换browser.wait,实际上什么都不会改变。我已经更新了我的主要帖子,并添加了我的测试。我想摆脱所有这些
睡眠
。我试图禁用动画,但没有成功-我在我的主要帖子中添加了我在配置文件中使用的代码。请帮忙!:)正如您所见,使用Promissions
isDisplayed
也没有帮助,因为我仍然需要睡眠…@MBielski我明白您的意思,但我认为这不是一种正确的方法,因为您正在测试产品端功能。动画是其中的一部分,你应该在用户体验时对其进行测试。谢谢,但我没有应用程序的源代码,我只是在测试它。如果你无法将任何css添加到应用程序的源代码中,我想知道是否可以从量角器中动态添加它;可能在传递给
浏览器的函数中执行类似操作。executeScript(…)
调用: