Angular 测试中的 SpyOn

Question

首先，我很抱歉。我真的是 Angular 的新手，我不确定我知道的足够多，无法提出一个好的问题，更不用说提供一些小的工作示例了。

我正在尝试在单元测试中使用 spyOn，但运气不佳。

基本上，我的单​​元测试调用组件上的一个方法，该方法调用一个 service1，该方法调用另一个 service2。

当我尝试监视 service1 时，它没有使用我提供的模拟值。它调用“真正的”ServiceProvidersHTTPService.getAllUsers 并使用 AppConfigService 而不是 MockAppConfigService。

我将从复制我的测试开始。

describe('ProjectAnalystComponent', () => {
  let component: ProjectAnalystComponent;
let fixture: ComponentFixture<ProjectAnalystComponent>;
let service: ServiceProvidersHTTPService ;

  beforeEach(async(() => {
TestBed.configureTestingModule({
  imports: [HttpClientModule, RouterTestingModule],
    declarations: [ ProjectAnalystComponent ],
  providers: 
  [
    ServiceProvidersHTTPService, 
    CurrentCreateProjectService, 
    NotificationService, 
    MessageService,
    ProjectLeadAnalystHTTPService,
      ExceptionService,
      {provide: AppConfigService, useClass: MockAppConfigService }

  ],
  schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA]
})
.compileComponents();
  }));

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

it('should create', () => {
    console.log("######### Did this run");
    let service = fixture.debugElement.injector.get(ServiceProvidersHTTPService);
    spyOn(service, 'getAllUsers').and.returnValue('{}');

    expect(component).toBeTruthy();
  });
});

Answer 1

TL;DR模拟你的服务。

说明

在您的测试平台中，您提供实际服务：

providers:[ServiceProvidersHTTPService, ...

这意味着您实际上调用了服务的真实方法。

如果你模拟你的服务，就像你在那里做的那样：

{provide: AppConfigService, useClass: MockAppConfigService }

然后您调用在您的模拟中声明的随机函数。

模拟的另一个好处，你摆脱了依赖的依赖。

正如您所说，您的服务调用另一个服务：如果您模拟您的第一个服务，您不必将此服务的依赖项添加到您的测试平台中。

所以，他们还有很长的路要走：

const mock = {
  provide: ServiceProvidersHTTPService,
  useValue: {
    getAllUsers: () => null
  }
};

现在在您的测试平台中：

providers: [mock, ...

在useValue中，你必须把你实际服务的所有变量和所有函数，并mock它们。

在这种情况下，您的函数 getAllUsers 将简单地返回 null，而不是进行 HTTP 调用。你可以让它返回你想要的任何东西（好的做法是返回一个与应该返回的值相同类型的值）。

最后一条建议：你的单元测试应该只测试你的实际功能的功能和方法（这里是ProjectAnalystComponent）。您不应该在此处测试您的服务是否调用其他服务：您应该在您的服务的单元测试中进行测试。

如果您有任何问题，请随时提问！