Merge pull request #604 from ah-adarlow/master

Fixed DayPickerInput not calling dayPickerProps.onMonthChange

Author: gpbl

src/DayPickerInput.js

@@ -122,6 +122,7 @@ export default class DayPickerInput extends React.Component {
     this.handleInputKeyDown = this.handleInputKeyDown.bind(this);
     this.handleInputKeyUp = this.handleInputKeyUp.bind(this);
     this.handleDayClick = this.handleDayClick.bind(this);
+    this.handleMonthChange = this.handleMonthChange.bind(this);
   }
 
   componentWillReceiveProps(nextProps) {
@@ -356,6 +357,17 @@ export default class DayPickerInput extends React.Component {
     }
   }
 
+  handleMonthChange(month) {
+    this.setState({ month }, () => {
+      if (
+        this.props.dayPickerProps &&
+        this.props.dayPickerProps.onMonthChange
+      ) {
+        this.props.dayPickerProps.onMonthChange(month);
+      }
+    });
+  }
+
   handleDayClick(day, modifiers, e) {
     const {
       clickUnselectsDay,
@@ -443,7 +455,7 @@ export default class DayPickerInput extends React.Component {
           month={this.state.month}
           selectedDays={selectedDay}
           onDayClick={this.handleDayClick}
-          onMonthChange={month => this.setState({ month })}
+          onMonthChange={this.handleMonthChange}
         />
       </Overlay>
     );

test/daypickerinput/events.js

@@ -370,5 +370,40 @@ describe('DayPickerInput', () => {
         expect(selectedDays.at(1)).toHaveText('9');
       });
     });
+
+    describe('onMonthChange', () => {
+      it('should update state when month changes', () => {
+        const wrapper = mount(
+          <DayPickerInput
+            dayPickerProps={{
+              initialMonth: new Date(2015, 7),
+            }}
+          />
+        );
+        const instance = wrapper.instance();
+        instance.showDayPicker();
+        wrapper.update();
+        instance.getDayPicker().showNextMonth();
+        expect(instance.state.month.getMonth()).toEqual(8);
+      });
+
+      it('should call onMonthChange when month changes', () => {
+        const handleMonthChange = jest.fn();
+        const wrapper = mount(
+          <DayPickerInput
+            dayPickerProps={{
+              onMonthChange: handleMonthChange,
+              initialMonth: new Date(2015, 7),
+            }}
+          />
+        );
+        const instance = wrapper.instance();
+        instance.showDayPicker();
+        wrapper.update();
+        instance.getDayPicker().showNextMonth();
+        expect(handleMonthChange).toHaveBeenCalled();
+        expect(handleMonthChange.mock.calls[0][0].getMonth()).toEqual(8);
+      });
+    });
   });
 });