bug(material/datepicker): Focus moves to a date cell instead of returning to the period button after selecting a year/month (WCAG 2.4.3) #34013

Is this a regression?

No, this behaviour has always existed.

Description

When the calendar’s period button (“Choose month and year”) is activated by keyboard, the calendar switches to the multi-year view and then the year view. After the user selects a year and then a month, the calendar returns to the month view and focus moves to a date cell in the calendar grid. It does not return to the period button that opened the view.

This affects keyboard and screen reader users. They can’t easily change the month or year again, because the next Tab or Shift+Tab stop is unpredictable. They have to navigate back through the grid to reach the period button. We believe this fails WCAG 2.2 SC 2.4.3 (Focus Order) in accessibility audits, because the focus destination after the interaction doesn’t preserve a logical, predictable order relative to the control that triggered it.

Reproduction

This reproduces on the official Angular Material documentation example: https://material.angular.dev/components/datepicker/overview#datepicker-custom-icon

Steps to reproduce (keyboard only):
1.Open the datepicker with the “Open calendar” button (Enter).
2.Press Tab until the “Choose month and year” period button is focused, then press Enter.
3.Use the arrow keys to select a year and press Enter.
4.Use the arrow keys to select a month and press Enter.
5.Observe where focus lands.

Expected Behavior

Focus returns to the period button that opened the view, so users can change the month/year again or Tab onward predictably. Alternatively, expose an option to control this, for example an input on mat-calendar.

Actual Behavior

Focus moves to a date cell (.mat-calendar-body-cell) in the month grid. The period button loses focus and the user has to navigate back to it manually.

Environment

• Angular: 19.2.14
• CDK/Material: 19.2.19
• Browser(s): Chrome, Safari
• Operating System : macOS