angularjs - Protractor 找不到之前已找到 2 个测试的元素

Question

第一个带 Protractor 的计时器。但是我遇到了麻烦。尝试测试一个元素是否存在，然后是否隐藏另一个元素，然后再次测试第一个元素是否可点击并且 boooooom...

Protractor 挂起响应 ElementNotVisibleError: Element is not currently visible and so may not be interacted with 而该元素已在之前的两个测试中被发现。可能我做错了什么，但是什么？

              describe( 'filters' , function () {                   

                    it ( 'has a .filter-editorial-rating .header' , function ( done ) {
                        element.all( by.css( '.filter-editorial-rating .header' ) )
                            .then( function ( el ) {
                                expect( el.length > 0).toEqual( true );
                                done();
                            });
                    });


                    it( 'ER filter is collapsed by default' , function ( done ) {

                        element.all( by.css ( '.filter-editorial-rating .content.ng-hide' ) )
                            .then( function (el) {
                                expect( el.length > 0).toEqual( true );
                                done();
                            });
                    });

                    it( 'ER filters header is clickable' , function ( done ) {
                        element( by.css( '.filter-editorial-rating .header' ) )
                                .click()   //  <--- hangs with error ElementNotVisibleError: Element is not currently visible and so may not be interacted with
                                .then( function ( el ) {
                                    done();
                                });
                    });
                });

还尝试将它包装在 element.all 中，就像我首先所做的那样(尝试 voodoo)，但感谢上帝，它没有用。 :)

我还尝试了getOuterHtml，发现该元素确实存在

这...

it( 'ER filters header is clickable' , function ( done ) {
    element( by.css( '.filter-editorial-rating .header' ) )
      .getOuterHtml()
      .then( function ( html ) {
        console.log( html );
        done();
      });
});

返回的是这个...

 <div class="header" ng-click="collapse.er = !collapse.er">
      <span class="icon icon_plus" ng-show="collapse.er"></span>
      <span class="icon icon_minus ng-hide" ng-show="!collapse.er"></span>

      <h4 class="title"> Star Rating </h4>
 </div>

Answer 1

好吧……我的错

在 onPrepare() 方法的 config.js 中设置窗口大小解决了这个问题。有一个媒体查询对该元素的容器进行了欺骗。

var width = 1024;
var height = 600;
browser.driver.manage().window().setSize(width, height);