Question

有问题的列表是由反应性角度形式生成的表格，该表格没有特定的ID。以下代码用于生成有角部分的列表：

<p-table id='paragraphList' *ngIf="paragraphsObs | async; else loading"
         [value]="paragraphsObs | async"
         selectionMode="single" (onRowSelect)="select($event)"
         scrollable="true">
  <ng-template pTemplate="header">
    <tr> ...header... </tr>
  </ng-template>
  <ng-template pTemplate="body" let-paragraph let-rowData>
    <tr [pSelectableRow]="rowData">
      <td width="15%">{{paragraph.cell1}}</td>
      <td width="10%">{{paragraph.cell2}}</td>
      <td width="31%">{{paragraph.cell3}}</td>
      <td width="11%">{{paragraph.cell4 | dateTransform: helperService.MM_DD_YYYY_HH_MM_A_Z_DATE_PATTERN}}
      </td>
      <td width="11%">{{paragraph.cell5}}</td>
      <td width="11%">{{paragraph.cell6 | dateTransform: helperService.MM_DD_YYYY_HH_MM_A_Z_DATE_PATTERN}}
      </td>
      <td width="11%">{{paragraph.cell7}}</td>
    </tr>
  </ng-template>
</p-table>

在前端生成的相应表具有以下html源：

<p-table _ngcontent-c6="" id="paragraphList" scrollable="true" selectionmode="single" ng-reflect-selection-mode="single" ng-reflect-scrollable="true" class="ng-star-inserted" ng-reflect-value="[object Object],[object Object">
  <div class="ui-table ui-widget ui-table-hoverable-rows" ng-reflect-ng-class="[object Object]">
    <div class="ui-table-scrollable-wrapper ng-star-inserted">  
      <div class="ui-table-scrollable-view" ng-reflect-frozen="false">
        <div class="ui-table-scrollable-header ui-widget-header">...header...</div>
        <div class="ui-table-scrollable-body">
          <table class="ui-table-scrollable-body-table" ng-reflect-klass="ui-table-scrollable-body-table" ng-reflect-ng-class="[object Object]">               
            <tbody class="ui-table-tbody" ng-reflect-template="[object Object]">
              <tr _ngcontent-c6="" ng-reflect-data="[object Object]" class="ng-star-inserted">...</tr>
              <tr _ngcontent-c6="" ng-reflect-data="[object Object]" class="ng-star-inserted">...</tr>
               ...
            </tbody>
          </table>
          <div class="ui-table-virtual-scroller"></div>
        </div>
      </div>
    </div>
  </div>
</p-table>

我想了解这些内部元素并将它们作为列表获取。我尝试将类名与element和所有定位符一起使用，以获取元素，但无济于事。然后，我尝试使用标签名称来访问这些元素，但这似乎也不起作用。

下面的小片段为我尝试从列表中获取的元素计数返回0。

element(by.id('paragraphList')).element(by.css('.ui-table-scrollable-body-table'))
  .all(by.tagName('tr')).count().then(function (result) {
  console.log(result);
});

任何帮助将不胜感激。谢谢

Answer 1

上面考虑的是完整呈现的HTML。下面的代码将给出一个数组数组，其中每个数组将包含一行中所有单元格的文本。

说明：该代码具有三个功能， populateData()-是驱动功能，我们在其中传递已解决的rows列表。

然后_populateRows()和_populateCells()递归运行以从单元格中收集文本。这也可以通过循环来完成（因为量角器自己将诺言排队），但是我喜欢在事情的最后保持清楚。 _populateRows()在行上重复出现，_populateCells()在每行单元格上重复出现。（更多评论）

注意，在执行此操作之前，您应该做的第一件事是：检查count()的{{1}}（或.length的{{1}}）。基本上，这是我相信的原始问题。现在，如果您有足够的想法，那么您可以采用该解决方案或您需要的任何套件。

resolvedRows

如何在量角器e2e测试中从列表（表）中获取行？

1 个答案: