使用Protractor进行AngularJS测试 - 似乎永远不会执行对click()的调用

时间:2017-11-08 12:42:44

标签: angularjs protractor

我正在为AngularJS应用程序开发一套测试,并且最近将以下测试脚本添加到我的spec.js文件中:

it('should navigate to the Charts page', function() {
    console.log("Start Charts page test ");
    browser.waitForAngularEnabled(false);
    browser.wait(EC.presenceOf(chartsMenuBtn), 5000).then(
        browser.actions().mouseMove(chartsMenuBtn).perform().then(
            chartsMenuBtn.click().then(
                browser.wait(EC.elementToBeClickable(closeDlgBtn)).then(
                    function(){
                        closeDlg();
                        expect(browser.getCurrentUrl()).toBe(VM + '/#/charts');
                    }
                )
                //)
            )
        )
    )
})

目前,当我运行我的测试时,所有在此之前编写的测试运行&正确执行,然后在运行此测试时,我在命令行中得到以下输出,我正在运行protractor conf.js

  

...警报页面测试已完成

     

。启动图表页面测试

     

FA Jasmine规范超时。重置WebDriver控制流程。

     

茉莉花规格超时。重置WebDriver控制流程。

     

启动最终浏览器页面测试

     

单击浏览器菜单按钮

     

结束浏览器页面测试(然后调用)   

     

故障:

     

1)应用应该导航到图表页面

     
    

消息:         错误:超时 - 在jasmine.DEFAULT_TIMEOUT_INTERVAL指定的超时内未调用异步回调。       堆:         错误:超时 - 在jasmine.DEFAULT_TIMEOUT_INTERVAL指定的超时内未调用异步回调。             在ontimeout(timers.js:386:11)             在tryOnTimeout(timers.js:250:5)             在Timer.listOnTimeout(timers.js:214:5)

         

消息:         错误:超时 - 在jasmine.DEFAULT_TIMEOUT_INTERVAL指定的超时内未调用异步回调。       堆:         错误:超时 - 在jasmine.DEFAULT_TIMEOUT_INTERVAL指定的超时内未调用异步回调。             在ontimeout(timers.js:386:11)             在tryOnTimeout(timers.js:250:5)             在Timer.listOnTimeout(timers.js:214:5)

  
     

6个规格,1个失败

     

以64.989秒完成

在脚本打开的浏览器窗口(运行测试的窗口)中,我可以看到chartsMenuBtn元素被突出显示(即当测试将光标移动到它时),但是此时,脚本似乎冻结,对chartsMenuBtn.click()的调用似乎永远不会运行...

如果我在我的脚本中添加对browser.pause()的调用,那么我手动必须告诉脚本在每个可执行行继续,然后脚本的行为完全符合我的预期,一切都过去了。

但是,当我删除对browser.pause()的调用,并观察脚本自行运行时,它总是卡在同一点。

很清楚这一行:

