测试 FormBuilder 是否调用了 NgOnInit() 上的方法组

Question

我是角度和角度测试的新手，我已经阅读了许多关于 jasmine 测试 formBuilder 的文章，但没有得到太多帮助。
假设我有以下代码

ngOnInit(): void {
  this.someForm = this.formBuilder.group({
    formField1: [null, Validators.required],
    formField2: [null, Validators.required],
    formField3: [null, Validators.required]
  });
}

现在我想测试 formBuilder 上的组方法 是否被调用。我怎样才能在 Jasmine Angular 中做到这一点？ 我已经尝试了以下代码，但它不起作用：

beforeEach(() => {
  fixture = TestBed.createComponent(ChangePasswordComponent);
  formBuilder = TestBed.inject(FormBuilder);
  component = fixture.componentInstance;
  fixture.detectChanges();
});


it('on ngOnit_ FormBuilder object should call group method', () => {
  fixture.detectChanges();
  const spyObject =  spyOn(formBuilder, 'group');
  fixture.detectChanges();
  expect(spyObject).toHaveBeenCalled();
});

Answer 1

ngOnInit 在组件创建后首次调用 fixture.detectChanges 时被调用（此处为 beforeEach）！

因此，当您在调用 Angular 生命周期挂钩后监视表单构建器服务时，没有调用表单构建器的 group 方法。

解决方案： 由于ngOnInit只是一个angular调用的方法，你可以自己再次调用并断言。

const spyObject = spyOn(formBuilder, 'group');
component.ngOnInit();
fixture.detectChanges();
expect(spyObject).toHaveBeenCalled();