时间戳

首页 > 解决方案 > 在组件上测试 rxjs get 方法（服务）

javascript - 在组件上测试 rxjs get 方法（服务）

问题描述

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

  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'

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

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

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

标签： javascriptangularunit-testingjasmineangular6

解决方案

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

推荐阅读