javascript - 使用 Protractor 测试无限滚动

Question

我不认为这是严格的无限滚动，但与我所看到的相比，这是我能想到的最好的。

无论如何，我们正在使用 ng-grid 在表格中显示数据。我们大约有 170 个项目(行)要显示。当我们使用 ng-grid 时，它会创建一个转发器。当我从浏览器检查这个中继器时，它限制为 35 个项目，并且当您向下滚动列表时，您开始丢失 dom 的顶部行，并且在底部添加新行等(因此我不认为它的原因严格无限滚动，因为这通常只会增加更多行)

我很清楚，无论您向下滚动多远，dom 中总是有 35 个 'ng-repeat=row in rendered rows' 元素。

这在测试之前非常棒。我需要获取列表中每个项目的文本，但使用 element.all(by.binding('item.name')) 或 by.repeater 或 by.css 无济于事，因为页面上只有 35 个项目。

现在回答我的问题，我怎样才能将所有 170 个项目作为一个对象获取，然后我可以遍历该对象以获取其中的文本并将其存储为一个数组？

在我们少于 35 个项目的其他页面上，iv 只是使用绑定(bind)创建一个对象，然后使用 async.js 遍历每一行并获取文本(参见下面的示例，它是修改后的提取物我知道)可能不会这样，只是给你引用)

           //column data contains only 35 rows, i need all 170.     
       var columnData = element.all(by.binding('row.entity.name'))
         , colDataTextArr = []
            //prevOrderArray gets created elsewhere
         , prevOrderArray = ['item1', 'item2'... 'item 169', 'item 170'];      

       function(columnData, colDataTextArr, prevOrderArray){
         columnData.then(function(colData){
            //using async to go over each row
           async.eachSeries(colData, function(colDataRow, nRow){
              //get the text for the current async row
             colDataRow.getText().then(function(colDataText){
               //add each rows text to an array
               colDataTextArr.push(colDataText);
               nRow()
             });
           }, function(err){
             if(err){
               console.log('Failed to process a row')
             }else{
               //perform the expect 
               return expect(colDataTextArr).toEqual(prevOrderArray);
             }
           });
         });
       }

顺便说一句，我知道遍历 170 行并将文本存储在数组中效率不高，所以如果有更好的方法，我愿意接受建议。

我对 JavaScript 和 Web 测试还很陌生，所以如果因为我使用了错误的术语或其他原因而无法理解，请告诉我，我会尝试更清楚地解释。

Answer 1

我认为测试网格中的所有行有点矫枉过正。我想测试您是否获得前几行的值就足够了，然后，如果您绝对需要测试所有元素，请使用 evaluate()。

http://angular.github.io/protractor/#/api?view=ElementFinder.prototype.evaluate

很遗憾，api 页面中没有代码片段，但它看起来像这样:

// Grab an element where you want to evaluate an angular expression
element(by.css('grid-selector')).evaluate('rows').then(function(rows){
  // This will give you the value of the rows scope variable bound to the element.
  expect(rows[169].name).toEqual('some name');
});

让我知道它是否有效。