fix(material/snack-bar): clear timeout upon dismiss with action (#22485)

This is very similar to #4860 where a programmatic dismiss
cancelled the timeout. This patch is for a manual dismiss via
clicking on the snackbar action.

It is especially useful in e2e tests with Protractor, because
Protractor always wait for Angular to become stable. With this patch
Protractor does not need to wait if the action is clicked, saving
potentially a lot of time in repetitive e2e tests.

(cherry picked from commit c08e2c9)

Author: PowerKiKi

src/material-experimental/mdc-snack-bar/snack-bar.spec.ts

@@ -466,6 +466,20 @@ describe('MatSnackBar', () => {
     expect(viewContainerFixture.isStable()).toBe(true);
   }));
 
+  it('should clear the dismiss timeout when dismissed with action', fakeAsync(() => {
+    let config = new MatSnackBarConfig();
+    config.duration = 1000;
+    const snackBarRef = snackBar.open('content', 'test', config);
+
+    setTimeout(() => snackBarRef.dismissWithAction(), 500);
+
+    tick(600);
+    viewContainerFixture.detectChanges();
+    tick();
+
+    expect(viewContainerFixture.isStable()).toBe(true);
+  }));
+
   it('should add extra classes to the container', () => {
     snackBar.open(simpleMessage, simpleActionLabel, { panelClass: ['one', 'two'] });
     viewContainerFixture.detectChanges();

src/material/snack-bar/snack-bar-ref.ts

@@ -74,6 +74,7 @@ export class MatSnackBarRef<T> {
       this._onAction.next();
       this._onAction.complete();
     }
+    clearTimeout(this._durationTimeoutId);
   }
 
 

src/material/snack-bar/snack-bar.spec.ts

@@ -525,6 +525,20 @@ describe('MatSnackBar', () => {
     expect(viewContainerFixture.isStable()).toBe(true);
   }));
 
+  it('should clear the dismiss timeout when dismissed with action', fakeAsync(() => {
+    let config = new MatSnackBarConfig();
+    config.duration = 1000;
+    const snackBarRef = snackBar.open('content', 'test', config);
+
+    setTimeout(() => snackBarRef.dismissWithAction(), 500);
+
+    tick(600);
+    viewContainerFixture.detectChanges();
+    tick();
+
+    expect(viewContainerFixture.isStable()).toBe(true);
+  }));
+
   it('should add extra classes to the container', () => {
     snackBar.open(simpleMessage, simpleActionLabel, { panelClass: ['one', 'two'] });
     viewContainerFixture.detectChanges();