From 27f73ba4c5de0a414efd2ded3904049938f39b36 Mon Sep 17 00:00:00 2001 From: Alexander Kozlovskiy Date: Sat, 16 Dec 2023 15:37:00 -0600 Subject: [PATCH] Calendar: it should not be possible to focus dates that are disabled using combination of disabledDates+min/max (#26279) --- .../devextreme/js/ui/calendar/ui.calendar.js | 18 ++++++++++++- .../calendar.tests.js | 27 ++++++++++++++++++- 2 files changed, 43 insertions(+), 2 deletions(-) diff --git a/packages/devextreme/js/ui/calendar/ui.calendar.js b/packages/devextreme/js/ui/calendar/ui.calendar.js index ef583cdb507b..bcd4aa16da1c 100644 --- a/packages/devextreme/js/ui/calendar/ui.calendar.js +++ b/packages/devextreme/js/ui/calendar/ui.calendar.js @@ -344,13 +344,29 @@ const Calendar = Editor.inherit({ } if(this._view.isDateDisabled(baseDate) || this._view.isDateDisabled(currentDate)) { - this._waitRenderView(offset > 0 ? 1 : -1); + const direction = offset > 0 ? 1 : -1; + const isViewDisabled = direction === 1 ? this._isNextViewDisabled() : this._isPrevViewDisabled(); + + if(!isViewDisabled) { + this._waitRenderView(direction); + } else { + this._moveToClosestAvailableDate(currentDate); + } + } else { this._skipNavigate = true; this.option('currentDate', currentDate); } }, + _isNextViewDisabled() { + return this._navigator._nextButton.option('disabled'); + }, + + _isPrevViewDisabled() { + return this._navigator._prevButton.option('disabled'); + }, + _areDatesInSameView(zoomLevel, date1, date2) { switch(zoomLevel) { case ZOOM_LEVEL.MONTH: diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/calendar.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/calendar.tests.js index ae960311c675..f5d79b5ead88 100644 --- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/calendar.tests.js +++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/calendar.tests.js @@ -4091,6 +4091,32 @@ QUnit.module('disabledDates option', { assert.deepEqual(this.calendar.option('currentDate'), new Date(2010, 10, 10), 'currentDate is the closest available date'); }); + + QUnit.test('It should not be possible to focus dates that are disabled using combination of disabledDates+min/max', function(assert) { + const calendar = this.calendar; + + calendar.option({ + value: new Date('2023/09/11'), + max: new Date('2023/09/16'), + min: new Date('2023/09/10'), + disabledDates: (d) => { + const day = d.date.getDay(); + + return d.view === 'month' && day === 0 || day === 6; + }, + }); + const $viewsWrapper = $(calendar._$viewsWrapper); + + calendar.focus(); + + triggerKeydown($viewsWrapper, LEFT_ARROW_KEY_CODE); + assert.deepEqual(calendar.option('currentDate'), new Date('2023/09/11'), 'left disabledDate is not focused'); + + calendar.option('value', new Date('2023/09/15')); + + triggerKeydown($viewsWrapper, RIGHT_ARROW_KEY_CODE); + assert.deepEqual(calendar.option('currentDate'), new Date('2023/09/15'), 'right disabledDate is not focused'); + }); }); @@ -4184,7 +4210,6 @@ QUnit.module('Current date', { iterateViews($.proxy((_, type) => { this.reinit(); - const $element = this.$element; const calendar = this.$element.dxCalendar($.extend( {}, { zoomLevel: type, focusStateEnabled: true },