1 import ReactDOM from 'react-dom';
2 import React from 'react';
3 import TimePicker from '../src/TimePicker';
5 import TestUtils from 'react-addons-test-utils';
6 const Simulate = TestUtils.Simulate;
7 import expect from 'expect.js';
8 import async from 'async';
9 import DateTimeFormat from 'gregorian-calendar-format';
10 import zhCn from 'gregorian-calendar/lib/locale/zh_CN';
11 import TimePickerLocale from '../src/locale/zh_CN';
13 function formatTime(time, formatter) {
14 return formatter.parse(time, {
20 describe('Select', () => {
23 function renderPicker(props) {
24 const showSecond = true;
25 const formatter = new DateTimeFormat('HH:mm:ss');
27 return ReactDOM.render(
30 locale={TimePickerLocale}
31 showSecond={showSecond}
32 defaultValue={formatTime('01:02:03', formatter)}
38 container = document.createElement('div');
39 document.body.appendChild(container);
43 ReactDOM.unmountComponentAtNode(container);
44 document.body.removeChild(container);
47 describe('select number', () => {
48 it('select number correctly', (done) => {
49 const picker = renderPicker();
50 expect(picker.state.open).not.to.be.ok();
51 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
53 async.series([(next) => {
54 expect(picker.state.open).to.be(false);
56 Simulate.click(input);
57 setTimeout(next, 100);
59 expect(picker.state.open).to.be(true);
60 selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select');
62 setTimeout(next, 100);
64 expect(selector.length).to.be(3);
73 describe('select to change value', () => {
74 it('hour correctly', (done) => {
76 const picker = renderPicker({
81 expect(picker.state.open).not.to.be.ok();
82 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
84 async.series([(next) => {
85 expect(picker.state.open).to.be(false);
87 Simulate.click(input);
88 setTimeout(next, 100);
90 expect(picker.state.open).to.be(true);
91 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
92 expect(header).to.be.ok();
93 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
94 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
96 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[0];
97 const option = selector.getElementsByTagName('li')[19];
98 Simulate.click(option);
99 setTimeout(next, 100);
101 expect(change).to.be.ok();
102 expect(change.getHourOfDay()).to.be(19);
103 expect(ReactDOM.findDOMNode(header).value).to.be('19:02:03');
104 expect(ReactDOM.findDOMNode(input).value).to.be('19:02:03');
105 expect(picker.state.open).to.be.ok();
113 it('minute correctly', (done) => {
115 const picker = renderPicker({
120 expect(picker.state.open).not.to.be.ok();
121 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
123 async.series([(next) => {
124 expect(picker.state.open).to.be(false);
126 Simulate.click(input);
127 setTimeout(next, 100);
129 expect(picker.state.open).to.be(true);
130 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
131 expect(header).to.be.ok();
132 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
133 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
135 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[1];
136 const option = selector.getElementsByTagName('li')[19];
137 Simulate.click(option);
138 setTimeout(next, 100);
140 expect(change).to.be.ok();
141 expect(change.getMinutes()).to.be(19);
142 expect(ReactDOM.findDOMNode(header).value).to.be('01:19:03');
143 expect(ReactDOM.findDOMNode(input).value).to.be('01:19:03');
144 expect(picker.state.open).to.be.ok();
152 it('second correctly', (done) => {
154 const picker = renderPicker({
159 expect(picker.state.open).not.to.be.ok();
160 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
162 async.series([(next) => {
163 expect(picker.state.open).to.be(false);
165 Simulate.click(input);
166 setTimeout(next, 100);
168 expect(picker.state.open).to.be(true);
169 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
170 expect(header).to.be.ok();
171 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
172 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
174 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[2];
175 const option = selector.getElementsByTagName('li')[19];
176 Simulate.click(option);
177 setTimeout(next, 100);
179 expect(change).to.be.ok();
180 expect(change.getSeconds()).to.be(19);
181 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:19');
182 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:19');
183 expect(picker.state.open).to.be.ok();
191 it('disabled correctly', (done) => {
193 const picker = renderPicker({
197 disabledMinutes: [0, 2, 4, 6, 8, 10, 12, 14, 16, 18, 20, 22]
199 expect(picker.state.open).not.to.be.ok();
200 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
202 async.series([(next) => {
203 expect(picker.state.open).to.be(false);
205 Simulate.click(input);
206 setTimeout(next, 100);
208 expect(picker.state.open).to.be(true);
209 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
210 expect(header).to.be.ok();
211 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
212 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
214 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[1];
215 const option = selector.getElementsByTagName('li')[6];
216 Simulate.click(option);
217 setTimeout(next, 100);
219 expect(change).not.to.be.ok();
220 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
221 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
222 expect(picker.state.open).to.be.ok();
224 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[1];
225 const option = selector.getElementsByTagName('li')[7];
226 Simulate.click(option);
227 setTimeout(next, 100);
229 expect(change).to.be.ok();
230 expect(change.getMinutes()).to.be(7);
231 expect(ReactDOM.findDOMNode(header).value).to.be('01:07:03');
232 expect(ReactDOM.findDOMNode(input).value).to.be('01:07:03');
233 expect(picker.state.open).to.be.ok();
241 it('hidden correctly', (done) => {
243 const picker = renderPicker({
247 disabledHours: [1, 3, 5, 7, 9, 11, 13, 15, 17, 19, 21, 23],
248 hideDisabledOptions: true
250 expect(picker.state.open).not.to.be.ok();
251 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
253 async.series([(next) => {
254 expect(picker.state.open).to.be(false);
256 Simulate.click(input);
257 setTimeout(next, 100);
259 expect(picker.state.open).to.be(true);
260 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
261 expect(header).to.be.ok();
262 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
263 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
265 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[0];
266 const option = selector.getElementsByTagName('li')[3];
267 Simulate.click(option);
268 setTimeout(next, 100);
270 expect(change).to.be.ok();
271 expect(change.getHourOfDay()).to.be(6);
272 expect(ReactDOM.findDOMNode(header).value).to.be('06:02:03');
273 expect(ReactDOM.findDOMNode(input).value).to.be('06:02:03');
274 expect(picker.state.open).to.be.ok();
276 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[0];
277 const option = selector.getElementsByTagName('li')[4];
278 Simulate.click(option);
279 setTimeout(next, 100);
281 expect(change).to.be.ok();
282 expect(change.getHourOfDay()).to.be(8);
283 expect(ReactDOM.findDOMNode(header).value).to.be('08:02:03');
284 expect(ReactDOM.findDOMNode(input).value).to.be('08:02:03');
285 expect(picker.state.open).to.be.ok();