错误：<toHaveBeenCalled>：预期是间谍，但未定义

Question

我收到一个错误，预期 Spy，但在我的 Angular 10 测试中未定义。我正在使用 Jasmine 和 Karma。我已将服务 SpreadsheetService 模拟为 mockSpreadSheetService。我正在调用它的方法。我不明白为什么它期待一个间谍。

我能想到的一个可能的原因是 mockSpreadSheetService 在运行测试之前被创建，我们正在调用 component.ngOnit，这可能会重新创建组件实例。我尝试在 component.ngOnit 之后显式创建模拟服务，但它仍然没有工作。

我的问题理想情况下，我们应该在模拟对象上进行测试。为什么需要间谍。

expect(mockSpreadSheetService.loadXML).toHaveBeenCalled();

测试组件

 let component: SpreadsheetComponent;
  let fixture: ComponentFixture<SpreadsheetComponent>;
  let mockSpreadSheetService;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
        imports: [HttpClientTestingModule],
        declarations: [SpreadsheetComponent],
        providers: [{SpreadsheetService, useFactory: () =>   mockSpreadSheetService.Object}]
      })
      .compileComponents();
  }));

  beforeEach(() => {

    mockSpreadSheetService = new Mock<SpreadsheetService>({
      loadXML: () => of(xmlData)
    });

    fixture = TestBed.createComponent(SpreadsheetComponent);
    component = fixture.componentInstance;
    //fixture.detectChanges();

  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });

  it('should call loadXML when ngOnInit is called', fakeAsync(() => {
   // spyOn(component.spreadsheetService, 'loadXML');
    component.ngOnInit();
    tick();
    expect(mockSpreadSheetService.loadXML).toHaveBeenCalled();
  }));
});

主要组件

 ngOnInit(): void {
    this.spreadsheetService.loadXML().subscribe((data) => {
      this.parseXML(data)
        .then((data) => {
          console.log('data is ' , data);
          this.xmlItems = data;
        });
    });
  }

Answer 1

未正确创建间谍。

它的外观如下：

let component: SpreadsheetComponent;
  let fixture: ComponentFixture<SpreadsheetComponent>;
  let mockSpreadSheetService;

  beforeEach(async(() => {
    mockSpreadSheetService = jasmine.createSpyObj(['loadXML']);
    mockSpreadSheetService.loadXML.and.returnValue(of());

    TestBed.configureTestingModule({
      imports: [HttpClientTestingModule],
      declarations: [SpreadsheetComponent],
      providers: { provide: SpreadsheetService, useValue: mockSpreadSheetService }
    });

    fixture = TestBed.createComponent(SpreadsheetComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();

  }));

  it('should create', () => {
    expect(component).toBeTruthy();
  });

  it('should call loadXML when ngOnInit is called', () => {
    component.ngOnInit();
    expect(mockSpreadSheetService.loadXML).toHaveBeenCalled();
  });
});