TypeError:无法读取null~角度单元测试FormDirection:FormGroupDirection的属性“reset”

我试着对角接触分量进行单元测试,基本上是接触形式。很好,不包括里面的三条线”registerService.registerUser“我无法掩盖。每当我试着用 resetForm formDirective 类型 FormGroupDirective TypeError: Cannot read property 'reset' of null . 有人知道为什么吗?

我有两个猜测:

1. 外部服务 registerService subscribe() ,但后来我出错了 TypeError: Cannot read property 'registerUser' of undefined 基于此,我假设测试没有正确隔离,因此我拒绝了这种解决问题的方法。这个 registerUser 注册服务
2. 单元测试不正确,但无法找出原因。

下面是代码,我跳过了HTML部分,因为它不是这个问题的一部分。

import { RegisterService } from './register.service';
import Swal from 'sweetalert2';
...
constructor(
  private formBuilder: FormBuilder,
  private registerService: RegisterService
) {}

ngOnInit() {
  // Create contact form with all required validators.
  this.contactForm = this.formBuilder.group(
    {
      formControlFirstName: [
        '',
        Validators.compose([
          ...
        ])
      ],
      formControlLastName: [
        '',
        Validators.compose([
          ...
        ])
      ],
      formControlEmail: [
        '',
        Validators.compose([
          ...
        ])
      ],
      formControlPassword: [
        '',
        Validators.compose([
          ...
        ])
      ],
      formControlConfirmPassword: [
        '',
        Validators.compose([
          ...
        ])
      ]
  });
}

public contactForm: FormGroup = new FormGroup({}); // Declare variable to handle the form elements with required validators.

/**
* @access public
* @async
* @description Perform certain actions on button submit of the contact form.
* @function onSubmit
* @param {FormGroupDirective} formDirective - object used to reset validators.
* @returns {void}
*/
public onSubmit(formDirective: FormGroupDirective): void {
  const baseURL = 'https://SOME-API.com';
  const dataToBeSend = {
    firstName: this.contactForm.get('formControlFirstName').value,
    lastName: this.contactForm.get('formControlLastName').value,
    email: this.contactForm.get('formControlEmail').value
  };
  // Give a call to registerService to register user.
  this.registerService.registerUser(dataToBeSend, baseURL).subscribe(() => {
    Swal.fire('Success', 'You have successfuly registered!', 'success');
    formDirective.resetForm(); // Reset validators, i.e. to workaround #4190 (https://github.com/angular/components/issues/4190).
    this.contactForm.reset(); // Reset form once user will click "Register".
  });
}

部件规格ts

it('should test contactForm validity', async () => {
  const formGroupDirective: FormGroupDirective = new FormGroupDirective([], []);
  const contactForm = component.contactForm;
  expect(contactForm.valid).toBeFalsy();

  const firstNameInput: AbstractControl =
    contactForm.controls.formControlFirstName;
  firstNameInput.setValue('Daniel');

  const lastNameInput: AbstractControl =
    contactForm.controls.formControlLastName;
  lastNameInput.setValue('Danielecki');

  const emailInput: AbstractControl = contactForm.controls.formControlEmail;
  emailInput.setValue('daniel.danielecki@foo.com');

  const passwordInput: AbstractControl =
    contactForm.controls.formControlPassword;
  passwordInput.setValue('Password');

  const confirmPasswordInput: AbstractControl =
    contactForm.controls.formControlConfirmPassword;
  confirmPasswordInput.setValue('Password');

  expect(contactForm).toBeTruthy();

  component.onSubmit(formGroupDirective);

  formGroupDirective.resetForm(); // If I remove this then the test case will pass again, however the 3 lines inside "registerService.registerUser..." are still not covered.
  contactForm.reset();
});