diff --git a/src/test/year_picker_test.test.tsx b/src/test/year_picker_test.test.tsx index ef5e16d91..fad491ec6 100644 --- a/src/test/year_picker_test.test.tsx +++ b/src/test/year_picker_test.test.tsx @@ -617,6 +617,23 @@ describe("YearPicker", () => { describe("keyboard-selected", () => { const className = "react-datepicker__year-text--keyboard-selected"; + it("should set the key-selected class automatically to the current year when there is no selected date passed", () => { + const { container } = render( + , + ); + + const dateInput = safeQuerySelector(container, "input"); + fireEvent.focus(dateInput); + + const selectedYear = container.querySelector( + ".react-datepicker__year-text--keyboard-selected", + ); + expect(selectedYear).toBeDefined(); + + const currentYear = new Date().getFullYear(); + expect(selectedYear?.textContent).toBe(`${currentYear}`); + }); + it("should set the date to the selected year of the previous period when previous button clicked", () => { let date: Date | null; const expectedDate = getStartOfYear(setYear(newDate(), 2008)); diff --git a/src/year.tsx b/src/year.tsx index 5ac50998d..271c3f18b 100644 --- a/src/year.tsx +++ b/src/year.tsx @@ -218,26 +218,38 @@ export default class Year extends Component { isKeyboardSelected = (y: number) => { if ( + this.props.disabledKeyboardNavigation || this.props.date === undefined || - this.props.selected == null || this.props.preSelection == null ) { return; } - const { minDate, maxDate, excludeDates, includeDates, filterDate } = - this.props; + const { + minDate, + maxDate, + excludeDates, + includeDates, + filterDate, + selected, + } = this.props; const date = getStartOfYear(setYear(this.props.date, y)); const isDisabled = (minDate || maxDate || excludeDates || includeDates || filterDate) && isYearDisabled(y, this.props); + const isSelectedDay = + !!selected && isSameDay(date, getStartOfYear(selected)); + const isKeyboardSelectedDay = isSameDay( + date, + getStartOfYear(this.props.preSelection), + ); + return ( - !this.props.disabledKeyboardNavigation && !this.props.inline && - !isSameDay(date, getStartOfYear(this.props.selected)) && - isSameDay(date, getStartOfYear(this.props.preSelection)) && + !isSelectedDay && + isKeyboardSelectedDay && !isDisabled ); };