Change month when clicking on an enabled outside day (fix #29)

gpbl · Jul 23, 2015 · 091b107 · 091b107
1 parent 10d4566
commit 091b107
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 1 deletion.
diff --git 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
@@ -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(