fix(slider): change event is not being emitted (#7278)

* In some situations, the change event of the `<mat-slider>` is not being emitted if the user drags the thumb of the slider. This is because the `slidestart` event fires a second time before the sliding ends. This causes the slider to think that there was no value change.

Fixes #7207

Author: devversion

src/lib/slider/slider.spec.ts

@@ -142,6 +142,33 @@ describe('MatSlider without forms', () => {
       expect(sliderNativeElement.classList).not.toContain('mat-slider-sliding');
     });
 
+    it('should not change value without emitting a change event', () => {
+      const onChangeSpy = jasmine.createSpy('slider onChange');
+
+      sliderInstance.change.subscribe(onChangeSpy);
+      sliderInstance.value = 50;
+      fixture.detectChanges();
+
+      dispatchSlideStartEvent(sliderNativeElement, 0, gestureConfig);
+      fixture.detectChanges();
+
+      dispatchSlideEvent(sliderNativeElement, 10, gestureConfig);
+      fixture.detectChanges();
+
+      // In some situations, HammerJS will fire a second "slidestart" event because the user
+      // holds the thumb and drags it around. This would mean that the `_valueOnSlideStart`
+      // value will be updated to the actual end value. Causing the slider to think that the value
+      // didn't change at all.
+      dispatchSlideStartEvent(sliderNativeElement, 10, gestureConfig);
+      fixture.detectChanges();
+
+      dispatchSlideEndEvent(sliderNativeElement, 10, gestureConfig);
+      fixture.detectChanges();
+
+      expect(sliderNativeElement.classList).not.toContain('mat-slider-sliding');
+      expect(onChangeSpy).toHaveBeenCalledTimes(1);
+    });
+
     it('should reset active state upon blur', () => {
       sliderInstance._isActive = true;
 

src/lib/slider/slider.ts

@@ -492,7 +492,7 @@ export class MatSlider extends _MatSliderMixinBase
   }
 
   _onSlideStart(event: HammerInput | null) {
-    if (this.disabled) {
+    if (this.disabled || this._isSliding) {
       return;
     }