diff --git a/src/lib/datepicker/datepicker-input.ts b/src/lib/datepicker/datepicker-input.ts index 865637780e2..1302cff20a0 100644 --- a/src/lib/datepicker/datepicker-input.ts +++ b/src/lib/datepicker/datepicker-input.ts @@ -212,6 +212,7 @@ export class MdDatepickerInput implements AfterContentInit, ControlValueAcces this._datepicker.selectedChanged.subscribe((selected: D) => { this.value = selected; this._cvaOnChange(selected); + this._onTouched(); this.dateInput.emit(new MdDatepickerInputEvent(this, this._elementRef.nativeElement)); this.dateChange.emit(new MdDatepickerInputEvent(this, this._elementRef.nativeElement)); }); diff --git a/src/lib/datepicker/datepicker.spec.ts b/src/lib/datepicker/datepicker.spec.ts index 7fca712aebc..224cfd72a40 100644 --- a/src/lib/datepicker/datepicker.spec.ts +++ b/src/lib/datepicker/datepicker.spec.ts @@ -411,6 +411,21 @@ describe('MdDatepicker', () => { expect(inputEl.classList).toContain('ng-touched'); }); + + it('should mark input touched on calendar selection', () => { + let inputEl = fixture.debugElement.query(By.css('input')).nativeElement; + + expect(inputEl.classList).toContain('ng-untouched'); + + testComponent.datepicker._selectAndClose(new Date(2017, JAN, 1)); + fixture.detectChanges(); + + fixture.whenStable().then(() => { + fixture.detectChanges(); + + expect(inputEl.classList).toContain('ng-touched'); + }); + }); }); describe('datepicker with formControl', () => {