Karma Jasmine 单元测试错误："Expected spy VehicleId to have been called"

Question

能否请您帮我解决以下问题。我对 Angular 和单元测试还很陌生。服务未返回承诺。

Error: Expected spy fetchVehicleId to have been called.

组件代码片段：

async getVehicleId() {
  debugger; 
  try {          
    if(this.selectedId) {
        let data: any = await this.VehicleComposer.fetchVehicleId(this.selectedID); 
        this.vehicleQuantity = data.vehicleCaseQuantity;
        this.vehicleId = data.vehicleId; 
        console.log("return service data",data);
      } 
   }
   catch (err) {
     console.log(err)
   }
}

服务编排代码片段：

fetchVehicleId(selectedID) {       
    let center = this.user.getCenterId();    
    let vehicleURL = this.config.getReceiveVehicleURL(selectedID.Id,selectedID.Number,center);
    return new Promise((resolve, reject) => {
        this.api.put(vehicleIdURL)
          .subscribe(
            data => {  
                this.receivingUnit = data.receivingUnitId;
                resolve(data);                   
            }, error => {
                reject({
                    error: true,
                    errorObj: error
                });
            });                             
        });        
    }

测试规范代码片段：

Class MockVehicleComposerService { 
  debugger;
  fetchVehicleId(){  
    console.log("---------"); 
    return Observable.of({}); 
  }
}

describe('VehicleComponent', () => {

  let comp: VehicleComponent;  
  let fixture: ComponentFixture<VehicleComponent>; 
  let mockService: MockVehicleComposerService;

  beforeEach(async(() => {

  mockService = new MockVehicleComposerService();

  TestBed.configureTestingModule({
    declarations: [VehicleComponent],
    imports: [IonicModule.forRoot(VehicleComponent)],
    providers: [{ 
        provide: ReceiveVehicleComposer, 
        useValue: MockVehicleComposerService
    }]
  })      
  .overrideComponent(VehicleComponent, {
    set: {
      template: '<div></div>',
      providers: [{
          provide: ReceiveVehicleComposer,
          useValue: MockVehicleComposerService
      }]
    }
  })
  .compileComponents();
}));


it('getVehicleId', async(() => {
  debugger;
  this.selectedID = { "Number":"123" }
  const app = fixture.componentInstance; 
  let messageSpy = spyOn(mockService, 'fetchVehicleId');
  if(this.selectedID){
    app.getVehicleId();
  }

  expect(messageSpy).toHaveBeenCalled();
}));

Answer 1

你快到了。只是缺少您实际上 return Observable 的部分。这是我过去的做法。希望这可以帮助您走上正轨。

it('getVehicleId', fakeAsync(() => {
  this.selectedID = { "Number":"123" }
  const app = fixture.componentInstance; 

  let messageSpy = spyOn(mockService, 'fetchVehicleId').and.returnVaue(
    Observable.of({});
  );

  if(this.selectedID){
    app.getVehicleId();
  }      

  fixture.detectChanges();

  expect(messageSpy).toHaveBeenCalled();
}));

Karma Jasmine 单元测试错误："Expected spy VehicleId to have been called"

Error in Karma Jasmine Unit testing : "Expected spy VehicleId to have been called"

angular

karma-runner

ionic3

angular-promise

karma-coverage