Skip to content

Commit

Permalink
fix(material/timepicker): always re-focus input
Browse files Browse the repository at this point in the history
Fixes that nothing was happening if the user clicks on the toggle while the timepicker is open.
  • Loading branch information
crisbeto committed Oct 4, 2024
1 parent d3cbd48 commit 14e9ec7
Showing 1 changed file with 11 additions and 6 deletions.
17 changes: 11 additions & 6 deletions src/material/timepicker/timepicker.ts
Original file line number Diff line number Diff line change
Expand Up @@ -208,20 +208,25 @@ export class MatTimepicker<D> implements OnDestroy, MatOptionParentComponent {

/** Opens the timepicker. */
open(): void {
if (!this._input || this._isOpen()) {
if (!this._input) {
return;
}

// Focus should already be on the input, but this call is in case the timepicker is opened
// programmatically. We need to call this even if the timepicker is already open, because
// the user might be clicking the toggle.
this._input.focus();

if (this._isOpen()) {
return;
}

this._isOpen.set(true);
this._generateOptions();
const overlayRef = this._getOverlayRef();
overlayRef.updateSize({width: this._input.getOverlayOrigin().nativeElement.offsetWidth});
this._portal ??= new TemplatePortal(this._panelTemplate(), this._viewContainerRef);
overlayRef.attach(this._portal);
this._isOpen.set(true);

// Focus should already be on the input, but this call is
// in case the timepicker is opened programmatically.
this._input.focus();
this._onOpenRender?.destroy();
this._onOpenRender = afterNextRender(
() => {
Expand Down

0 comments on commit 14e9ec7

Please sign in to comment.