统计满足 By.css() 的元素个数

Question

我在做简单的测试：

 <span *ngFor="let p of products" class="a">{{p.name}}</span>

有 3 个产品，导致创建 3 个 span 元素。使用 By.css():

时如何获得该计数

  it(":", () => {
    let de = fixture.debugElement.query(By.css(".a"));
    fixture.detectChanges();
     //  let el = de.nativeElement;
    expect('number of span elements created').toEqual(component.products.legnth);
  });

Answer 1

您应该使用 fixture.debugElement.queryAll 而不是 fixture.debugElement.query。
所以测试看起来像

 it(":", () => {
    fixture.detectChanges();
    const spans = fixture.debugElement.queryAll(By.css(".a"));
    const spansLength = spans.length;
    expect(spansLength).toEqual(component.products.legnth);
  });

可以找到queryAll方法的描述here

统计满足 By.css() 的元素个数

Count number of elements satisfied with By.css()

jasmine

angular