From a6978323930a81d983b0051ad61bcf81fb7a7235 Mon Sep 17 00:00:00 2001 From: MG12 Date: Thu, 3 Dec 2015 23:36:20 +0800 Subject: add picker test case --- HISTORY.md | 6 ++ examples/pick-time.js | 3 - package.json | 2 +- tests/TimePicker.spec.jsx | 145 ++++++++++++++++++++++++++++++++++++++++++++++ tests/index.spec.js | 1 + tests/runner.html | 1 + 6 files changed, 154 insertions(+), 4 deletions(-) create mode 100644 tests/TimePicker.spec.jsx create mode 100644 tests/index.spec.js create mode 100644 tests/runner.html diff --git a/HISTORY.md b/HISTORY.md index ed2c9b2..fa9b591 100644 --- a/HISTORY.md +++ b/HISTORY.md @@ -2,6 +2,12 @@ --- +0.7.2 / 2015-12-03 +------------------ + +`fix` IE8 compatible. +`new` add test users. + 0.7.1 / 2015-11-20 ------------------ diff --git a/examples/pick-time.js b/examples/pick-time.js index 178b622..f26952c 100644 --- a/examples/pick-time.js +++ b/examples/pick-time.js @@ -29,6 +29,3 @@ ReactDom.render( onChange={onChange}/>, document.getElementById('__react-content') ); - - -console.log(zhCn); \ No newline at end of file diff --git a/package.json b/package.json index f9246c0..59ca784 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "rc-time-picker", - "version": "1.0.0-alpha1", + "version": "1.0.0-alpha2", "description": "React TimePicker", "keywords": [ "react", diff --git a/tests/TimePicker.spec.jsx b/tests/TimePicker.spec.jsx new file mode 100644 index 0000000..5b08a81 --- /dev/null +++ b/tests/TimePicker.spec.jsx @@ -0,0 +1,145 @@ +import ReactDOM from 'react-dom'; +import React from 'react'; +import TimePicker from '../src/TimePicker'; + +import TestUtils from 'react-addons-test-utils'; +var Simulate = TestUtils.Simulate; +import expect from 'expect.js'; +import async from 'async'; + +import DateTimeFormat from 'gregorian-calendar-format'; +import GregorianCalendar from 'gregorian-calendar'; +import zhCn from 'gregorian-calendar/lib/locale/zh_CN'; +import TimePickerLocale from '../src/locale/zh_CN'; + +describe('TimePicker', function () { + var div; + var showSecond = true; + var str = showSecond ? 'HH:mm:ss' : 'HH:mm'; + var formatter = new DateTimeFormat(str); + + function renderPicker(props) { + return ReactDOM.render( + , div); + } + + function formatTime(time, formatter) { + return formatter.parse(time, { + locale: zhCn, + obeyCount: true, + }); + } + + beforeEach(function () { + div = document.createElement('div'); + document.body.appendChild(div); + }); + + afterEach(function () { + ReactDOM.unmountComponentAtNode(div); + document.body.removeChild(div); + }); + + it('popup correctly', function (done) { + var change; + var picker = renderPicker({ + onChange: function (v) { + change = v; + } + }); + expect(picker.state.open).not.to.be.ok(); + var input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0]; + async.series([function (next) { + Simulate.click(input); + setTimeout(next, 100); + }, function (next) { + expect(TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-inner')[0]).to.be.ok(); + expect(picker.state.open).to.be(true); + var hour = TestUtils.scryRenderedDOMComponentsWithTag(picker.panelInstance, 'li')[1]; + Simulate.click(hour); + setTimeout(next, 100); + }, function (next) { + expect(change).to.be.ok(); + expect(change.getHourOfDay()).to.be(1); + expect(change.getMinutes()).to.be(57); + expect(change.getSeconds()).to.be(58); + expect(ReactDOM.findDOMNode(input).value).to.be('01:57:58'); + expect(picker.state.open).to.be.ok(); + next(); + }], function () { + done(); + }); + }); + + describe('render panel to body', function () { + it('support correctly', function (done) { + var change; + var picker = renderPicker({ + onChange: function (v) { + change = v; + } + }); + expect(picker.state.open).not.to.be.ok(); + var input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0]; + async.series([function (next) { + Simulate.click(input); + setTimeout(next, 100); + }, function (next) { + expect(TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-panel-inner')[0]).not.to.be.ok(); + expect(picker.state.open).to.be(true); + var hour = TestUtils.scryRenderedDOMComponentsWithTag(picker.panelInstance, 'li')[1]; + Simulate.click(hour); + setTimeout(next, 100); + }, function (next) { + expect(change).to.be.ok(); + expect(change.getHourOfDay()).to.be(1); + expect(change.getMinutes()).to.be(57); + expect(change.getSeconds()).to.be(58); + expect(ReactDOM.findDOMNode(input).value).to.be('01:57:58'); + expect(picker.state.open).to.be.ok(); + next(); + }], function () { + done(); + }); + }); + + it('destroy correctly', function (done) { + var change; + var picker = renderPicker({ + onChange: function (v) { + change = v; + } + }); + expect(picker.state.open).not.to.be.ok(); + var input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0]; + async.series([function (next) { + Simulate.click(input); + setTimeout(next, 100); + }, function (next) { + expect(TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-panel-inner')[0]).not.to.be.ok(); + expect(picker.state.open).to.be(true); + if (document.querySelectorAll) { + expect(document.querySelectorAll('.rc-time-picker').length).not.to.be(0); + } + expect(TestUtils.scryRenderedDOMComponentsWithTag(picker.panelInstance, 'li')[0]).to.be.ok(); + ReactDOM.unmountComponentAtNode(div); + setTimeout(next, 100); + }, function (next) { + if (document.querySelectorAll) { + expect(document.querySelectorAll('.rc-time-picker').length).to.be(0); + } + expect(picker.panelInstance).not.to.be.ok(); + next(); + }], function () { + done(); + }); + }); + }); + +}); diff --git a/tests/index.spec.js b/tests/index.spec.js new file mode 100644 index 0000000..58c049a --- /dev/null +++ b/tests/index.spec.js @@ -0,0 +1 @@ +import './TimePicker.spec'; diff --git a/tests/runner.html b/tests/runner.html new file mode 100644 index 0000000..39802f6 --- /dev/null +++ b/tests/runner.html @@ -0,0 +1 @@ +stub -- cgit v1.2.3