Error when trying to merge validators
tafax opened this issue · comments
I'm submitting a...
[ ] Regression (a behavior that used to work and stopped working in a new release)
[X] Bug report
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request
[ ] Other... Please describe:
Current behavior
When invoking mergeValidators an error is thrown.
Expected behavior
The validators are correctly merged without errors.
Minimal reproduction of the problem with instructions
Given a form group created with the typed FormBuilder:
const builder = new FormBuilder();
const group = builder.group<{ title: string }>({
title: [ '', Validators.required ],
});
when validators are merged
group.mergeValidators(
(control: NgAbstractControl | AbstractControl<never, never>) => {}
);
then this error is thrown
core.js:6157 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'validate' of null
TypeError: Cannot read property 'validate' of null
at isValidatorFn (forms.js:754)
at forms.js:766
at Array.map (<anonymous>)
at normalizeValidators (forms.js:765)
at composeValidators (forms.js:776)
at coerceToValidator (forms.js:2756)
at FormGroup.setValidators (forms.js:2951)
at FormGroup.setValidators (ngneat-reactive-forms.js:510)
at mergeControlValidators (ngneat-reactive-forms.js:96)
at FormGroup.mergeValidators (ngneat-reactive-forms.js:481)
at resolvePromise (zone-evergreen.js:798)
at resolvePromise (zone-evergreen.js:750)
at zone-evergreen.js:860
at ZoneDelegate.invokeTask (zone-evergreen.js:399)
at Object.onInvokeTask (core.js:28522)
at ZoneDelegate.invokeTask (zone-evergreen.js:398)
at Zone.runTask (zone-evergreen.js:167)
at drainMicroTaskQueue (zone-evergreen.js:569)
Minimal troubleshooting
It seems related to the fact that the group has a null validator. The code that applies a merge doesn't skip it and the following one will use an array like [null, ...]. Therefore, a deeper investigation is needed 😄
What is the motivation / use case for changing the behavior?
Environment
Angular version: 11.2.3
Browser:
- [X] Brave Version 1.23.71 Chromium: 90.0.4430.72 (Official Build) (x86_64)
- [ ] Chrome (desktop) version XX
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
For Tooling issues:
- Node version: 14.15.1
- Platform: Mac
Others:
Please reproduce it on stackblitz.
@NetanelBasal Sure, but do you have a functioning template I can use? If I try to set up stackblitz I get ngcc failed to run on @ngneat/reactive-forms@1.7.2.
@NetanelBasal Any news on this?
@tafax can you try v1.7.3?
@NetanelBasal Unfortunately, It is still there for me.
Can you reproduce on stackblitz, please?
@NetanelBasal I still get ngcc failed to run on @ngneat/reactive-forms@1.7.3. on stackblitz.
Having the same issue. Somehow, always a null is in the validator array.
const control = new FormControl<string>("", [])I am on 1.7.3 as well.
Can you reproduce on stackblitz, please?
@NetanelBasal sure but StackBlitz says "cannot compile reactive-forms"... I will try ng-repl
@NetanelBasal sorry to ping again, I got a working repl here: https://codesandbox.io/s/reactive-forms-issue-87-ehccj?file=/src/app/app.component.ts
(OT: why is StackBlitz so hyped, Codesandbox works way better IMO and has great VS Code features)
I can check it, but this method is redundant. In v12 they added the addValidator method.
Fixed and deprecated.