Fix the issue that dynamically updated disabled date doesn't update the central date (#2411)

* Fix the issue that dynamically updated disabled date doesn't update the central date

* Fix types

* Remove setTimeout

* Add changeset

* Improve the changeset description
This commit is contained in:
ByoungYong Kim 2024-11-21 15:40:12 +01:00 committed by GitHub
parent e2b9bdc8cd
commit a51e28d7a5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 35 additions and 2 deletions

View file

@ -0,0 +1,5 @@
---
'@lion/ui': patch
---
fix(calendar): align central date with dynamic disabled dates

View file

@ -364,7 +364,11 @@ export class LionCalendar extends LocalizeMixin(LitElement) {
if (this.selectedDate) {
this.focusSelectedDate();
} else {
this.centralDate = /** @type {Date} */ (this.__initialCentralDate);
if (!this.__isEnabledDate(/** @type {Date} */ (this.__initialCentralDate))) {
this.centralDate = this.findNearestEnabledDate(this.__initialCentralDate);
} else {
this.centralDate = /** @type {Date} */ (this.__initialCentralDate);
}
this.focusCentralDate();
}
}

View file

@ -19,9 +19,10 @@ import '@lion/ui/define/lion-input-datepicker.js';
*/
function getProtectedMembersDatepicker(datepickerEl) {
// @ts-ignore
const { __invokerId: invokerId } = datepickerEl;
const { __invokerId: invokerId, _calendarNode: calendarNode } = datepickerEl;
return {
invokerId,
calendarNode,
};
}
@ -410,6 +411,29 @@ describe('<lion-input-datepicker>', () => {
expect(el.__calendarMaxDate.toString()).to.equal(new Date('2019/07/15').toString());
});
it('should update the central date of Calendar if updated validator made the current central date disabled', async () => {
const initialValidators = [new MaxDate(new Date('2000/01/01'))];
const updatedValidators = [new MaxDate(new Date('2020/01/01'))];
const el = await fixture(html`
<lion-input-datepicker .validators="${initialValidators}"></lion-input-datepicker>
`);
const obj = new DatepickerInputObject(el);
await obj.openCalendar();
expect(getProtectedMembersDatepicker(el).calendarNode.centralDate.toString()).to.equal(
new Date('2000/01/01').toString(),
);
await obj.closeCalendar();
el.validators = updatedValidators;
await obj.openCalendar();
expect(getProtectedMembersDatepicker(el).calendarNode.centralDate.toString()).to.equal(
new Date('2020/01/01').toString(),
);
});
it('should show error on invalid date passed to modelValue', async () => {
const myDate = new Date('foo');
const el = await fixture(html`