fix(material/dialog): aria-modal not being set

Fixes that `aria-modal` wasn't being set on the dialog container. We had a host binding for it already, but the config didn't have an `ariaModal` property. This likely got broken when the dialog was changed to be based on top of the CDK dialog.

Fixes #25676.

Author: crisbeto

src/cdk/dialog/dialog-config.ts

@@ -93,7 +93,7 @@ export class DialogConfig<D = unknown, R = unknown, C extends BasePortalOutlet =
   /** Dialog label applied via `aria-label` */
   ariaLabel?: string | null = null;
 
-  /** Whether this a modal dialog. Used to set the `aria-modal` attribute. */
+  /** Whether this is a modal dialog. Used to set the `aria-modal` attribute. */
   ariaModal?: boolean = true;
 
   /**

src/material/dialog/dialog-config.ts

@@ -104,6 +104,9 @@ export class MatDialogConfig<D = any> {
   /** Aria label to assign to the dialog element. */
   ariaLabel?: string | null = null;
 
+  /** Whether this is a modal dialog. Used to set the `aria-modal` attribute. */
+  ariaModal?: boolean = true;
+
   /**
    * Where the dialog should focus on open.
    * @breaking-change 14.0.0 Remove boolean option from autoFocus. Use string or

src/material/dialog/dialog.spec.ts

@@ -115,6 +115,7 @@ describe('MDC-based MatDialog', () => {
     viewContainerFixture.detectChanges();
     let dialogContainerElement = overlayContainerElement.querySelector('mat-dialog-container')!;
     expect(dialogContainerElement.getAttribute('role')).toBe('dialog');
+    expect(dialogContainerElement.getAttribute('aria-modal')).toBe('true');
   });
 
   it('should open a dialog with a template', () => {
@@ -135,6 +136,7 @@ describe('MDC-based MatDialog', () => {
 
     let dialogContainerElement = overlayContainerElement.querySelector('mat-dialog-container')!;
     expect(dialogContainerElement.getAttribute('role')).toBe('dialog');
+    expect(dialogContainerElement.getAttribute('aria-modal')).toBe('true');
 
     dialogRef.close();
   });

src/material/legacy-dialog/dialog.spec.ts

@@ -118,6 +118,7 @@ describe('MatDialog', () => {
     viewContainerFixture.detectChanges();
     const dialogContainerElement = overlayContainerElement.querySelector('mat-dialog-container')!;
     expect(dialogContainerElement.getAttribute('role')).toBe('dialog');
+    expect(dialogContainerElement.getAttribute('aria-modal')).toBe('true');
   });
 
   it('should open a dialog with a template', () => {
@@ -138,6 +139,7 @@ describe('MatDialog', () => {
 
     const dialogContainerElement = overlayContainerElement.querySelector('mat-dialog-container')!;
     expect(dialogContainerElement.getAttribute('role')).toBe('dialog');
+    expect(dialogContainerElement.getAttribute('aria-modal')).toBe('true');
 
     dialogRef.close();
   });

tools/public_api_guard/material/dialog.md

@@ -165,6 +165,7 @@ export class MatDialogConfig<D = any> {
     ariaDescribedBy?: string | null;
     ariaLabel?: string | null;
     ariaLabelledBy?: string | null;
+    ariaModal?: boolean;
     autoFocus?: AutoFocusTarget | string | boolean;
     backdropClass?: string | string[];
     closeOnNavigation?: boolean;