diff --git a/src/month.jsx b/src/month.jsx index 488825da4..737b927e7 100644 --- a/src/month.jsx +++ b/src/month.jsx @@ -592,6 +592,7 @@ export default class Month extends React.Component { minDate, maxDate, preSelection, + disabledKeyboardNavigation } = this.props; return classnames( "react-datepicker__quarter-text", @@ -606,7 +607,7 @@ export default class Month extends React.Component { selected, ), "react-datepicker__quarter-text--keyboard-selected": - utils.getQuarter(preSelection) === q, + !disabledKeyboardNavigation && utils.getQuarter(preSelection) === q, "react-datepicker__quarter-text--in-selecting-range": this.isInSelectingRangeQuarter(q), "react-datepicker__quarter-text--in-range": utils.isQuarterInRange( diff --git a/test/month_test.test.js b/test/month_test.test.js index c6149b8d6..31ccee3d1 100644 --- a/test/month_test.test.js +++ b/test/month_test.test.js @@ -908,6 +908,29 @@ describe("Month", () => { utils.newDate("2015-01-01").toString(), ); }); + + describe("if keyboard navigation is disabled", () => { + it("should not have the selected class", () => { + let preSelected = utils.newDate("2015-08-01"); + const setPreSelection = (param) => { + preSelected = param; + }; + const quartersComponent = renderQuarters({ + selected: utils.newDate("2015-08-01"), + day: utils.newDate("2015-08-01"), + setPreSelection: setPreSelection, + preSelection: preSelected, + disabledKeyboardNavigation: true, + showQuarterYearPicker: true + }); + + expect( + quartersComponent + .find(".react-datepicker__quarter-text--selected") + .hasClass("react-datepicker__quarter-text--keyboard-selected"), + ).toBe(false); + }); + }); }); describe("Keyboard navigation", () => {