diff --git a/src/DateRangePicker.jsx b/src/DateRangePicker.jsx index ba5d06f8..ea01d410 100644 --- a/src/DateRangePicker.jsx +++ b/src/DateRangePicker.jsx @@ -420,6 +420,13 @@ const DateRangePicker = React.createClass({ }); }, + rangesOverlap(rangeA, rangeB) { + if (rangeA.overlaps(rangeB) || rangeA.contains(rangeB.start) || rangeA.contains(rangeB.end)) { + return true; + } + return false; + }, + renderCalendar(index) { let { bemBlock, @@ -452,21 +459,17 @@ const DateRangePicker = React.createClass({ let monthEnd = monthDates.last().last(); let monthRange = moment.range(monthStart, monthEnd); - if (moment.isMoment(value)) { - if (!monthRange.contains(value)) { - value = null; - } - } else if (isMomentRange(value)) { - if (!monthRange.overlaps(value)) { - value = null; - } + if (moment.isMoment(value) && !monthRange.contains(value)) { + value = null; + } else if (isMomentRange(value) && !(this.rangesOverlap(monthRange, value))) { + value = null; } if (!moment.isMoment(highlightedDate) || !monthRange.contains(highlightedDate)) { highlightedDate = null; } - if (!isMomentRange(highlightedRange) || !monthRange.overlaps(highlightedRange)) { + if (!isMomentRange(highlightedRange) || !(this.rangesOverlap(monthRange, highlightedRange))) { highlightedRange = null; } diff --git a/src/tests/DateRangePicker.spec.js b/src/tests/DateRangePicker.spec.js index 2616062e..28e66812 100644 --- a/src/tests/DateRangePicker.spec.js +++ b/src/tests/DateRangePicker.spec.js @@ -312,6 +312,18 @@ describe('The DateRangePicker component', function () { expect(calendarMonthComponent.props.highlightedRange).toBe(highlightedRange); }); + it('is set to highlightedRange on month boundaries', function () { + var highlightedRange = moment.range(moment('2016 07 31', 'YYYY MM DD'), moment('2016 08 01', 'YYYY MM DD')); + this.useDocumentRenderer({ + firstOfWeek: 1, + initialYear: 2016, + initialMonth: 6, + }); + this.renderedComponent.highlightRange(highlightedRange); + var calendarMonthComponent = TestUtils.scryRenderedComponentsWithType(this.renderedComponent, CalendarMonth)[0]; + expect(calendarMonthComponent.props.highlightedRange).toBe(highlightedRange); + }); + }); describe('each component takes in a large number of other attributes', function () {