fix(datepicker): dateInput event being fired if the value hasn't changed (#10952)

Fixes the `dateInput` event being fired even if the value hasn't changed. This can happen if the browser fires the `input` event while the value hasn't changed (e.g. if the user marks a character and "replaces" it with the same character).

Author: crisbeto

src/lib/datepicker/datepicker-input.ts

@@ -328,10 +328,13 @@ export class MatDatepickerInput<D> implements AfterContentInit, ControlValueAcce
     let date = this._dateAdapter.parse(value, this._dateFormats.parse.dateInput);
     this._lastValueValid = !date || this._dateAdapter.isValid(date);
     date = this._getValidDateOrNull(date);
-    this._value = date;
-    this._cvaOnChange(date);
-    this._valueChange.emit(date);
-    this.dateInput.emit(new MatDatepickerInputEvent(this, this._elementRef.nativeElement));
+
+    if (!this._dateAdapter.sameDate(date, this._value)) {
+      this._value = date;
+      this._cvaOnChange(date);
+      this._valueChange.emit(date);
+      this.dateInput.emit(new MatDatepickerInputEvent(this, this._elementRef.nativeElement));
+    }
   }
 
   _onChange() {

src/lib/datepicker/datepicker.spec.ts

@@ -627,6 +627,7 @@ describe('MatDatepicker', () => {
 
         expect(inputEl.classList).toContain('ng-pristine');
 
+        inputEl.value = '2001-01-01';
         dispatchFakeEvent(inputEl, 'input');
         fixture.detectChanges();
 
@@ -1132,6 +1133,7 @@ describe('MatDatepicker', () => {
         expect(testComponent.onInput).not.toHaveBeenCalled();
         expect(testComponent.onDateInput).not.toHaveBeenCalled();
 
+        inputEl.value = '2001-01-01';
         dispatchFakeEvent(inputEl, 'input');
         fixture.detectChanges();
 
@@ -1179,6 +1181,22 @@ describe('MatDatepicker', () => {
           expect(testComponent.onDateInput).toHaveBeenCalled();
         })
       );
+
+      it('should not fire the dateInput event if the value has not changed', () => {
+        expect(testComponent.onDateInput).not.toHaveBeenCalled();
+
+        inputEl.value = '12/12/2012';
+        dispatchFakeEvent(inputEl, 'input');
+        fixture.detectChanges();
+
+        expect(testComponent.onDateInput).toHaveBeenCalledTimes(1);
+
+        dispatchFakeEvent(inputEl, 'input');
+        fixture.detectChanges();
+
+        expect(testComponent.onDateInput).toHaveBeenCalledTimes(1);
+      });
+
     });
 
     describe('with ISO 8601 strings as input', () => {