量角器 - $http 调用后转发器中的 select 元素

Question

我开始对我的 sails.js / AngularJS 应用程序进行量角器测试。简化后，我的 HTML:

中有以下一种 ng-repeat

<div ng-repeat="book in books">
  book.name
</div>

我的测试单击一个按钮，向服务器发送 $http POST 调用，创建另一本书，成功后，将另一本书添加到 $scope.books。问题是测试失败了，因为当测试检查它是否存在时，这本书还没有被创建。我知道我的 locator/filter 有效，因为当运行再次测试时（= 在发送呼叫之前这本书已经存在）测试成功。

测试：

    element.all(by.buttonText('Save')).
        filter(function(elem) {return elem.isDisplayed();}).
        first().
        click();

    browser.sleep(500); // even this doesn't work :(

    element.all(by.repeater('book in books')).filter(function(elem, index) {
        return elem.getText().then(function(text) {
            return text === "nameOfBook";
        });
    })
    .then(function(books) {
        expect(books[0].isPresent()).toEqual(true);
    });

到目前为止，我运行的答案似乎表明量角器应该在继续之前自动等待 $http 调用完成，但在我的情况下似乎并非如此。

我什至尝试了 4000 毫秒左右的休眠时间，其中我已经可以在中继器中看到新元素，但测试仍然将 books[0] 视为 undefined。当运行再次测试时有效，所以问题不应该在过滤器中，而是在其他地方。

对此事有什么见解吗？

Answer 1

您可以 explicitly wait 将新书名显示在 DOM:

var EC = protractor.ExpectedConditions;

var elm = element(by.xpath("//div[. = 'nameOfBook']"));
browser.wait(EC.presenceOf(elm), 10000);

您还可以等待转发器中元素的数量增加：

var countOfElementsToBe = function(elms, expectedValue) {
  return elms.count().then(function (actualValue) {
      return expectedValue === actualValue;
  });
};

var books = element.all(by.repeater('book in books'));
books.count().then(function (booksCount) {
    browser.wait(countOfElementsToBe(books, booksCount + 1), 10000);
});

（未测试）

量角器 - $http 调用后转发器中的 select 元素

Protractor - select element in repeater after $http call

ajax

selenium

angularjs

protractor

sails.js