From 24931562ef79a66d9571f50010af6270b8246e1a Mon Sep 17 00:00:00 2001 From: Kristiyan Kostadinov Date: Thu, 30 Jul 2026 10:21:37 +0200 Subject: [PATCH] fix(material/dialog): do not expose CDK dialog ref to users Fixes that we were exposing both the CDK and Material dialog refs to users which can be confusing. Fixes #33601. --- src/material/dialog/dialog.spec.ts | 10 ++++++++++ src/material/dialog/dialog.ts | 3 ++- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/src/material/dialog/dialog.spec.ts b/src/material/dialog/dialog.spec.ts index 47ba393a2ba5..7ddbf3968dc4 100644 --- a/src/material/dialog/dialog.spec.ts +++ b/src/material/dialog/dialog.spec.ts @@ -31,6 +31,7 @@ import { inject, inputBinding, } from '@angular/core'; +import {DialogRef} from '@angular/cdk/dialog'; import {ComponentFixture, TestBed} from '@angular/core/testing'; import {By} from '@angular/platform-browser'; import {Subject} from 'rxjs'; @@ -873,6 +874,14 @@ describe('MatDialog', () => { expect(pane.classList).not.toContain('custom-class-one', 'Expected class to be removed'); }); + it('should not inject the CDK dialog ref into the child component', () => { + const dialogRef = dialog.open(PizzaMsg, {viewContainerRef: testViewContainerRef}); + viewContainerFixture.detectChanges(); + + expect(dialogRef.componentInstance.cdkDialogRef).toBe(null); + expect(dialogRef.componentInstance.dialogRef).toBeTruthy(); + }); + describe('disableClose option', () => { it('should prevent closing via clicks on the backdrop', async () => { dialog.open(PizzaMsg, {disableClose: true, viewContainerRef: testViewContainerRef}); @@ -2372,6 +2381,7 @@ class PizzaMsg { dialogRef = inject>(MatDialogRef); dialogInjector = inject(Injector); directionality = inject(Directionality); + cdkDialogRef = inject(DialogRef, {optional: true}); } @Component({ diff --git a/src/material/dialog/dialog.ts b/src/material/dialog/dialog.ts index 3e14184ebb3f..158ed28e8095 100644 --- a/src/material/dialog/dialog.ts +++ b/src/material/dialog/dialog.ts @@ -26,7 +26,7 @@ import {MatDialogConfig} from './dialog-config'; import {MatDialogContainer} from './dialog-container'; import {MatDialogRef} from './dialog-ref'; import {defer, Observable, Subject} from 'rxjs'; -import {Dialog, DialogConfig} from '@angular/cdk/dialog'; +import {Dialog, DialogConfig, DialogRef} from '@angular/cdk/dialog'; import {startWith} from 'rxjs/operators'; import {_IdGenerator} from '@angular/cdk/a11y'; import {_animationsDisabled} from '../core'; @@ -178,6 +178,7 @@ export class MatDialog implements OnDestroy { {provide: this._dialogContainerType, useValue: dialogContainer}, {provide: this._dialogDataToken, useValue: cdkConfig.data}, {provide: this._dialogRefConstructor, useValue: dialogRef}, + {provide: DialogRef, useValue: null}, ]; }, });