diff --git a/projects/design-angular-kit/src/lib/abstracts/abstract-form.component.ts b/projects/design-angular-kit/src/lib/abstracts/abstract-form.component.ts index 494bc50d..df2f2011 100644 --- a/projects/design-angular-kit/src/lib/abstracts/abstract-form.component.ts +++ b/projects/design-angular-kit/src/lib/abstracts/abstract-form.component.ts @@ -124,9 +124,7 @@ export abstract class ItAbstractFormComponent extends ItAbstractCompone * Mark the control as touched */ markAsTouched(): void { - if (!this.control.touched) { - this.onTouched(); - } + this.onTouched(); } /** diff --git a/projects/design-angular-kit/src/lib/components/form/input/input.component.spec.ts b/projects/design-angular-kit/src/lib/components/form/input/input.component.spec.ts index 63685f16..42bbe104 100644 --- a/projects/design-angular-kit/src/lib/components/form/input/input.component.spec.ts +++ b/projects/design-angular-kit/src/lib/components/form/input/input.component.spec.ts @@ -101,11 +101,18 @@ describe('ItInputComponent — onBlur validation (#588)', () => { it('should show validation error ONLY after blur (touched)', () => { const nameCtrl = hostComponent.form.controls.name; + const input: HTMLInputElement = fixture.nativeElement.querySelector('input'); - // Simulate typing + blur - nameCtrl.setValue('ab'); - nameCtrl.markAsDirty(); - nameCtrl.markAsTouched(); + input.value = 'ab'; + input.dispatchEvent(new Event('input')); + fixture.detectChanges(); + + expect(nameCtrl.invalid).toBeTrue(); + expect(nameCtrl.dirty).toBeTrue(); + expect(nameCtrl.touched).toBeFalse(); + expect(fixture.nativeElement.querySelector('.is-invalid')).toBeNull(); + + input.dispatchEvent(new Event('blur')); fixture.detectChanges(); const el: HTMLElement = fixture.nativeElement;