1

我正在为我的功能编写 jasmine-marble 测试,一切正常,但未返回创建的冷可观察对象:以下是 HTML 代码:

<ul class="list-group">
    <li *ngFor="let product of tempProductList; let i = index" id="{{'product_'+i}}" class="list-group-item">{{product.title }} <span class="badge">{{product.price}}</span></li>

  </ul>

返回数据的服务方法:

 public getProductList():Observable<any> {
       return interval(1000).pipe(
        take(PRODUCT_LIST.length),
        map(i => PRODUCT_LIST[i])
      );;
  }

获取数据的组件方法:

 getProductData(){
    this.sub = this.marbaleTestService.getProductList().subscribe((products)=>{
      this.tempProductList = products;
    },
    (error) =>{
      this.isPresent = true;
    });
  }

在给定的 spec 函数中,我收到了错误,在 it 函数中错误来自 liElement,但真正的原因是使用 spy 对象返回的 observable 始终未定义。

fdescribe('MarbleTestComponent', () => {
  let component: MarbleTestComponent;
  let fixture: ComponentFixture<MarbleTestComponent>;
  let mSpy: jasmine.Spy;
  let mockList = mockProductList;

 beforeEach(() => {
  const marbleService = jasmine.createSpyObj('MarbleTestService', ['getProductList']);
  mSpy = marbleService.getProductList;

    TestBed.configureTestingModule({
      declarations: [MarbleTestComponent],
      providers: [{ provide: MarbleTestService, useValue: marbleService }]
    }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(MarbleTestComponent);
    component = fixture.componentInstance;
  });


  it('[Marble - cold] - should list products after getProductList ', () => {

    let p$ = cold('p1-p2-p3|', { p1: mockList[0], p2: mockList[1], p3: mockList[2] });
    console.log(p$);
    ***mSpy.and.returnValue(p$);***

    component.getProductData();
    fixture.detectChanges();
   getTestScheduler().flush();
    fixture.detectChanges();


    expect(mSpy).toHaveBeenCalled();

     const liElement = fixture.debugElement.queryAll(By.css('.list-group-item'));

    console.log(liElement.length);

    expect(liElement[0].nativeElement.innerText).toContain(mockList[0].title);
    expect(liElement[1].nativeElement.innerText).toContain(mockList[1].title);
    expect(liElement[2].nativeElement.innerText).toContain(mockList[2].title); 
  });

});

我想要做的是获取使用cold()方法创建的observable,并使用使用createSpyObj函数创建的spy对象返回它,但是observable没有返回到组件中的调用函数或者存在其他问题。我花了几个小时寻找这个但没有找到合适的答案或正确的解决方案。

4

0 回答 0