Description
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
When using a mat-select inside of a dialog the select applies the aria-owns attribute to the aria-modal="true" element when the select panel is opened. After a selection is made, a critical accessibility issue in axeDevTools v 4.8.2 with error "Ensures all ARIA attributes have valid values" appears. This is due to the previously applied aria-owns id no longer existing on the dom after a selection is made. The aria-owns attribute is only removed from the modal on destroy of the select.
Reproduction
StackBlitz link: https://stackblitz.com/edit/components-issue-mxpfyf?file=src%2Fapp%2Fexample-component.html
Steps to reproduce:
- Open the modal.
- Select an option
- Scan with axeDevTools or inspect dom to see aria-owns still exists on mat-dialog-container
Expected Behavior
The aria-owns label is removed from mat-dialog-container when the select panel is closed.
Actual Behavior
The aria-owns label is only removed on destroy of the select.
Environment
- Angular: 16.2
- CDK/Material: 16.2
- Browser(s): chrome/edge
- Operating System (e.g. Windows, macOS, Ubuntu): windows