fix(bottom-sheet): dismiss bottom sheet on destroy (#13120)

Dismisses the open bottom sheet if the service is destroyed.

Author: crisbeto

src/lib/bottom-sheet/bottom-sheet.spec.ts

@@ -274,6 +274,18 @@ describe('MatBottomSheet', () => {
     expect(overlayContainerElement.childElementCount).toBe(0);
   }));
 
+  it('should dismiss the bottom sheet when the service is destroyed', fakeAsync(() => {
+    bottomSheet.open(PizzaMsg);
+    viewContainerFixture.detectChanges();
+    expect(overlayContainerElement.childElementCount).toBeGreaterThan(0);
+
+    bottomSheet.ngOnDestroy();
+    viewContainerFixture.detectChanges();
+    flush();
+
+    expect(overlayContainerElement.childElementCount).toBe(0);
+  }));
+
   it('should open a new bottom sheet after dismissing a previous sheet', fakeAsync(() => {
     let config: MatBottomSheetConfig = {viewContainerRef: testViewContainerRef};
     let bottomSheetRef: MatBottomSheetRef<any> = bottomSheet.open(PizzaMsg, config);
@@ -614,6 +626,23 @@ describe('MatBottomSheet with parent MatBottomSheet', () => {
     expect(overlayContainerElement.textContent)
         .toContain('Taco', 'Expected child bottom sheet to be dismissed by opening from parent');
   }));
+
+  it('should not close parent bottom sheet when child is destroyed', fakeAsync(() => {
+    parentBottomSheet.open(PizzaMsg);
+    fixture.detectChanges();
+    tick(1000);
+
+    expect(overlayContainerElement.textContent)
+        .toContain('Pizza', 'Expected a bottom sheet to be opened');
+
+    childBottomSheet.ngOnDestroy();
+    fixture.detectChanges();
+    tick(1000);
+
+    expect(overlayContainerElement.textContent)
+        .toContain('Pizza', 'Expected a bottom sheet to stay open');
+  }));
+
 });
 
 describe('MatBottomSheet with default options', () => {

src/lib/bottom-sheet/bottom-sheet.ts

@@ -18,6 +18,7 @@ import {
   TemplateRef,
   InjectionToken,
   Inject,
+  OnDestroy,
 } from '@angular/core';
 import {Location} from '@angular/common';
 import {of as observableOf} from 'rxjs';
@@ -35,7 +36,7 @@ export const MAT_BOTTOM_SHEET_DEFAULT_OPTIONS =
  * Service to trigger Material Design bottom sheets.
  */
 @Injectable({providedIn: MatBottomSheetModule})
-export class MatBottomSheet {
+export class MatBottomSheet implements OnDestroy {
   private _bottomSheetRefAtThisLevel: MatBottomSheetRef<any> | null = null;
 
   /** Reference to the currently opened bottom sheet. */
@@ -118,6 +119,12 @@ export class MatBottomSheet {
     }
   }
 
+  ngOnDestroy() {
+    if (this._bottomSheetRefAtThisLevel) {
+      this._bottomSheetRefAtThisLevel.dismiss();
+    }
+  }
+
   /**
    * Attaches the bottom sheet container component to the overlay.
    */