diff --git a/packages/main/src/RangeSlider.ts b/packages/main/src/RangeSlider.ts index 93b2eb3471b5..0653a7db80ba 100644 --- a/packages/main/src/RangeSlider.ts +++ b/packages/main/src/RangeSlider.ts @@ -219,13 +219,21 @@ class RangeSlider extends SliderBase { // and it won't be "stepified" (rounded to the nearest step). 'Clip' them within // min and max bounderies and update the previous state reference. const normalizedStartValue = SliderBase.clipValue(this.startValue, this._effectiveMin, this._effectiveMax); - this.startValue = normalizedStartValue; - this.updateStateStorageAndFireInputEvent("startValue"); + + if (normalizedStartValue !== this.startValue) { + this._state.startValue = normalizedStartValue; + this.updateStateStorageAndFireInputEvent("startValue"); + this._updateAttribute("startValue", normalizedStartValue); + } this.storePropertyState("startValue"); const normalizedEndValue = SliderBase.clipValue(this.endValue, this._effectiveMin, this._effectiveMax); - this.endValue = normalizedEndValue; - this.updateStateStorageAndFireInputEvent("endValue"); + + if (normalizedEndValue !== this.endValue) { + this._state.endValue = normalizedEndValue; + this.updateStateStorageAndFireInputEvent("endValue"); + this._updateAttribute("endValue", normalizedEndValue); + } this.storePropertyState("endValue"); } diff --git a/packages/main/test/specs/RangeSlider.spec.js b/packages/main/test/specs/RangeSlider.spec.js index 601b4cb7c593..f6aaf91ebf41 100644 --- a/packages/main/test/specs/RangeSlider.spec.js +++ b/packages/main/test/specs/RangeSlider.spec.js @@ -206,7 +206,6 @@ describe("Range Slider elements - tooltip, step, tickmarks, labels", () => { }); describe("Properties synchronization and normalization", () => { - it("Should fallback to default value of 1 if step property is not a valid number", async () => { const rangeSlider = await browser.$("#range-slider-tickmarks-labels"); @@ -284,6 +283,19 @@ describe("Properties synchronization and normalization", () => { assert.strictEqual((await rangeSlider.getProperty("_labels")).length, 6, "Labels must be 6 - 1 for every 4 tickmarks (and 8 current value points)"); }); + + it("Should handle effective min/max when value is not in range", async () => { + const rangeSlider = await browser.$("#range-slider-tickmarks-labels"); + + await rangeSlider.setProperty("min", 50); + await rangeSlider.setProperty("max", 10); + + await rangeSlider.setProperty("startValue", 5); + await rangeSlider.setProperty("endValue", 60); + + assert.strictEqual(await rangeSlider.getProperty("startValue"), 10, "startValue should be clipped to min value"); + assert.strictEqual(await rangeSlider.getProperty("endValue"), 50, "endValue should be clipped to max value"); + }); }); describe("Testing events", () => {