TypeError:ApplicationServiceMock.application $ .pipe不是函数

时间:2019-05-31 10:03:52

标签: angular unit-testing angular-test

我正在尝试对构造器中包含此组件的Angular 7组件进行单元测试

constructor(private store: ApplicationService) {
        this.store.application$.pipe(first()).subscribe(r => { this.application = r; });
    }

现在当我尝试测试时出现错误

TypeError: ApplicationServiceMock.application$.pipe is not a function

这就是我尝试测试的方式

const ApplicationServiceMock= mock(ApplicationService);

.....

when(ApplicationServiceMock.application$.pipe()).thenResolve(Observable.of(Applications.ApplicationServiceDummy));

.....

providers: [
                    { provide: ApplicationService, useFactory: () => ApplicationServiceMock}
                ],

我也尝试使用jasmine.spy,但是即使这样也无法正常工作,并引发完全相同的错误。我在这里做错了什么或想念什么?

1 个答案:

答案 0 :(得分:0)

我不知道mock的作用。但是我认为它只会为您的ApplicationService创建一个空包装器。您需要告诉您的间谍或模拟对象,它确实有一个名为application$的属性,该属性返回所有可观察到的东西。

因此,您将需要以下内容:

const applicationServiceMock = {
  application$: () => EMPTY
}

describe('AppComponent', () => {
    let component: AppComponent;
    let fixture: ComponentFixture<AppComponent>;

    beforeEach(async(() => {
        TestBed.configureTestingModule({
            declarations: [AppComponent],
            providers: [{provide: ApplicationService, useValue: applicationServiceMock}],
            schemas: [NO_ERRORS_SCHEMA]
        })
            .compileComponents();
    }));

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

    it('should be created', () => {
      fixture.detectChanges();
      expect(component).toBeTruthy();
    });
});

由于您正在访问组件的构造函数内部的observable,因此需要像我一样使用EMPTY或在模拟属性内部使用of(YOUR_TEST_VALUE_HERE)定义期望的Observable,因为构造函数在您之前被调用可以干预it块内。

如果您想使用spyOn,则需要将订阅代码从组件的构造函数移至ngOnInit生命周期挂钩。然后,您可以在测试中调用第一个Fixture.detectChanges()之前更改存根和spyOn