From 33b6773d06fa8f22b3f24a2769ae81f4cc00b659 Mon Sep 17 00:00:00 2001
From: Zach Arend <zachzach@google.com>
Date: Thu, 10 Feb 2022 23:11:21 +0000
Subject: [PATCH] fix(material/datepicker): use aria-live over cdkAriaLive on
 period button

On the period button on the calendar, use `aria-live` over `cdkAriaLive`
because that seems to work better with VoiceOver. This fixes an issue
where VoiceOver did not announce the month after clicking the "Month
Month"/"Previous Month" buttons (#24397).

Fixes #24397
---
 src/material/datepicker/calendar-header.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/material/datepicker/calendar-header.html b/src/material/datepicker/calendar-header.html
index 7b7595dc14df..380b1e82a6ec 100644
--- a/src/material/datepicker/calendar-header.html
+++ b/src/material/datepicker/calendar-header.html
@@ -3,7 +3,7 @@
     <button mat-button type="button" class="mat-calendar-period-button"
             (click)="currentPeriodClicked()" [attr.aria-label]="periodButtonLabel"
             [attr.aria-describedby]="_buttonDescriptionId"
-            cdkAriaLive="polite">
+            [attr.aria-live]="'polite'">
       <span [attr.id]="_buttonDescriptionId">{{periodButtonText}}</span>
       <svg class="mat-calendar-arrow" [class.mat-calendar-invert]="calendar.currentView !== 'month'"
            viewBox="0 0 10 5" focusable="false">