diff --git a/src/scripts/components/slider.js b/src/scripts/components/slider.js index b80d6ab..d15ad6b 100644 --- a/src/scripts/components/slider.js +++ b/src/scripts/components/slider.js @@ -25,7 +25,7 @@ module.exports = { * @return {void} */ function setValueDisplay() { - var value = self.get(); + var value = self.get().toFixed(self.precision); $value.set('value', value); $valuePad.set('innerHTML', value); } diff --git a/test/spec/components/slider.js b/test/spec/components/slider.js index 9026f5c..e060517 100644 --- a/test/spec/components/slider.js +++ b/test/spec/components/slider.js @@ -65,4 +65,31 @@ describe('component - slider', function() { assert.strictEqual(sliderItem.precision, 2); }); + + it('always displays decimal when precision is less than 1', function() { + var clayConfig = fixture.clayConfig([{ + type: 'slider', + step: 0.05 + }]); + var sliderItem = clayConfig.getItemsByType('slider')[0]; + var $valueDisplay = sliderItem.$element.select('.value'); + var $valueDisplayPad = sliderItem.$element.select('.value-pad'); + var $slider = sliderItem.$element.select('.slider'); + + assert.strictEqual($valueDisplay.get('value'), '50.00'); + assert.strictEqual($valueDisplayPad.get('innerHTML'), '50.00'); + assert.strictEqual($slider.get('value'), '50'); + sliderItem.set(75); + assert.strictEqual($valueDisplay.get('value'), '75.00'); + assert.strictEqual($valueDisplayPad.get('innerHTML'), '75.00'); + assert.strictEqual($slider.get('value'), '75'); + sliderItem.set(33.25); + assert.strictEqual($valueDisplay.get('value'), '33.25'); + assert.strictEqual($valueDisplayPad.get('innerHTML'), '33.25'); + assert.strictEqual($slider.get('value'), '33.25'); + sliderItem.set(17.1); + assert.strictEqual($valueDisplay.get('value'), '17.10'); + assert.strictEqual($valueDisplayPad.get('innerHTML'), '17.10'); + assert.strictEqual($slider.get('value'), '17.1'); + }); });