diff --git a/examples/marks.js b/examples/marks.js index bd92b4f..7a289c3 100644 --- a/examples/marks.js +++ b/examples/marks.js @@ -1,23 +1,21 @@ -'use strict'; - require('rc-slider/assets/index.less'); -var React = require('react'); -var ReactDOM = require('react-dom'); -var Slider = require('rc-slider'); +const React = require('react'); +const ReactDOM = require('react-dom'); +const Slider = require('rc-slider'); -var style = {width: 400, margin: 50}; -var marks = { +const style = {width: 400, margin: 50}; +const marks = { '-10': '-10°C', 0: '0°C', 26: '26°C', 37: '37°C', - 100: '100°C' + 100: '100°C', }; -var log = function(value) { +function log(value) { console.log(value); -}; +} ReactDOM.render(
diff --git a/examples/range.js b/examples/range.js index 6d7c4a5..ef4edb9 100644 --- a/examples/range.js +++ b/examples/range.js @@ -1,31 +1,30 @@ -'use strict'; - require('rc-slider/assets/index.less'); -var React = require('react'); -var ReactDOM = require('react-dom'); -var Slider = require('rc-slider'); +const React = require('react'); +const ReactDOM = require('react-dom'); +const Slider = require('rc-slider'); -var style = {width: 400, margin: 50}; -var log = function(value) { +const style = {width: 400, margin: 50}; + +function log(value) { console.log(value); -}; +} -var CustomizedRange = React.createClass({ +const CustomizedRange = React.createClass({ getInitialState: function() { return { - value: [20, 40] - } + value: [20, 40], + }; }, onChange: function(value) { log(value); this.setState({ - value: value + value: value, }); }, render: function() { return ; - } + }, }); ReactDOM.render( diff --git a/examples/slider.js b/examples/slider.js index 8273936..c06528f 100644 --- a/examples/slider.js +++ b/examples/slider.js @@ -1,43 +1,42 @@ -'use strict'; - require('rc-slider/assets/index.less'); -var React = require('react'); -var ReactDOM = require('react-dom'); -var Slider = require('rc-slider'); +const React = require('react'); +const ReactDOM = require('react-dom'); +const Slider = require('rc-slider'); -var style = {width: 400, margin: 50}; -var log = function(value) { +const style = {width: 400, margin: 50}; + +function log(value) { console.log(value); -}; +} function percentFormatter(v) { return v + ' %'; } -var CustomizedSlider = React.createClass({ +const CustomizedSlider = React.createClass({ getInitialState: function() { return { - value: 50 - } + value: 50, + }; }, onChange: function(value) { log(value); this.setState({ - value: value + value: value, }); }, render: function() { return ; - } + }, }); ReactDOM.render(

Basic Slider

- +

Basic Slider,`step=20`

@@ -49,7 +48,7 @@ ReactDOM.render(

Basic Slider with `tipFormatter`

- +

Controlled Slider

diff --git a/tests/index.spec.js b/tests/index.spec.js index 68acbef..501d3a0 100644 --- a/tests/index.spec.js +++ b/tests/index.spec.js @@ -1,61 +1,58 @@ - -var expect = require('expect.js'); -var Slider = require('../index.js'); -var React = require('react'); -var ReactDOM = require('react-dom'); -var TestUtils = require('react-addons-test-utils'); -var Simulate = TestUtils.Simulate; -var $ = require('jquery'); +const expect = require('expect.js'); +const Slider = require('../index.js'); +const React = require('react'); +const ReactDOM = require('react-dom'); +const $ = require('jquery'); require('../assets/index.less'); -describe('rc-slider', function () { +describe('rc-slider', function() { this.timeout(5000); - var div = document.createElement('div'); + const div = document.createElement('div'); document.body.appendChild(div); - afterEach(function () { + afterEach(() => { ReactDOM.unmountComponentAtNode(div); }); - it('should render a simple slider with value correctly!', function () { - var slider = ReactDOM.render( - , + it('should render a simple slider with value correctly!', () => { + const slider = ReactDOM.render( + , div ); - var node = $(div); + const node = $(div); expect(node.find('.rc-slider').length).to.be(1); expect(node.find('.rc-slider-handle').length).to.be(1); expect(node.find('.rc-slider-track').length).to.be(1); expect(slider.state.upperBound).to.be(40); - var trackWidth = node.find('.rc-slider-track')[0].style.width; + const trackWidth = node.find('.rc-slider-track')[0].style.width; expect(trackWidth).to.eql(node.find('.rc-slider-handle')[0].style.left); }); - it('should render a slider with correct numbers of step!', function () { - var slider = ReactDOM.render( - , + it('should render a slider with correct numbers of step!', () => { + const slider = ReactDOM.render( + , div ); - var node = $(div); + const node = $(div); expect(node.find('.rc-slider').length).to.be(1); expect(node.find('.rc-slider-handle').length).to.be(1); expect(node.find('.rc-slider-track').length).to.be(1); expect(slider.state.upperBound).to.be(0); - var sliderWithDots = ReactDOM.render( - , + ReactDOM.render( + , div ); - var node1 = $(div); + const node1 = $(div); expect(node1.find('.rc-slider-dot').length).to.be(6); }); - it('should render a slider with marks correctly!', function () { - var slider = ReactDOM.render( - , + it('should render a slider with marks correctly!', () => { + const slider = ReactDOM.render( + , div ); - var node = $(div); + const node = $(div); expect(node.find('.rc-slider').length).to.be(1); expect(node.find('.rc-slider-handle').length).to.be(1); expect(node.find('.rc-slider-track').length).to.be(1); @@ -64,20 +61,4 @@ describe('rc-slider', function () { expect(node.find('.rc-slider-mark-text').length).to.be(Object.keys(slider.props.marks).length); expect(slider.state.upperBound).to.be(40); }); - - // it('should mouseDown works!', function (done) { - // var slider = ReactDOM.render( - // , - // div - // ); - // var selectedStep = slider.refs.step3.getDOMNode(); - - // Simulate.mouseDown(selectedStep); - - // setTimeout( function() { - // expect(slider.state.active).to.be('active'); - // done(); - // }, 200); - // }); - });