protractor - 如何选择所有没有子级的元素？

Question

我正在使用 Protractor 对 Angular 2 应用程序进行端到端测试(我不擅长 CSS)。

我一直在尝试选择所有元素，这些元素没有具有特定类的 (div) 子元素。他们可以有 div child ，只是没有那个类(class)。

单个元素看起来(或多或少)像这样:

<div class="card"
     (click)="clickEvent.emit(generator.id)">

    <div id="card-title-anchor">

        <div class="card-img-top">
             <img src="{{generator.imageUrls.small}}">
        </div>

        <div *ngIf="!canFulfillAAC()" class="sold-overlay">
            <p>bla</p>
        </div>                  

        <div class="col-3 price-overlay">
            <p class="big-price">
                bla
            </p>    
        </div>
    </div>
</div>

我可以使用 element.all(by.css('.card')) 获取所有“.card”元素。

但是我如何才能只得到那些不包含带有 sold-overlay 类的子 div 的呢？

编辑:我删除了 css 标签。我主要关心如何使用 Protractor 定位器实现此目的 - 无论是通过 css 选择器、xpath 表达式还是其他方式。

Answer 1

你也可以使用filter()方法来实现，

element.all(by.css(".card")).filter(function(cardElement){
    return cardElement.all(by.css(".sold-overlay")).count().then(function(count){
        return count == 0;
    });
});