时间戳

首页 > 解决方案 > 预期的间谍被调用一次。被调用 0 次

angular - 预期的间谍被调用一次。被调用 0 次

问题描述

我是 Jasmine 的新手。我正在编写一个 UT 来检查是否在 ngAfterViewInit 函数中调用了服务。

下面是我的测试代码

describe('HomePage', () => {
  let component: HomePage;
  let fixture: ComponentFixture<HomePage>;
  let service:DataloadService;
  let srvSpy:any;
  let compoSpy:any;
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ HomePage ],
      imports: [
        HttpClientTestingModule,
        IonicModule.forRoot()]
    }).compileComponents();

    fixture = TestBed.createComponent(HomePage);
    component = fixture.componentInstance;
  }));
   it('getData method should be called on Init',()=>{
      srvSpy=jasmine.createSpy('getData').and.callThrough();  
      expect(srvSpy).not.toHaveBeenCalled();
      component.ngAfterViewInit();
      expect(srvSpy).toHaveBeenCalledTimes(1);

  });

});

每次我运行脚本时，测试都会失败，给我错误

预计间谍已被调用一次。它被调用 0 次

我该如何解决这个问题？

更新：

import { Component, OnInit, AfterViewInit } from '@angular/core';
import { from } from 'rxjs';
import {DataloadService} from '../services/dataload.service';
@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage implements AfterViewInit {
  value:any;
  constructor(private srv:DataloadService) {}
  ngAfterViewInit(){
    this.srv.getData().subscribe(
      res=>{
        this.value=res;
        console.log(this.value);
      }
    )
  }
}

标签： angularunit-testingjasminekarma-jasminekarma-runner

解决方案

尝试做这样的事情。

我很惊讶 Angular 测试平台没有抱怨，因为您没有注入 DataloadService

import { of } from 'rxjs';
.....
describe('HomePage', () => {
  let component: HomePage;
  let fixture: ComponentFixture<HomePage>;
  let service:DataloadService;
  let mockDataLoadService = jasmine.createSpyObj('srv', ['getData']); // add this line to mock the dataLoadService with public method of getData
  let srvSpy:any;
  let compoSpy:any;
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ HomePage ],
      imports: [
        HttpClientTestingModule,
        IonicModule.forRoot()],
      // stub out the real implementation of DateLoadService with our mock
      providers: [{ provide: DataLoadService, useValue: mockDataLoadService }],
    }).compileComponents();

    // make getData return Observable of 'hello world', it is up to you what you would like to return
    mockDataService.getData.and.returnValue(of('hello world'));
    fixture = TestBed.createComponent(HomePage);
    component = fixture.componentInstance;
  }));
   // change the title of the test
   it('value should be changed on ngAfterViewInit', ()=>{
      component.ngAfterViewInit();
      expect(component.value).toBe('hello world'); // assert that it went inside of the subscribe block and made component.value to 'hello world'

  });

});

推荐阅读