单击表中的列 - 量角器

Question

我在 HTML 中有相当大的 compelx TABLE，我需要点击第一行：

<div class="ui-grid-canvas"> //this is whole table
 <div ng-repeat="(rowRenderIndex, row) in rowContainer.renderedRows track by $index" class="ui-grid-row ng-scope" ng-style="containerCtrl.rowStyle(rowRenderIndex)" ng-class="{'ui-grid-row-selected': row.isSelected}" style="margin-top: 0px;"> //this is one line
   <div ui-grid-row="row" row-render-index="rowRenderIndex" class="ng-isolate-scope"> //this is blanked part (740x0px)
    <div ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.colDef.name" class="ui-grid-cell ng-scope ui-grid-col0 ui-grid-row-header-cell" ng-class="{ 'ui-grid-row-header-cell': col.isRowHeader }" ui-grid-cell="">
     <div class="ui-grid-disable-selection ng-scope"> //stil first column
      <div class="ui-grid-cell-contents"> //stil first column
       <div class="ui-grid-selection-row-header-buttons ui-grid-icon-ok ng-scope" ng-class="{'ui-grid-row-selected': row.isSelected}" ng-click="selectButtonClick(row, $event)">&nbsp;</div> //clickable part of first element.

看起来像这样我需要点击第 20 行，21,22 有人可以帮助我吗？

我尝试使用类似的东西：

element(by.css('.ui-grid-canvas').row(22)).element(by.css('[ng-click="selectButtonClick(row, $event)"]')).click();

但我得到错误：

r(".ui-grid-canvas") has no method 'row'

请问有人可以帮我解决这个问题吗？

编辑： 代码屏幕：

Answer 1

将element.all() 与by.repeater() 一起使用：

element.all(by.repeater('(rowRenderIndex, row) in rowContainer.renderedRows')).then(function(arr) {
  arr[20].all(by.css('[ng-click^=selectButtonClick]')).first().click();
});

您可能还需要在点击之前滚动到元素：

var scrollIntoView = function () {
    arguments[0].scrollIntoView();
}

element.all(by.repeater('(rowRenderIndex, row) in rowContainer.renderedRows')).then(function(arr) {
    var row = arr[20];
    browser.executeScript(scrollIntoView, row.getWebElement()).then(function () {
        row.all(by.css('[ng-click^=selectButtonClick]')).first().click();
    });
});

另见：

• How to get iterator index/key using protractor + angular?