Skip to content

Commit c0d19cb

Browse files
crisbetommalerba
authored andcommitted
fix(cdk-experimental/dialog): disableClose not working for tem… (#18968)
Fixes the `disableClose` option not working for template-based dialogs, because we have two separate places where the config was being synced up with the dialog ref and one of them wasn't updated. These changes move the creation logic to a single place. Fixes #18964.
1 parent 4d22936 commit c0d19cb

File tree

2 files changed

+31
-12
lines changed

2 files changed

+31
-12
lines changed

src/cdk-experimental/dialog/dialog.spec.ts

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -791,6 +791,25 @@ describe('Dialog', () => {
791791

792792
expect(overlayContainerElement.querySelector('cdk-dialog-container')).toBeFalsy();
793793
}));
794+
795+
it('should work when opening from a template', fakeAsync(() => {
796+
const templateRefFixture = TestBed.createComponent(ComponentWithTemplateRef);
797+
templateRefFixture.detectChanges();
798+
799+
dialog.openFromTemplate(templateRefFixture.componentInstance.templateRef, {
800+
disableClose: true
801+
});
802+
803+
templateRefFixture.detectChanges();
804+
805+
let backdrop = overlayContainerElement.querySelector('.cdk-overlay-backdrop') as HTMLElement;
806+
backdrop.click();
807+
templateRefFixture.detectChanges();
808+
flush();
809+
810+
expect(overlayContainerElement.querySelector('cdk-dialog-container')).toBeTruthy();
811+
}));
812+
794813
});
795814

796815
describe('hasBackdrop option', () => {

src/cdk-experimental/dialog/dialog.ts

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -226,17 +226,11 @@ export class Dialog implements OnDestroy {
226226

227227
// Create a reference to the dialog we're creating in order to give the user a handle
228228
// to modify and close it.
229-
const dialogRef = new this._dialogRefConstructor(overlayRef, dialogContainer, config.id);
229+
const dialogRef = this._createDialogRef(overlayRef, dialogContainer, config);
230230
const injector = this._createInjector<T>(config, dialogRef, dialogContainer);
231231
const contentRef = dialogContainer.attachComponentPortal(
232232
new ComponentPortal(componentOrTemplateRef, undefined, injector));
233-
234233
dialogRef.componentInstance = contentRef.instance;
235-
dialogRef.disableClose = config.disableClose;
236-
237-
dialogRef.updateSize({width: config.width, height: config.height})
238-
.updatePosition(config.position);
239-
240234
return dialogRef;
241235
}
242236

@@ -257,14 +251,10 @@ export class Dialog implements OnDestroy {
257251

258252
// Create a reference to the dialog we're creating in order to give the user a handle
259253
// to modify and close it.
260-
const dialogRef = new this._dialogRefConstructor(overlayRef, dialogContainer, config.id);
261-
254+
const dialogRef = this._createDialogRef(overlayRef, dialogContainer, config);
262255
dialogContainer.attachTemplatePortal(
263256
new TemplatePortal<T>(componentOrTemplateRef, null!,
264257
<any>{$implicit: config.data, dialogRef}));
265-
dialogRef.updateSize({width: config.width, height: config.height})
266-
.updatePosition(config.position);
267-
268258
return dialogRef;
269259
}
270260

@@ -300,6 +290,16 @@ export class Dialog implements OnDestroy {
300290
return new PortalInjector(userInjector || this._injector, injectionTokens);
301291
}
302292

293+
/** Creates a new dialog ref. */
294+
private _createDialogRef(overlayRef: OverlayRef,
295+
dialogContainer: CdkDialogContainer,
296+
config: DialogConfig) {
297+
const dialogRef = new this._dialogRefConstructor(overlayRef, dialogContainer, config.id);
298+
dialogRef.disableClose = config.disableClose;
299+
dialogRef.updateSize(config).updatePosition(config.position);
300+
return dialogRef;
301+
}
302+
303303
/**
304304
* Expands the provided configuration object to include the default values for properties which
305305
* are undefined.

0 commit comments

Comments
 (0)