diff --git a/CHANGELOG.md b/CHANGELOG.md index 94fb8fb6b..83e30d268 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,17 @@ Changelog is rather internal in nature. See release notes for the public overvie ## Upcoming version 5.x.x (`develop` branch) +- [#718] + - **Description:** This pull request resolves failing `KDateCalendar` component tests that occurred on the last day of the month in open pull requests by setting dates manually in the tests. Additionally, the `KDateCalendar` is updated to show the month of the `lastAllowedDate` property. + - **Products impact:** none + - **Addresses:** https://github.com/learningequality/kolibri-design-system/issues/713 + - **Components:** - + - **Breaking:** no + - **Impacts a11y:** - + - **Guidance:** - + +[#718]: https://github.com/learningequality/kolibri-design-system/pull/718 + - [#687] - **Description:** Adds logic that inserts ARIA live assertive and polite regions to an application's document body during KDS initialization and documents this on the new "Installation" page. Relatedly adds `useKLiveRegion` composable with public methods for updating the live regions with assertive and polite messages. - **Products impact:** new API diff --git a/lib/KDateRange/KDateCalendar.vue b/lib/KDateRange/KDateCalendar.vue index f9c1869d2..5fca08778 100644 --- a/lib/KDateRange/KDateCalendar.vue +++ b/lib/KDateRange/KDateCalendar.vue @@ -157,8 +157,9 @@ }, numOfDays: 7, isFirstChoice: this.selectedStartDate == null ? true : false, - activeMonth: new Date().getMonth() - 1 == -1 ? 11 : new Date().getMonth() - 1, - activeYearStart: new Date().getFullYear(), + activeMonth: + this.lastAllowedDate.getMonth() - 1 == -1 ? 11 : this.lastAllowedDate.getMonth() - 1, + activeYearStart: this.lastAllowedDate.getFullYear(), }; }, computed: { diff --git a/lib/KDateRange/__tests__/KDateRange.spec.js b/lib/KDateRange/__tests__/KDateRange.spec.js index bcf51c83b..ae7d3d0ae 100644 --- a/lib/KDateRange/__tests__/KDateRange.spec.js +++ b/lib/KDateRange/__tests__/KDateRange.spec.js @@ -90,9 +90,9 @@ describe('KDateRange component', () => { const KDATECALENDAR_PROPS = { firstAllowedDate: new Date(2022, 0, 1), - lastAllowedDate: new Date(), + lastAllowedDate: new Date(2022, 10, 1), selectedStartDate: new Date(2022, 8, 1), - selectedEndDate: new Date(), + selectedEndDate: new Date(2022, 10, 1), previousMonthText: 'Previous Month', nextMonthText: 'Next Month', }; @@ -120,16 +120,19 @@ describe('KDateCalendar component', () => { expect(wrapper.exists()).toBe(true); }); - it('the month and year display on the left-side calendar view should contain the previous month', async () => { + it('the month and year display on the left-side calendar view should display the previous month of the lastAllowedDate', async () => { const previousMonthDisplay = getKDateCalendarElements(wrapper).previousMonthDisplay(); - const previousMonth = new Date().setDate(0); + const lastAllowedDate = wrapper.props().lastAllowedDate; + const previousMonth = new Date(lastAllowedDate); + previousMonth.setMonth(lastAllowedDate.getMonth() - 1); const date = Vue.prototype.$formatDate(previousMonth, { month: 'long', year: 'numeric' }); expect(previousMonthDisplay.text()).toBe(date); }); - it('the month and year display on the right-side calendar view should contain the current month', async () => { + it('the month and year display on the right-side calendar view should display the current month of the lastAllowedDate', async () => { const currentMonthDisplay = getKDateCalendarElements(wrapper).currentMonthDisplay(); - const date = Vue.prototype.$formatDate(new Date(), { month: 'long', year: 'numeric' }); + const lastAllowedDate = wrapper.props().lastAllowedDate; + const date = Vue.prototype.$formatDate(lastAllowedDate, { month: 'long', year: 'numeric' }); expect(currentMonthDisplay.text()).toBe(date); }); });