diff --git a/src/month.tsx b/src/month.tsx index 17cce7d034..0e74525c8f 100644 --- a/src/month.tsx +++ b/src/month.tsx @@ -932,6 +932,7 @@ export default class Month extends Component { "react-datepicker__quarter-text--range-start": this.isRangeStartQuarter(q), "react-datepicker__quarter-text--range-end": this.isRangeEndQuarter(q), + "react-datepicker__quarter-text--today": this.isCurrentQuarter(day, q), }, ); }; diff --git a/src/test/month_test.test.tsx b/src/test/month_test.test.tsx index fba4b839ec..2885aae645 100644 --- a/src/test/month_test.test.tsx +++ b/src/test/month_test.test.tsx @@ -16,6 +16,7 @@ import { getMonth, getMonthShortInLocale, getQuarter, + getQuarterShortInLocale, getStartOfMonth, getStartOfQuarter, getStartOfWeek, @@ -1247,6 +1248,60 @@ describe("Month", () => { ).toBe(true); }); + it("should return quarter-text--today class if quarter is current year's quarter", () => { + const date = new Date(); + const { container } = render( + , + ); + const quarter = container.querySelectorAll( + ".react-datepicker__quarter-text--today", + )[0]?.textContent; + expect(quarter).toBe(getQuarterShortInLocale(getQuarter(date))); + }); + + it("should not return quarter-text--today class if quarter is not current year's quarter", () => { + const lastYearDate = new Date(); + lastYearDate.setFullYear(lastYearDate.getFullYear() - 1); + const { container } = render( + , + ); + const quarters = container.querySelectorAll( + ".react-datepicker__quarter-text--today", + ); + expect(quarters).toHaveLength(0); + }); + + it("should include aria-current property if quarter is current year's quarter", () => { + const date = new Date(); + const { container } = render( + , + ); + const ariaCurrent = container + .querySelector(".react-datepicker__quarter-text--today") + ?.getAttribute("aria-current"); + expect(ariaCurrent).toBe("date"); + }); + + it("should not include aria-current property if quarter is not current year's quarter", () => { + const lastYearDate = new Date(); + lastYearDate.setFullYear(lastYearDate.getFullYear() - 1); + const { container } = render( + , + ); + const ariaCurrent = container + .querySelector(".react-datepicker__quarter-text") + ?.getAttribute("aria-current"); + expect(ariaCurrent).toBeNull(); + }); + it("should enable keyboard focus on the preselected component", () => { const { container } = render(