browser.actions().mouseMove(chartsMenuBtn).perform().then(
执行

,因为我可以看到chartsMenuBtn元素在浏览器中突出显示。但由于某种原因,脚本似乎永远不会执行该行:

chartsMenuBtn.click().then(

如果有,我希望浏览器导航到Charts页面(就像我手动点击chartsMenuBtn元素一样。

DEFAULT_TIMEOUT_INTERVAL中的jasmine.js设置为35秒,其中包含:

j$.DEFAULT_TIMEOUT_INTERVAL = 35000;

我尝试增加它的价值,但这没有任何区别 - 测试仍然在同一个地方超时,出于同样的原因,这表明我还有其他原因导致此测试失败/超时。

有没有人有任何建议我如何解决这个问题?

修改

所以我改变了我的脚本,为测试添加了一些调试(在调用chartsMenuBtn.click().then(之前和之后打印语句,看看这行是否实际运行,当我现在运行我的测试时,我可以在命令行中看到这两个打印语句:

  

开始

     

...警报页面测试已完成

     

。启动图表页面测试

     

光标悬停在chartsMenuBtn

上      

调用chartsMenuBtn.click()执行

     

FA Jasmine规范超时。重置WebDriver控制流程。

     

茉莉花规格超时。重置WebDriver控制流程。

     

启动最终标记浏览器页面测试

     

单击“标记浏览器”菜单按钮

     

结束标记浏览器页面测试(然后调用)

     

我添加的两个调试行是:

  

光标悬停在chartsMenuBtn

上      

调用chartsMenuBtn.click()执行

我在调用的任一侧添加了这些调试行:

chartsMenuBtn.click().then(

所以很明显这条线正在运行,但由于某种原因,点击似乎没有注册,或者点击这个元素的结果实际上并没有执行所需的&安培;预期的行动。

对此为何的任何建议?

修改

所以我已经设法在这方面取得了一些进展,虽然它还没有按照我的意图/希望工作......我通过拨打电话稍微修改了测试脚本在chartsMenuBtn.click()电话中browser.actions(),将多个承诺链接在一起:

it('should navigate to the Charts page', function() {
    console.log("Start Charts page test ");
    browser.waitForAngularEnabled(false);
    browser.wait(EC.presenceOf(chartsMenuBtn), 5000).then(
        browser.actions().mouseMove(chartsMenuBtn).perform().then(
            browser.actions(console.log("Cursor hovering over chartsMenuBtn ")).perform().then(
                browser.actions(chartsMenuBtn.click()).perform().then(
                    browser.actions(console.log("Call to chartsMenuBtn.click() performed ")).perform().then(
                        function(){
                            expect(EC.visibilityOf(closeDlgBtn).call()).toBeTruthy();
                        }
                    )
                )
            )
        )
    )
})

当我现在再次运行我的脚本时,我只得到一次失败 - 这似乎是由于在之前运行的一个测试过程中打开的其中一个对话框上设置的动画相关时间引起的进行这项测试。

错误说明:

  

失败:未知错误:元素...在点(40,229)处无法点击。其他元素将收到点击:

<div tabindex="-1" role="dialog" class="modal fade ng-isolate-scope ult-loading modal-message ng-animate in-remove in-remove-active" ng-class="{in: animate}" ng-style="{'z-index': 1050 + index*10, display: 'block'}" ng-click="close($event)" modal-window="" window-class="ult-loading modal-message" size="sm" index="0" animate="animate" style="z-index: 1050; display: block;; transition-property: opacity;transition-duration: 0.15s;">...</div>
  
 (Session info: chrome=62.0.3202.89)

 (Driver info: chromedriver=2.33.506120 (e3e53437346286c0bc2d2dc9aa4915ba81d9023f),platform=Windows NT 10.0.16299 x86_64)
  

我尝试将我的测试的expect子句放在browser.wait()中,等待closeDlgBtn元素在运行之前出现(但是我的期望是按钮元素)是可见的,这看起来有点多余......):

function(){
    browser.wait(EC.presenceOf(closeDlgBtn), 5000).then(
        expect(EC.visibilityOf(closeDlgBtn).call()).toBeTruthy();
    )
}

但是这给了我一个语法错误,指出该行上缺少)

 expect(EC.visibilityOf(closeDlgBtn).call()).toBeTruthy();

我无法在该行的任何地方看到丢失的)。谁能发现我在这里做错了什么?

修改

我还尝试通过调用browser.actions(chartsMenuBtn.click()).perform().then(来调用browser.wait(EC.elementToBeClickable()),以便在点击之前等待该元素可点击(而不是等待它存在):

browser.wait(EC.elementToBeClickable(chartsMenuBtn), 5000).then(
    browser.actions(chartsMenuBtn.click()).perform().then(
        browser.actions(console.log("Call to chartsMenuBtn.click() performed ")).perform().then(
            function(){
                expect(EC.visibilityOf(closeDlgBtn).call()).toBeTruthy();
            }
        )
    )
)

但由于某种原因,我仍然得到同样的错误:

  

失败:未知错误:元素...在点(40,229)处无法点击。其他元素将收到点击:

没有意义 - 因为在点击之前它应该等待元素可点击......?

修改

所以,我看了Protract API上的actions,看来我一直在纠正这些承诺。我将测试脚本更改为:

it('should navigate to the Charts page', function() {
    console.log("Start Charts page test ");
    browser.waitForAngularEnabled(false);
    browser.wait(EC.elementToBeClickable(chartsMenuBtn), 5000).then(
        browser.actions().
            mouseMove(chartsMenuBtn).
            //console.log("Cursor hovering over chartsMenuBtn").
            chartsMenuBtn.click().
            //console.log("Call to chartsMenuBtn.click() performed").
            browser.wait(EC.urlIs(VM + '/#/charts'), 5000).
            //console.log("browser.wait called- URL should now be VM + /#/charts/ ").
            perform()
    );
})

这似乎已经解决了“不可点击的”元素。问题。但是,我现在得到另一个错误:

  

失败:无法阅读属性&#39;点击&#39;未定义的

chartsMenuBtn已定义为:

var chartsMenuBtn = element(by.linkText("Charts"));

有人有任何建议吗?

0 个答案:

没有答案