From 6a3576838163ea508894e1783fd3315fef8f3d5b Mon Sep 17 00:00:00 2001 From: Wagner Maciel Date: Thu, 8 Dec 2022 10:49:04 -0500 Subject: [PATCH 1/4] fix(material/slider): avoid manual fixing values on pointer up * Fixes issue #26172 --- src/material/slider/slider-input.ts | 19 ++++++++++--------- src/material/slider/slider.spec.ts | 4 ++-- 2 files changed, 12 insertions(+), 11 deletions(-) diff --git a/src/material/slider/slider-input.ts b/src/material/slider/slider-input.ts index 982b02d35a9c..2c5af3cdc2b7 100644 --- a/src/material/slider/slider-input.ts +++ b/src/material/slider/slider-input.ts @@ -439,12 +439,11 @@ export class MatSliderThumb implements _MatSliderThumb, OnDestroy, ControlValueA } } - _onPointerUp(event: PointerEvent): void { + _onPointerUp(): void { this._isActive = false; - this._updateWidthInactive(); - if (!this.disabled) { - this._handleValueCorrection(event); - } + setTimeout(() => { + this._updateWidthInactive(); + }, 10); } _clamp(v: number): number { @@ -636,11 +635,13 @@ export class MatSliderRangeThumb extends MatSliderThumb implements _MatSliderRan super._onPointerDown(event); } - override _onPointerUp(event: PointerEvent): void { - super._onPointerUp(event); + override _onPointerUp(): void { + super._onPointerUp(); if (this._sibling) { - this._sibling._updateWidthInactive(); - this._sibling._hostElement.classList.remove('mat-mdc-slider-input-no-pointer-events'); + setTimeout(() => { + this._sibling!._updateWidthInactive(); + this._sibling!._hostElement.classList.remove('mat-mdc-slider-input-no-pointer-events'); + }, 10); } } diff --git a/src/material/slider/slider.spec.ts b/src/material/slider/slider.spec.ts index a0e4b4389cc6..59e14338587e 100644 --- a/src/material/slider/slider.spec.ts +++ b/src/material/slider/slider.spec.ts @@ -1686,7 +1686,7 @@ function setValueByClick( input.focus(); dispatchPointerEvent(inputElement, 'pointerup', x, y); dispatchEvent(input._hostElement, new Event('change')); - tick(); + tick(10); } /** Slides the MatSlider's thumb to the given value. */ @@ -1702,7 +1702,7 @@ function slideToValue(slider: MatSlider, input: MatSliderThumb, value: number) { dispatchEvent(input._hostElement, new Event('input')); dispatchPointerEvent(sliderElement, 'pointerup', endX, endY); dispatchEvent(input._hostElement, new Event('change')); - tick(); + tick(10); } /** Returns the x and y coordinates for the given slider value. */ From 8254111a0443235bfaa88b269a4c454acc404fec Mon Sep 17 00:00:00 2001 From: Wagner Maciel Date: Thu, 8 Dec 2022 11:03:17 -0500 Subject: [PATCH 2/4] fixup! fix(material/slider): avoid manual fixing values on pointer up --- tools/public_api_guard/material/slider.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/tools/public_api_guard/material/slider.md b/tools/public_api_guard/material/slider.md index 10b1d982d818..bb72ab0a2a75 100644 --- a/tools/public_api_guard/material/slider.md +++ b/tools/public_api_guard/material/slider.md @@ -167,7 +167,7 @@ export class MatSliderRangeThumb extends MatSliderThumb implements _MatSliderRan // (undocumented) _onPointerMove(event: PointerEvent): void; // (undocumented) - _onPointerUp(event: PointerEvent): void; + _onPointerUp(): void; // (undocumented) _setIsLeftThumb(): void; // (undocumented) @@ -243,7 +243,7 @@ export class MatSliderThumb implements _MatSliderThumb, OnDestroy, ControlValueA // (undocumented) _onPointerMove(event: PointerEvent): void; // (undocumented) - _onPointerUp(event: PointerEvent): void; + _onPointerUp(): void; get percentage(): number; registerOnChange(fn: any): void; registerOnTouched(fn: any): void; From ee16863efd043299d11b04926e452507c74b7fc8 Mon Sep 17 00:00:00 2001 From: Wagner Maciel Date: Thu, 8 Dec 2022 18:53:06 -0500 Subject: [PATCH 3/4] fixup! fix(material/slider): avoid manual fixing values on pointer up --- src/material/slider/slider-input.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/material/slider/slider-input.ts b/src/material/slider/slider-input.ts index 2c5af3cdc2b7..f3b7bb015870 100644 --- a/src/material/slider/slider-input.ts +++ b/src/material/slider/slider-input.ts @@ -443,7 +443,7 @@ export class MatSliderThumb implements _MatSliderThumb, OnDestroy, ControlValueA this._isActive = false; setTimeout(() => { this._updateWidthInactive(); - }, 10); + }); } _clamp(v: number): number { @@ -641,7 +641,7 @@ export class MatSliderRangeThumb extends MatSliderThumb implements _MatSliderRan setTimeout(() => { this._sibling!._updateWidthInactive(); this._sibling!._hostElement.classList.remove('mat-mdc-slider-input-no-pointer-events'); - }, 10); + }); } } From 9113309c2c2d809c7a65c954604d80dd44383c00 Mon Sep 17 00:00:00 2001 From: Wagner Maciel Date: Mon, 12 Dec 2022 17:03:38 -0500 Subject: [PATCH 4/4] fixup! fix(material/slider): avoid manual fixing values on pointer up --- src/material/slider/slider.spec.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/material/slider/slider.spec.ts b/src/material/slider/slider.spec.ts index 59e14338587e..a0e4b4389cc6 100644 --- a/src/material/slider/slider.spec.ts +++ b/src/material/slider/slider.spec.ts @@ -1686,7 +1686,7 @@ function setValueByClick( input.focus(); dispatchPointerEvent(inputElement, 'pointerup', x, y); dispatchEvent(input._hostElement, new Event('change')); - tick(10); + tick(); } /** Slides the MatSlider's thumb to the given value. */ @@ -1702,7 +1702,7 @@ function slideToValue(slider: MatSlider, input: MatSliderThumb, value: number) { dispatchEvent(input._hostElement, new Event('input')); dispatchPointerEvent(sliderElement, 'pointerup', endX, endY); dispatchEvent(input._hostElement, new Event('change')); - tick(10); + tick(); } /** Returns the x and y coordinates for the given slider value. */