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:04', 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:04');
94 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:04');
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:04');
104 expect(ReactDOM.findDOMNode(input).value).to.be('19:02:04');
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:04');
133 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:04');
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:04');
143 expect(ReactDOM.findDOMNode(input).value).to.be('01:19:04');
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:04');
172 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:04');
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({
200 disabledSeconds(h, m) {
204 expect(picker.state.open).not.to.be.ok();
205 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
207 async.series([(next) => {
208 expect(picker.state.open).to.be(false);
210 Simulate.click(input);
211 setTimeout(next, 100);
213 expect(picker.state.open).to.be(true);
214 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
215 expect(header).to.be.ok();
216 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:04');
217 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:04');
219 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[1];
220 const option = selector.getElementsByTagName('li')[1];
221 Simulate.click(option);
222 setTimeout(next, 100);
224 expect(change).not.to.be.ok();
225 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:04');
226 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:04');
227 expect(picker.state.open).to.be.ok();
229 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[2];
230 const option = selector.getElementsByTagName('li')[3];
231 Simulate.click(option);
232 setTimeout(next, 100);
234 expect(change).not.to.be.ok();
235 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:04');
236 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:04');
237 expect(picker.state.open).to.be.ok();
239 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[1];
240 const option = selector.getElementsByTagName('li')[7];
241 Simulate.click(option);
242 setTimeout(next, 100);
244 expect(change).to.be.ok();
245 expect(change.getMinutes()).to.be(7);
246 expect(ReactDOM.findDOMNode(header).value).to.be('01:07:04');
247 expect(ReactDOM.findDOMNode(input).value).to.be('01:07:04');
248 expect(picker.state.open).to.be.ok();
256 it('hidden correctly', (done) => {
258 const picker = renderPicker({
263 return [1, 3, 5, 7, 9, 11, 13, 15, 17, 19, 21, 23];
265 hideDisabledOptions: true,
267 expect(picker.state.open).not.to.be.ok();
268 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, 'rc-time-picker-input')[0];
270 async.series([(next) => {
271 expect(picker.state.open).to.be(false);
273 Simulate.click(input);
274 setTimeout(next, 100);
276 expect(picker.state.open).to.be(true);
277 header = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-input')[0];
278 expect(header).to.be.ok();
279 expect(ReactDOM.findDOMNode(header).value).to.be('01:02:04');
280 expect(ReactDOM.findDOMNode(input).value).to.be('01:02:04');
282 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[0];
283 const option = selector.getElementsByTagName('li')[3];
284 Simulate.click(option);
285 setTimeout(next, 100);
287 expect(change).to.be.ok();
288 expect(change.getHourOfDay()).to.be(6);
289 expect(ReactDOM.findDOMNode(header).value).to.be('06:02:04');
290 expect(ReactDOM.findDOMNode(input).value).to.be('06:02:04');
291 expect(picker.state.open).to.be.ok();
293 const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select')[0];
294 const option = selector.getElementsByTagName('li')[4];
295 Simulate.click(option);
296 setTimeout(next, 100);
298 expect(change).to.be.ok();
299 expect(change.getHourOfDay()).to.be(8);
300 expect(ReactDOM.findDOMNode(header).value).to.be('08:02:04');
301 expect(ReactDOM.findDOMNode(input).value).to.be('08:02:04');
302 expect(picker.state.open).to.be.ok();