从要使用Protractor测试的服务器异步加载的动态数据列表的列表

List of dynamic data lists loaded asynchronously from server to be tested with Protractor

本文关键字：列表 异步 加载 数据 服务器 动态 Protractor 测试      更新时间：2023-09-26

我有一个由列表列表组成的布局。

在用户单击的每一行上，都会从服务器中检索其子列表，并显示一些信息，其中包括货币数量。

我如何对所有列表项<ul> -> <li>和每个元素块进行迭代，或者等待数据被检索和呈现，以便测试呈现的数量是否正确？

当然，所有这些都使用protractor。

以前尝试过使用类似的东西：

var listItemsSelection       = element.all(by.css('.listItem')),
    listItemsExpandSelection = element.all(by.css('.icons-Expand'));
describe('Data screen - Rows', function () {
  //Given
  beforeEach(function () {
    for (var i = 0; i < listItemsExpandSelection.count(); i++) {
      listItemsExpandSelection.get(i).click();
      browser.wait(function() {
        return browser.isElementPresent(elm);
      }, 500);
    }
  });
  it('Element exist and is informed properly', function () {
    listItemsExpandSelection.each(function (el) {
      var elm = el.element(by.css(".amountCell"));
      expect(el.element(by.css('amountCell'))).toBe('5,50 €');
    });
  });
});

通过执行：

listItemsExpandSelection.each(function (element, index) { element.click(); });

这是迭代选择的另一种方式，我得到一个错误，如："未知错误：未知错误：元素在点（941524）不可点击。其他"。因为，在每个单击的行上，都会检索并显示新数据，所以下一个同级数据会被向下推一点，因此不可单击。

HTML片段如下：

当第一行仍未点击时：

<ul>
  <li class="listItem"><i class="icons-Expand"></i></li>
  <!-- n elements -->
</ul>

点击并等待几毫秒后：

<ul>
  <li class="listItem">
    <i class="icons-Expand"></i>
    <ul>
      <li class="listSubItem"></li>
      <!-- n sub-elements -->
    </ul>
  </li>
  <!-- n elements -->
</ul>

有什么想法吗？

我认为您应该单击li元素并等待子列表出现：

var EC = protractor.ExpectedConditions;
listItemsSelection.each(function (el) {
    el.click();
    browser.wait(EC.presenceOf(el.element(by.css("li.listSubItem"))), 10000);
    // make expectations
});
相关文章：