diff --git a/core/src/components/range/range.tsx b/core/src/components/range/range.tsx index 20d8c4c20e..618bbd1084 100644 --- a/core/src/components/range/range.tsx +++ b/core/src/components/range/range.tsx @@ -126,9 +126,27 @@ export class Range implements ComponentInterface { if (!this.noUpdate) { this.updateRatio(); } + + value = this.ensureValueInBounds(value); + this.ionChange.emit({ value }); } + private clampBounds = (value: any): number => { + return clamp(this.min, value, this.max); + } + + private ensureValueInBounds = (value: any) => { + if (this.dualKnobs) { + return { + lower: this.clampBounds(value.lower), + upper: this.clampBounds(value.upper) + }; + } else { + return this.clampBounds(value); + } + } + /** * Emitted when the value property has changed. */ diff --git a/core/src/components/range/test/range.spec.ts b/core/src/components/range/test/range.spec.ts new file mode 100644 index 0000000000..e9b871422f --- /dev/null +++ b/core/src/components/range/test/range.spec.ts @@ -0,0 +1,45 @@ +import { Range } from '../range'; + +let sharedRange; +describe('Range', () => { + beforeEach(() => { + sharedRange = new Range(); + }); + describe('ensureValueInBounds()', () => { + it('should return the clamped value for a range single knob component', () => { + sharedRange.min = 0; + sharedRange.max = 100; + + const valueTests = [ + [50, 50], + [-100, 0], + [1000, 100], + [0, 0], + [100, 100] + ]; + + valueTests.forEach(test => { + expect(sharedRange.ensureValueInBounds(test[0])).toBe(test[1]); + }); + }); + + it('should return the clamped value for a range dual knob component', () => { + sharedRange.min = 0; + sharedRange.max = 100; + sharedRange.dualKnobs = true; + + const valueTests = [ + [{ lower: 0, upper: 0}, { lower: 0, upper: 0}], + [{ lower: -100, upper: 0}, { lower: 0, upper: 0}], + [{ lower: 0, upper: 10000}, { lower: 0, upper: 100}], + [{ lower: -100, upper: 200}, { lower: 0, upper: 100}], + [{ lower: 0, upper: 100}, { lower: 0, upper: 100}], + [{ lower: 200, upper: -100}, { lower: 100, upper: 0}], + ]; + + valueTests.forEach(test => { + expect(sharedRange.ensureValueInBounds(test[0])).toEqual(test[1]); + }); + }); + }); +}); \ No newline at end of file