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 {KeyCode} from 'rc-util';
11 import DateTimeFormat from 'gregorian-calendar-format';
12 import zhCn from 'gregorian-calendar/lib/locale/zh_CN';
13 import TimePickerLocale from '../src/locale/zh_CN';
15 function formatTime(time, formatter) {
16 return formatter.parse(time, {
22 describe('Header', () => {
25 function renderPicker(props) {
26 const showSecond = true;
27 const formatter = new DateTimeFormat('HH:mm:ss');
29 return ReactDOM.render(
32 locale={TimePickerLocale}
33 showSecond={showSecond}
34 defaultValue={formatTime('01:02:03', formatter)}
40 container = document.createElement('div');
41 document.body.appendChild(container);
45 ReactDOM.unmountComponentAtNode(container);
46 document.body.removeChild(container);
49 describe('input to change value', () => {
50 it('input correctly', (done) => {
51 const picker = renderPicker();
52 expect(picker.state.open).not.to.be.ok();
53 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
55 async.series([(next) => {
56 Simulate.click(input);
57 setTimeout(next, 100);
59 expect(picker.state.open).to.be(true);
60 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
61 expect(header).to.be.ok();
62 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
63 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
65 ReactDOM.findDOMNode(header).value = '12:34:56';
66 Simulate.change(header);
67 setTimeout(next, 100);
69 expect(picker.state.open).to.be(true);
70 expect(ReactDOM.findDOMNode(header).value).to.be('12:34:56');
71 expect(ReactDOM.findDOMNode(input).value).to.be('12:34:56');
79 it('carry correctly', (done) => {
80 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 Simulate.click(input);
86 setTimeout(next, 100);
88 expect(picker.state.open).to.be(true);
89 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
90 expect(header).to.be.ok();
91 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
92 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
94 ReactDOM.findDOMNode(header).value = '33:44:55';
95 Simulate.change(header);
96 setTimeout(next, 100);
98 expect(picker.state.open).to.be(true);
99 expect(ReactDOM.findDOMNode(header).value).to.be('09:44:55');
100 expect(ReactDOM.findDOMNode(input).value).to.be('09:44:55');
102 ReactDOM.findDOMNode(header).value = '10:90:30';
103 Simulate.change(header);
104 setTimeout(next, 100);
106 expect(picker.state.open).to.be(true);
107 expect(ReactDOM.findDOMNode(header).value).to.be('11:30:30');
108 expect(ReactDOM.findDOMNode(input).value).to.be('11:30:30');
110 ReactDOM.findDOMNode(header).value = '34:56:78';
111 Simulate.change(header);
112 setTimeout(next, 100);
114 expect(picker.state.open).to.be(true);
115 expect(ReactDOM.findDOMNode(header).value).to.be('10:57:18');
116 expect(ReactDOM.findDOMNode(input).value).to.be('10:57:18');
124 it('check correctly', (done) => {
125 const picker = renderPicker();
126 expect(picker.state.open).not.to.be.ok();
127 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
129 async.series([(next) => {
130 Simulate.click(input);
131 setTimeout(next, 100);
133 expect(picker.state.open).to.be(true);
134 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
135 expect(header).to.be.ok();
136 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
137 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
139 ReactDOM.findDOMNode(header).value = '3:34:56';
140 Simulate.change(header);
141 setTimeout(next, 100);
143 expect(picker.state.open).to.be(true);
144 expect(ReactDOM.findDOMNode(header).value).to.be('3:34:56');
145 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
146 expect(ReactDOM.findDOMNode(header).className).to.contain('rc-time-picker-panel-input-invalid');
148 ReactDOM.findDOMNode(header).value = '13:3:56';
149 Simulate.change(header);
150 setTimeout(next, 100);
152 expect(picker.state.open).to.be(true);
153 expect(ReactDOM.findDOMNode(header).value).to.be('13:3:56');
154 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
155 expect(ReactDOM.findDOMNode(header).className).to.contain('rc-time-picker-panel-input-invalid');
157 ReactDOM.findDOMNode(header).value = '13:34:5';
158 Simulate.change(header);
159 setTimeout(next, 100);
161 expect(picker.state.open).to.be(true);
162 expect(ReactDOM.findDOMNode(header).value).to.be('13:34:5');
163 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
164 expect(ReactDOM.findDOMNode(header).className).to.contain('rc-time-picker-panel-input-invalid');
172 describe('other operations', () => {
173 it('clear correctly', (done) => {
175 const picker = renderPicker({
180 expect(picker.state.open).not.to.be.ok();
181 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
183 async.series([(next) => {
184 expect(picker.state.open).to.be(false);
186 Simulate.click(input);
187 setTimeout(next, 100);
189 expect(picker.state.open).to.be(true);
190 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
191 const clearButton = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-clear-btn')[0];
192 expect(header).to.be.ok();
193 expect(clearButton).to.be.ok();
194 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
195 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
197 Simulate.mouseDown(clearButton);
198 setTimeout(next, 100);
200 expect(picker.state.open).to.be(false);
201 expect(change).to.be(null);
202 expect(ReactDOM.findDOMNode(header).value).to.be('');
203 expect(ReactDOM.findDOMNode(input).value).to.be('');
211 it('exit correctly', (done) => {
212 const picker = renderPicker();
213 expect(picker.state.open).not.to.be.ok();
214 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
216 async.series([(next) => {
217 expect(picker.state.open).to.be(false);
219 Simulate.click(input);
220 setTimeout(next, 100);
222 expect(picker.state.open).to.be(true);
223 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
224 expect(header).to.be.ok();
225 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
226 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');
228 Simulate.keyDown(ReactDOM.findDOMNode(header), {
229 keyCode: KeyCode.ESC,
231 setTimeout(next, 100);
233 expect(picker.state.open).to.be(false);
234 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:03');
235 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:03');