diff --git a/src/app/public/modules/datepicker/datepicker-input.directive.ts b/src/app/public/modules/datepicker/datepicker-input.directive.ts index 7280ddaa..d86544a2 100644 --- a/src/app/public/modules/datepicker/datepicker-input.directive.ts +++ b/src/app/public/modules/datepicker/datepicker-input.directive.ts @@ -245,6 +245,7 @@ export class SkyDatepickerInputDirective .distinctUntilChanged() .takeUntil(this.ngUnsubscribe) .subscribe((value: Date) => { + this.isFirstChange = false; this.value = value; this.onTouched(); }); diff --git a/src/app/public/modules/datepicker/datepicker.component.spec.ts b/src/app/public/modules/datepicker/datepicker.component.spec.ts index a92a2d64..88a96b4e 100644 --- a/src/app/public/modules/datepicker/datepicker.component.spec.ts +++ b/src/app/public/modules/datepicker/datepicker.component.spec.ts @@ -863,6 +863,68 @@ describe('datepicker', () => { })); }); + describe('Angular form control statuses', function () { + it('should set correct statuses when initialized without value', fakeAsync(function () { + fixture.componentInstance.initialValue = undefined; + fixture.detectChanges(); + tick(); + + expect(component.dateControl.valid).toBe(true); + expect(component.dateControl.pristine).toBe(true); + expect(component.dateControl.touched).toBe(false); + })); + + it('should set correct statuses when initialized with value', fakeAsync(function () { + fixture.componentInstance.initialValue = '1/1/2000'; + fixture.detectChanges(); + tick(); + + expect(component.dateControl.valid).toBe(true); + expect(component.dateControl.pristine).toBe(true); + expect(component.dateControl.touched).toBe(false); + })); + + it('should set correct statuses after user types within input', fakeAsync(function () { + fixture.detectChanges(); + tick(); + + expect(component.dateControl.valid).toBe(true); + expect(component.dateControl.pristine).toBe(true); + expect(component.dateControl.touched).toBe(false); + + setInput(nativeElement, '1/1/2000', fixture); + blurInput(nativeElement, fixture); + fixture.detectChanges(); + tick(); + + expect(component.dateControl.valid).toBe(true); + expect(component.dateControl.pristine).toBe(false); + expect(component.dateControl.touched).toBe(true); + })); + + it('should set correct statuses after user selects from calendar', fakeAsync(function () { + fixture.detectChanges(); + tick(); + + expect(component.dateControl.valid).toBe(true); + expect(component.dateControl.pristine).toBe(true); + expect(component.dateControl.touched).toBe(false); + + openDatepicker(fixture.nativeElement, fixture); + tick(); + fixture.detectChanges(); + tick(); + + fixture.nativeElement.querySelector('.sky-datepicker-btn-selected').click(); + fixture.detectChanges(); + tick(); + + expect(component.dateControl.valid).toBe(true); + expect(component.dateControl.pristine).toBe(false); + expect(component.dateControl.touched).toBe(true); + })); + }); + describe('validation', () => { it('should validate properly when invalid date is passed through input change',