bug(mat-datepicker): Sometimes date picker calendar popup is not closing after selection of date

[parthvegda-wq]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

The mat-datepicker calendar popup occasionally fails to close after a date has been selected or the user attempts to dismiss it by clicking outside of the open calendar. This results in the calendar remaining visible and blocking subsequent interactions on the page until manually closed. The issue appears intermittently, making consistent reproduction challenging.

I have already tried a way of closing it manually after selection of date, but failed to.

Reproduction

Despite significant attempts to isolate the behavior, a consistently reproducible scenario for this issue has not been identified. The intermittent nature of the problem and potential dependencies on external factors make it difficult to replicate in a controlled environment like a StackBlitz. We believe the bug may be triggered by interactions within a larger application context that are hard to simulate in isolation.

For the reference of this issue, I have attached a video of an issue below

Untitled.mov

Expected Behavior

After selecting a date or clicking outside of the mat-datepicker calendar popup, the calendar should close gracefully. The user should be able to continue interacting with the application as normal.

Actual Behavior

Upon selecting a date or attempting to click outside the calendar, the calendar remains open and blocks interaction with other elements on the page. No error messages are displayed in the console.

Environment

• Angular: 18.2.14
• CDK/Material: 18.2.14
• Browser(s): Google Chrome
• Operating System (e.g. Windows, macOS, Ubuntu): Windows, macOS

[crisbeto]

I suspect something in your app might be interfering with it. Normally the calendar should close as soon as you select a date.