自定义验证器FormGroup的角度单元测试

Question

如何对具有FormGroup的自定义验证器进行单元测试(此处为Jest(？我看过这个问题，但它是关于FormControl的。

要测试的功能。

import { FormGroup } from '@angular/forms';
/**
* @description Validate if passwords are different.
* @function validatePasswords
* @param {string} passwordControlName - reference to formControlPassword of the contactForm.
* @param {string} confirmPasswordControlName - reference to formControlConfirmPassword of the contactForm.
* @returns {(formGroup: FormGroup) => void}
*/
export function validatePasswords(
passwordControlName: string,
confirmPasswordControlName: string
): (formGroup: FormGroup) => void {
return (formGroup: FormGroup) => {
// Get values of desired controls of the form.
const passwordControl = formGroup.controls[passwordControlName];
const confirmPasswordControl =
formGroup.controls[confirmPasswordControlName];
if (
// Don't show the error if any different error occured in password confirmation.
confirmPasswordControl.errors &&
!confirmPasswordControl.errors.passwordMismatch
) {
return; // Different validator shown an error, therefore return.
}
// Check if password and password confirmation are different.
if (passwordControl.value !== confirmPasswordControl.value) {
confirmPasswordControl.setErrors({ passwordMismatch: true }); // Password and confirm password are different, therefore show passwordMismatch error.
} else {
confirmPasswordControl.setErrors(null); // Password and confirm password are the same, therefore don't display any error.
}
};
}

Answer 1

您可以创建一个由2个密码控件组成的测试FormGroup，并将validatePasswords验证器应用于该组：

describe('validatePasswords', () => {
const password = 'password';
const confirmPassword = 'confirmPassword';
let formGroup: FormGroup;
beforeEach(() => {
formGroup = new FormGroup({
[password]: new FormControl(),
[confirmPassword]: new FormControl(),
}, validatePasswords(password, confirmPassword));
});
it('should has "passwordMismatch" error if passwords do not match', () => {
formGroup.patchValue({
[password]: '123',
[confirmPassword]: '321'
});

expect(formGroup.get(confirmPassword).hasError('passwordMismatch')).toBe(true);
});

it('should be valid if passwords match', () => {
formGroup.patchValue({
[password]: '123',
[confirmPassword]: '123'
});

expect(formGroup.get(confirmPassword).valid).toBe(true);
});
});