fix(material/core): mat-optgroup labels are read twice during screen-reader page navigation.

Fixed by adding aria-hidden="true" to the <label> elements, so that while screenreaders will still announce the label text for the group (due to the aria-labelledby property on mat-optgroup), they will skip over the actual label element. Additionally, changed the <label> to a <span> to make it clear that the text is visual only and not carrying any special semantic meaning for the a11y tree.

Author: Akshay Verma

src/material/core/option/optgroup.html

@@ -1,2 +1,2 @@
-<label class="mat-optgroup-label" [id]="_labelId">{{ label }} <ng-content></ng-content></label>
+<span class="mat-optgroup-label" aria-hidden="true" [id]="_labelId">{{ label }} <ng-content></ng-content></span>
 <ng-content select="mat-option, ng-container"></ng-content>