Angular 2 单元测试准备模拟以共享组件答案

【问题标题】：Angular 2 Unit Testing prepare mocking to share in componentsAngular 2 单元测试准备模拟以共享组件
【发布时间】：2017-01-06 08:42:42
【问题描述】：

我正在我的 Angular2 应用程序中进行单元测试，并且对 angular2 测试框架非常陌生。

我有 2 个组件并从服务调用相同的方法。

首先，我需要导入服务和模型来创建模拟

import { MyService } from '../../shared/my.service';
import { MyModel } from '../../shared/my.model';

其次，安排模型和服务模拟

describe('MyComponent', () => {
  let component: MyComponent;
  let fixture: ComponentFixture<MyComponent>;
  const mockMyModel: MyModel[] = [];
  const mockMyService = {
    sameMethod: () => Observable.of(mockMyModel),
  };

最后，模拟服务

beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ MyComponent],
    })
    .overrideComponent(MyComponent, {
      set: {
        providers: [
          { provide: MyService , useValue: mockMyService },
        ],
      },
    })
    .compileComponents();
  }));

我需要为我的另一个组件再次做同样的事情。

选项1：有没有办法全局共享mock的准备例如{ provide: MyService , useValue: global.mockMyService }
选项 2：是否可以使用诸如“RouterTestingModule”之类的“ServiceTestingModule”来模拟服务。

谢谢！

【问题讨论】：

标签： unit-testing angular mocking

【解决方案1】：

选项1绝对可以用

myMockProvider = { provide: MyService , useValue: mockMyService };

beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ MyComponent],
    })
    .overrideComponent(MyComponent, {
      set: {
        providers: [myMockProvider],
      },
    })
    .compileComponents();
  }));

myMockProvider 也可以是提供者列表。嵌套列表由providers: [...] 自动解析/展平。

【讨论】：