fix(material/core): Fix MacOS Hover feature compatibility with optgroup (#27081)

zarend · zarend · commit d2e8a55b3b34 · 2023-05-13T02:22:12.000Z
Corrects ARIA semantics for the mat-optgroup component. Add role="presentation" to the label and remove aria-hidden="true" from the label. Fix compatibility issue with MAC Hover text a11y feature #27080. The label of the option group does not need to be aria-hidden, and the Mac Hover text feature seems to rely on it. Fix #27080 (cherry picked from commit 8afe9cd)
diff --git a/src/material/legacy-core/option/optgroup.html b/src/material/legacy-core/option/optgroup.html
@@ -1,2 +1,2 @@
-<span class="mat-optgroup-label" aria-hidden="true" [id]="_labelId">{{ label }} <ng-content></ng-content></span>
+<span class="mat-optgroup-label" role="presentation" [id]="_labelId">{{ label }} <ng-content></ng-content></span>
 <ng-content select="mat-option, ng-container"></ng-content>

Original file line number	Diff line number	Diff line change
`@@ -1,2 +1,2 @@`
`1`		`-<span class="mat-optgroup-label" aria-hidden="true" [id]="_labelId">{{ label }} <ng-content></ng-content></span>`
	`1`	`+<span class="mat-optgroup-label" role="presentation" [id]="_labelId">{{ label }} <ng-content></ng-content></span>`
`2`	`2`	`<ng-content select="mat-option, ng-container"></ng-content>`