diff --git a/src/index.jsx b/src/index.jsx index 0901f2a15..d32a0fd68 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -108,9 +108,11 @@ export default class DatePicker extends React.Component { onClickOutside: PropTypes.func, onChangeRaw: PropTypes.func, onFocus: PropTypes.func, + onInputClick: PropTypes.func, onKeyDown: PropTypes.func, onMonthChange: PropTypes.func, onYearChange: PropTypes.func, + open: PropTypes.bool, openToDate: PropTypes.object, peekNextMonth: PropTypes.bool, placeholderText: PropTypes.string, @@ -171,6 +173,7 @@ export default class DatePicker extends React.Component { onFocus() {}, onBlur() {}, onKeyDown() {}, + onInputClick() {}, onSelect() {}, onClickOutside() {}, onMonthChange() {}, @@ -272,6 +275,11 @@ export default class DatePicker extends React.Component { }); }; + isCalendarOpen = () => + this.props.open === undefined + ? this.state.open && !this.props.disabled && !this.props.readOnly + : this.props.open; + handleFocus = event => { if (!this.state.preventFocus) { this.props.onFocus(event); @@ -428,6 +436,8 @@ export default class DatePicker extends React.Component { if (!this.props.disabled && !this.props.readOnly) { this.setOpen(true); } + + this.props.onInputClick(); }; onInputKeyDown = event => { @@ -514,10 +524,7 @@ export default class DatePicker extends React.Component { }; renderCalendar = () => { - if ( - !this.props.inline && - (!this.state.open || this.props.disabled || this.props.readOnly) - ) { + if (!this.props.inline && !this.isCalendarOpen()) { return null; } return ( @@ -673,9 +680,7 @@ export default class DatePicker extends React.Component { return ( diff --git a/test/datepicker_test.js b/test/datepicker_test.js index 9e3dd05a5..1fa527a2c 100644 --- a/test/datepicker_test.js +++ b/test/datepicker_test.js @@ -1037,4 +1037,26 @@ describe("DatePicker", () => { datePicker.clear(); expect(datePicker.state.inputValue).to.be.null; }); + it("should not open when open is false and input is focused", () => { + var datePicker = TestUtils.renderIntoDocument(); + var dateInput = datePicker.input; + TestUtils.Simulate.focus(ReactDOM.findDOMNode(dateInput)); + expect(datePicker.calendar).to.not.exist; + }); + it("should open when open is true", () => { + var datePicker = TestUtils.renderIntoDocument(); + expect(datePicker.calendar).to.exist; + }); + it("should fire onInputClick when input is clicked", () => { + const onInputClickSpy = sinon.spy(); + var datePicker = TestUtils.renderIntoDocument( + + ); + var dateInput = datePicker.input; + TestUtils.Simulate.click(ReactDOM.findDOMNode(dateInput)); + defer(() => { + assert(onInputClickSpy.calledOnce, "should fire onInputClick"); + done(); + }); + }); });