From 091b1071de846506de56666e218a9dda979e0c2e Mon Sep 17 00:00:00 2001
From: gpbl <io@gpbl.org>
Date: Thu, 23 Jul 2015 08:05:30 +0200
Subject: [PATCH] Change month when clicking on an enabled outside day (fix
 #29)

---
 src/DayPicker.js   |  6 ++++++
 tests/DayPicker.js | 51 +++++++++++++++++++++++++++++++++++++++++++++-
 2 files changed, 56 insertions(+), 1 deletion(-)

diff --git a/src/DayPicker.js b/src/DayPicker.js
index 3992cdc665..a54cd8a02e 100644
--- a/src/DayPicker.js
+++ b/src/DayPicker.js
@@ -360,11 +360,17 @@ class DayPicker extends Component {
 
   handleDayTouchTap(e, day, modifiers) {
     e.persist();
+    if (day.getMonth() !== this.state.currentMonth.getMonth()) {
+      this.showMonth(day);
+    }
     this.props.onDayTouchTap(e, day, modifiers);
   }
 
   handleDayClick(e, day, modifiers) {
     e.persist();
+    if (day.getMonth() !== this.state.currentMonth.getMonth()) {
+      this.showMonth(day);
+    }
     this.props.onDayClick(e, day, modifiers);
   }
 
diff --git a/tests/DayPicker.js b/tests/DayPicker.js
index c34636f7f0..5e822787f6 100644
--- a/tests/DayPicker.js
+++ b/tests/DayPicker.js
@@ -539,7 +539,7 @@ describe("DayPicker", () => {
 
   });
 
-  it("does not call mouse events on outside days", () => {
+  it("does not call mouse events on disabled outside days", () => {
 
     React.initializeTouchEvents(true);
     require("react-tap-event-plugin")();
@@ -576,6 +576,55 @@ describe("DayPicker", () => {
 
   });
 
+  it("changes the month when tapping on enabled outside days", () => {
+
+    React.initializeTouchEvents(true);
+    require("react-tap-event-plugin")();
+
+    const handleTouchTap = sinon.spy();
+
+    const dayPickerEl = TestUtils.renderIntoDocument(
+      <DayPicker
+        initialMonth={new Date(2015, 6, 5)}
+        enableOutsideDays={true}
+        onDayTouchTap={handleTouchTap}
+      />
+    );
+
+    const daysEl = TestUtils.scryRenderedDOMComponentsWithClass(dayPickerEl,
+      "DayPicker-Day");
+    const dayEl = daysEl[0];
+
+    TestUtils.Simulate.touchTap(dayEl);
+    expect(handleTouchTap).to.have.been.called;
+    expect(dayPickerEl.state.currentMonth.getMonth()).to.equal(5);
+  });
+
+  it("changes the month when clicking on enabled outside days", () => {
+
+    React.initializeTouchEvents(true);
+    require("react-tap-event-plugin")();
+
+    const handleClick = sinon.spy();
+
+    const dayPickerEl = TestUtils.renderIntoDocument(
+      <DayPicker
+        initialMonth={new Date(2015, 6, 5)}
+        enableOutsideDays={true}
+        onDayClick={handleClick}
+      />
+    );
+
+    const daysEl = TestUtils.scryRenderedDOMComponentsWithClass(dayPickerEl,
+      "DayPicker-Day");
+    const dayEl = daysEl[0];
+
+    TestUtils.Simulate.click(dayEl);
+    expect(handleClick).to.have.been.called;
+    expect(dayPickerEl.state.currentMonth.getMonth()).to.equal(5);
+
+  });
+
   it("calls onDayClick when enter key is pressed on a day cell", () => {
     const handleDayClick = sinon.spy();
     const dayPickerEl = TestUtils.renderIntoDocument(