Angular canDeactivate fails if the back button is hit twice in a row

[aneeskodappana]

I am attempting to implement a back button guard in Angular 8. I am trying to use a service and canDeactivate.

🐞 bug report

Affected Package

"@angular/core": "~8.2.2",
"@angular/router": "~8.2.2",

Is this a regression?

yes

Description

Angular 8 canDeactivate fails if the back button is hit twice in a row

🔬 Minimal Reproduction

// can-deactivate.guard.ts
import { Injectable }    from '@angular/core';
import { CanDeactivate } from '@angular/router';
import { Observable, of }    from 'rxjs';

export interface CanComponentDeactivate {
 canDeactivate: () => Observable<boolean> | Promise<boolean> | boolean;
}

@Injectable({
  providedIn: 'root',
})
export class CanDeactivateGuard implements CanDeactivate<CanComponentDeactivate> {
  canDeactivate(component: CanComponentDeactivate) {
    const confirmation = window.confirm('Is it OK?');

    return of(confirmation);
  }
}

const routes: Routes = [
    { path: 'payment', component: PaymentComponent, pathMatch: 'full', canDeactivate: [CanDeactivateGuard] },
]

🔥 Exception or Error

Not an error

🌍 Your Environment

Angular Version:

Angular CLI: 8.2.2
Node: 12.4.0
OS: linux x64
Angular: 8.2.2
... animations, cli, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... platform-server, router
@angular-devkit/architect                  0.802.2
@angular-devkit/build-angular              0.802.2
@angular-devkit/build-ng-packagr           0.802.2
@angular-devkit/build-optimizer            0.802.2
@angular-devkit/build-webpack              0.802.2
@angular-devkit/core                       8.2.2
@angular-devkit/schematics                 8.2.2
@angular/cdk                               8.1.3
@angular/common                            9.0.0-next.2
@angular/fire                              5.2.1
@angular/flex-layout                       8.0.0-beta.26
@angular/material                          8.1.3
@angular/material-moment-adapter           8.1.3
@ngtools/webpack                           8.2.2
@nguniversal/express-engine                7.1.1
@nguniversal/module-map-ngfactory-loader   7.1.1
@schematics/angular                        8.2.2
@schematics/update                         0.802.2
ng-packagr                                 5.5.0
rxjs                                       6.5.2
typescript                                 3.5.3
webpack                                    4.38.0

Angular 4 canDeactivate fails if the back button is hit twice in a row

[ajitsinghkaler]

Can I try this one

[aneeskodappana]

@ajitsinghkaler

resolved manually using this way. any other recommended way link

canDeactivate(component: CanComponentDeactivate, currentRoute: ActivatedRouteSnapshot) {
    const confirmation = window.confirm('Is it OK?');
    if(!confirmation) {
      const currentUrlTree = this.router.createUrlTree([], currentRoute);
      const currentUrl = currentUrlTree.toString();
      this.location.go(currentUrl);
    }

    return of(confirmation);
  }

[ajitsinghkaler]

@pkozlowski-opensource should I implement this

[atscott]

Looks like a duplicate of #13586.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}