在组件上测试 rxjs get 方法（服务）答案

【问题标题】：Testing an rxjs get method(service), on the component在组件上测试 rxjs get 方法（服务）
【发布时间】：2019-01-27 11:32:19
【问题描述】：

服务上的函数调用是这样的。

  get getLayerToEdit(): BehaviorSubject<VectorLayer> {
    return this.layerToEdit;
  }

然后像这样在 ngOnInit 上调用它。

  ngOnInit() {
    this.annoService.getLayerToEdit.subscribe((layerToEdit: any) => {
        this.layer = layerToEdit;
        this.layerId = layerToEdit.ol_uid;
    });

因此，在我的测试中，我很自然地想看看 component.layer 是否与该服务返回的内容相匹配。

测试文件

  let component: EditFeatureComponent;
  let fixture: ComponentFixture<EditFeatureComponent>;
  let mockAnnoService = jasmine.createSpyObj(['getLayerToEdit', 'getCurrentAction', 'setCurrentAction']);
  let layer;

每个代码块之前的第一个

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [EditFeatureComponent],
      imports: [FormsModule, HttpClientModule],
      providers: [
        { provide: AnnotationService, useValue: mockAnnoService}
      ],
      schemas: [CUSTOM_ELEMENTS_SCHEMA]
    })
      .compileComponents();
  }));

  beforeEach(() => {
    // Fields required for the component
    layer = {
      layerName: 'testLayer',
      ol_uid: 1
    }
    // Create the testbed
    fixture = TestBed.createComponent(EditFeatureComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

然后是实际测试

  it('Should return a layer object and have a ol_uid of 1', ()=>{
    mockAnnoService.getLayerToEdit.and.returnValue(of(layer))
    fixture.detectChanges();
    expect(component.layer).toBe(layer);
  })

测试返回'this.annoService.getLayerToEdit.subscribe is not a function'

我也尝试过使用 subscribe 而不是 of。

mockAnnoService.getLayerToEdit.and.returnValue({ subscribe: () => {} })

我对测试知之甚少，但这是我通常用来测试服务的方法，但这是我第一次从服务测试“get”方法，所以我假设我在某个地方出错了.

【问题讨论】：

标签： javascript angular unit-testing jasmine angular6

【解决方案1】：

你的 mockAnnoService.getLayerToEdit 是 getter 所以你不能使用 jasmine.createSpyObj 模拟它，因为它只模拟方法以这种方式。您需要创建普通对象而不是模拟对象，并将所需数据的可观察对象分配给 getLayerToEdit 字段。希望对您有所帮助。

【讨论】：

不确定我是否遵循，我尝试在第二个 beforeEach 块中添加 mockAnnoService.getLayerToEdit.and.returnValue(of({})) ，这会产生相同的结果。尝试在 BE 中而不是在我的实际测试中调用该函数似乎也很奇怪？
在beforeEach的开头？
好的，删除它然后尝试从你的 beforeEach 函数中删除 fixture.detectChanges();
还是一样的结果，也尝试调用component.ngOnInit而不是检测变化：/
好吧，最后猜猜，我假设 jasmine.createSpyObj(['getLayerToEdit', 'getCurrentAction', 'setCurrentAction']); 只创建方法，但 getLayerToEdit 是吸气剂