diff --git a/src/material/datepicker/calendar-body.ts b/src/material/datepicker/calendar-body.ts index ef34dc45fbff..154693da2cb8 100644 --- a/src/material/datepicker/calendar-body.ts +++ b/src/material/datepicker/calendar-body.ts @@ -197,21 +197,23 @@ export class MatCalendarBody implements OnChanges, OnDestroy { /** Focuses the active cell after the microtask queue is empty. */ _focusActiveCell(movePreview = true) { - this._ngZone.runOutsideAngular(() => { - this._ngZone.onStable.pipe(take(1)).subscribe(() => { - const activeCell: HTMLElement | null = this._elementRef.nativeElement.querySelector( - '.mat-calendar-body-active', - ); - - if (activeCell) { - if (!movePreview) { - this._skipNextFocus = true; + setTimeout(() => { + this._ngZone.runOutsideAngular(() => { + this._ngZone.onStable.pipe(take(1)).subscribe(() => { + const activeCell: HTMLElement | null = this._elementRef.nativeElement.querySelector( + '.mat-calendar-body-active', + ); + + if (activeCell) { + if (!movePreview) { + this._skipNextFocus = true; + } + + activeCell.focus(); } - - activeCell.focus(); - } + }); }); - }); + }, 50); } /** Gets whether a value is the start of the main range. */ diff --git a/src/material/datepicker/calendar-header.html b/src/material/datepicker/calendar-header.html index 7b7595dc14df..de4b67fdd6ec 100644 --- a/src/material/datepicker/calendar-header.html +++ b/src/material/datepicker/calendar-header.html @@ -2,8 +2,7 @@