Question

我正在试图弄清楚如何在下面使用以下view.html，并测试列和行位置（.col，.row）是否为第一个元素/ tile。

<div class="container" gridster="gridsterOpts">
        <ul>
            <li>
                <tile tilevalue="{{tile.tileId}}" gridster-item="tile" row="{{tile.row}}" col="{{tile.col}}" size-x="{{tile.sizeX}}" size-y="{{tile.sizeY}}" ng-repeat="tile in selectedTiles"/>
            </li>
        </ul>
    </div>

有什么想法可以做到这一点？我不知道如何使用转发器调用，我想这就是解决方案的来源。

Answer 1

由于这是一个特定于量角器的问题 - 您可以使用内置的by.repeater() locator并获取first()元素：

var firstTile = element.all(by.repeater("tile in selectedTiles")).first();

然后，要获取row和col属性值，请使用getAttribute()：

firstTile.getAttribute("row").then(function (row) {
    console.log(row);
});
firstTile.getAttribute("col").then(function (col) {
    console.log(col);
});

或者，如果要断言值：

expect(firstTile.getAttribute("row")).toEqual("0");
expect(firstTile.getAttribute("col")).toEqual("0");

Answer 2

Angular中的ng-repeat调用只会生成相应的html来显示相关信息。因此，您的ElementFinder（或ElementFinders）只需要使用ByCss选择所需的行col。

请参阅w3schools的示例并检查结果。 http://www.w3schools.com/angular/tryit.asp?filename=try_ng_repeat_array

您将看到以下角度代码

<ul>
  <li ng-repeat="x in names">
    {{ x }}
  </li>
</ul>

创建此html：

<ul>
  <!-- ngRepeat: x in names -->
  <li class="ng-binding ng-scope" ng-repeat="x in names">Jani</li>
  <!-- end ngRepeat: x in names -->
  <li class="ng-binding ng-scope" ng-repeat="x in names">Hege</li>
  <!-- end ngRepeat: x in names -->
  <li class="ng-binding ng-scope" ng-repeat="x in names">Kai</li>
  <!-- end ngRepeat: x in names -->
</ul>

所以你的ElementFinder将是：

element(by.Css('ul li'));

或

element(by.Css('ul li tile'));

如何编写一个Protractor测试，找到'ng-repeat'中的第一个元素？

2 个答案: