X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=tests%2FSelect.spec.jsx;h=b2c111d842f7468ca8dcb7f621021eb7c310da5f;hb=9b7808040c6cfdf6df60fffe10c86bb2a681cd9e;hp=ef9ca3267c9ca6a25151553f68764ab26f4de0e3;hpb=dd2f6abda00cea99ec0a24e3f162fabeba7ac176;p=github%2Ffretlink%2Ftime-picker.git diff --git a/tests/Select.spec.jsx b/tests/Select.spec.jsx index ef9ca32..b2c111d 100644 --- a/tests/Select.spec.jsx +++ b/tests/Select.spec.jsx @@ -1,7 +1,7 @@ import ReactDOM from 'react-dom'; import React from 'react'; import TimePicker from '../src/TimePicker'; -import TestUtils from 'react-addons-test-utils'; +import TestUtils from 'react-dom/test-utils'; const Simulate = TestUtils.Simulate; import expect from 'expect.js'; import async from 'async'; @@ -33,6 +33,34 @@ describe('Select', () => { document.body.removeChild(container); }); + describe('select panel', () => { + it('select panel reacts to mouseenter and mouseleave correctly', (done) => { + const picker = renderPicker(); + const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, + 'rc-time-picker-input')[0]; + async.series([(next) => { + Simulate.click(input); + setTimeout(next, 100); + }, (next) => { + const re = /(^|\s+)rc-time-picker-panel-select-active(\s+|$)/; + const selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, + 'rc-time-picker-panel-select')[0]; + + expect(re.test(selector.className)).to.be(false); + + Simulate.mouseEnter(selector); + expect(re.test(selector.className)).to.be(true); + + Simulate.mouseLeave(selector); + expect(re.test(selector.className)).to.be(false); + + next(); + }], () => { + done(); + }); + }); + }); + describe('select number', () => { it('select number correctly', (done) => { const picker = renderPicker(); @@ -371,12 +399,120 @@ describe('Select', () => { expect(picker.state.open).to.be(true); selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, 'rc-time-picker-panel-select'); + setTimeout(next, 100); + }, (next) => { + expect(selector.length).to.be(3); + + next(); + }], () => { + done(); + }); + }); + + + it('renders 5am correctly', (done) => { + const picker = renderPicker({ + use12Hours: true, + defaultValue: moment().hour(0).minute(0).second(0), + showSecond: false, + format: undefined, + }); + expect(picker.state.open).not.to.be.ok(); + const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, + 'rc-time-picker-input')[0]; + let selector; + async.series([(next) => { + expect(picker.state.open).to.be(false); + + Simulate.click(input); + setTimeout(next, 100); + }, (next) => { + expect(picker.state.open).to.be(true); + selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, + 'rc-time-picker-panel-select')[0]; expect((input).value).to.be('12:00 am'); + const option = selector.getElementsByTagName('li')[3]; + Simulate.click(option); + setTimeout(next, 100); + }, (next) => { + expect((input).value).to.be('3:00 am'); + next(); + }], () => { + done(); + }); + }); + + + it('renders 12am/pm correctly', (done) => { + const picker = renderPicker({ + use12Hours: true, + defaultValue: moment().hour(0).minute(0).second(0), + showSecond: false, + format: undefined, + }); + expect(picker.state.open).not.to.be.ok(); + const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, + 'rc-time-picker-input')[0]; + let selector; + async.series([(next) => { + expect(picker.state.open).to.be(false); + Simulate.click(input); setTimeout(next, 100); }, (next) => { - expect(selector.length).to.be(3); + expect(picker.state.open).to.be(true); + selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, + 'rc-time-picker-panel-select')[2]; + expect((input).value).to.be('12:00 am'); + const option = selector.getElementsByTagName('li')[1]; + Simulate.click(option); + setTimeout(next, 200); + }, (next) => { + expect((input).value).to.be('12:00 pm'); + next(); + }, (next) => { + Simulate.click(selector.getElementsByTagName('li')[0]); + setTimeout(next, 200); + }, (next) => { + expect((input).value).to.be('12:00 am'); + next(); + }], () => { + done(); + }); + }); + + it('renders uppercase AM correctly', (done) => { + const picker = renderPicker({ + use12Hours: true, + defaultValue: moment().hour(0).minute(0).second(0), + showSecond: false, + format: 'h:mm A', + }); + expect(picker.state.open).not.to.be.ok(); + const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, + 'rc-time-picker-input')[0]; + let selector; + async.series([(next) => { + expect(picker.state.open).to.be(false); + Simulate.click(input); + setTimeout(next, 100); + }, (next) => { + expect(picker.state.open).to.be(true); + selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, + 'rc-time-picker-panel-select')[2]; + expect((input).value).to.be('12:00 AM'); + const option = selector.getElementsByTagName('li')[1]; + Simulate.click(option); + setTimeout(next, 200); + }, (next) => { + expect((input).value).to.be('12:00 PM'); + next(); + }, (next) => { + Simulate.click(selector.getElementsByTagName('li')[0]); + setTimeout(next, 200); + }, (next) => { + expect((input).value).to.be('12:00 AM'); next(); }], () => { done();