Angular w/Jasmine和Karma测试模拟服务

我想使用Jasmine/Karma来测试一个模拟服务，而不知道真正的服务。问题是，它希望我添加来自真实服务的所有依赖项，如HttpErrorHandler和MessageService

这是下面的实际服务代码：

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { catchError } from 'rxjs/operators';
import { httpOptions } from '../http-options';
import { HttpErrorHandler, HandleError } from '../http-error-handler.service';
//
@Injectable({ providedIn: 'root' })
export class AboutService {
  private handleError: HandleError;

  constructor(
    private http: HttpClient,
    httpErrorHandler: HttpErrorHandler
    ) {
    this.handleError = httpErrorHandler.createHandleError('AboutService');
  }

  // Skills
  ////////
  getSkills() {
    const url = 'path';

    return this.http.get<any>(url, httpOptions)
      .pipe(
        catchError(this.handleError('getSkills', []))
      );
  }

}

从'@angular/core'导入{Injectable}；
从'@angular/common/http'导入{HttpClient}；
从“rxjs/operators”导入{catchError}；
从“../http选项”导入{httpOptions}；
从“../http error handler.service”导入{HttpErrorHandler，HandleError}；
//
@可注射（{providedIn:'root'}）
导出类AboutService{
私有handleError：handleError；
建造师(
私有http:HttpClient，
httpErrorHandler:httpErrorHandler
) {
this.handleError=httpErrorHandler.createHandleError（'AboutService'）；
}
//技巧
////////
getSkills（）{
常量url='路径'；
返回此.http.get（url，httpOptions）
.烟斗(
catchError（this.handleError（'getSkills'，[]））
);
}
}

还有我。规范文件

import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { AboutComponent } from './about.component';
// 
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';// Other imports
import { AboutService } from './about.service';
// import { HttpErrorHandler } from '../http-error-handler.service';
// import { MessageService } from '../message.service';
// import { MaterialModule } from "../material/material.module";

class MocksService extends AboutService{
  // getSkills() {
  //     return [someRandomArray];
  // }
}

describe('AboutComponent', () => {
  let component: AboutComponent;
  let fixture: ComponentFixture<AboutComponent>;
  // 
  let httpTestingController: HttpTestingController;
  let service: AboutService;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ AboutComponent ],
      imports: [ HttpClientTestingModule, MaterialModule ], 
      providers: [ 
        { AboutService, useClass: MocksService },
        // HttpErrorHandler,
        // MessageService
      ]
    })
    .compileComponents();

    // 
    httpTestingController = TestBed.get(HttpTestingController);
    service = TestBed.get(AboutService);

  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(AboutComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

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

  it('should be created', () => {
    const service: AboutService = TestBed.get(AboutService);
    expect(service).toBeTruthy();
  });

});

从'@angular/core/testing'导入{async，ComponentFixture，TestBed}；
从“./about.component”导入{AboutComponent}；
// 
从“@angular/common/http/testing”；/”导入{HttpClientTestingModule，HttpTestingController}其他进口
从“./about.service”导入{AboutService}；
//从“../http error handler.service”导入{HttpErrorHandler}；
//从“../message.service”导入{MessageService}；
//从“./material/material.module”导入{MaterialModule}；
类MocksService扩展了AboutService{
//getSkills（）{
//返回[someRandomArray]；
// }
}
描述（'AboutComponent'，（）=>{
let组件：关于组件；
let夹具：组件夹具；
// 
设httpTestingController:httpTestingController；
让服务：关于服务；
beforeach（异步（（）=>{
TestBed.configureTestingModule({
声明：[关于组件]，
导入：[HttpClientTestingModule，MaterialModule]，
提供者：[
{AboutService，useClass:MocksService}，
//HttpErrorHandler，
//消息服务
]
})
.compileComponents（）；
// 
httpTestingController=TestBed.get（httpTestingController）；
service=TestBed.get（关于服务）；
}));
在每个之前（（）=>{
fixture=TestBed.createComponent（关于组件）；
组件=fixture.componentInstance；
fixture.detectChanges（）；
});
它（'应该创建'，（）=>{
expect（component.toBeTruthy（）；
});
它（'应该创建'，（）=>{
const-service:AboutService=TestBed.get（AboutService）；
expect（service.toBeTruthy（）；
});
});

您只需注入它并创建spy来模拟您试图模拟/测试的任何东西：

const aboutService = TestBed.inject(AboutService);

const spy = spyOn(aboutService, 'getSkills').and.returnValue(of({...});
...
expect(spy).toHaveBeenCalled();

---

我是新来的。你能给我更多的代码吗，这样我就能理解它的用途了。是的，你可以把整个代码块放到你的

it（…）

函数（或规范）中。可以选择将服务器ICE注入移动到每个方法之前的

中，以遵循与
夹具
和
组件
相同的模式，但这取决于您自己。