使用 createSpyObj 对可观察量进行单元测试

phy*_*boy 2 unit-testing mocking spy typescript angular

我有一个函数调用另一个本身使用 http 订阅的函数,但我在测试它时遇到了麻烦...

我的组件

id = 1;

myFunct() {
  this.myService.delete(this.id);
}
Run Code Online (Sandbox Code Playgroud)

我的服务

delete(id) {
  this.http.delete(this.myUrl + '/' + id).subscribe()
}
Run Code Online (Sandbox Code Playgroud)

测试

let mockService;

beforeEach(() => {
  TestBed.configureTestingModule({
    mockService = createSpyObj(['delete']);

    imports: ...,
    declarations: ...,
    providers: [
      {provide: MyService, useValue: mockService}
    ]
  }).compileComponents();

  fixture = ...;
  component = ...;
  fixture.detectChanges();
});

it('should test delete', () => {
  mockService.delete.and.returnValue({ subscribe: () => {} });
  component.myFunct();
  expect(mockService.delete).toHaveBeenCalledTimes(1);
});
Run Code Online (Sandbox Code Playgroud)

我的测试返回了错误:

无法读取未定义的属性“订阅”

小智 5

常见的模式是从服务方法返回 observable 并在内部订阅,例如。成分。

像这样的东西:

我的组件

 id = 1;

 myFunct() { 
    this.myService.delete(this.id).subscribe( 
     (result) => console.log(result),
     (error) => console.log(error)
 };
Run Code Online (Sandbox Code Playgroud)

我的服务

 delete(id): Observable<any> {
   this.http.delete(this.myUrl + '/' + id)
 }
Run Code Online (Sandbox Code Playgroud)

测试

imports {of} from 'rxjs'

let mockService;

beforeEach(() => {
  TestBed.configureTestingModule({
    mockService = createSpyObj(['delete']);

    imports: ...,
    declarations: ...,
    providers: [
      {provide: MyService, useValue: mockService}
    ]
  }).compileComponents();

  fixture = ...;
  component = ...;
  fixture.detectChanges();
});

it('should test delete', () => {
  mockService.delete.and.returnValue(of({id: 1}));
  component.myFunct();
  expect(mockService.delete).toHaveBeenCalledTimes(1);
});
Run Code Online (Sandbox Code Playgroud)