Prevent back button routing if Dialog / SideNav is open

We have already closeOnNavigation for Dialogs. That was a good start… But for make feeling a PWA like a native app we need more options to change also the routing a bit. 95% of users use the back button in my apps instead of the X button to close dialogs and sidenavs. the problem is that in background happens also a route change.

If Dialog or SideNav is open it should just close them without any route change.

[alexdabast]

Custom guard introduces a new issue.

Here is how to reproduce the issue on this stackblitz https://angular-material-modal-guard.stackblitz.io/

What I did: Create a custom CanDeactivate guard on all my routes. The custom guard checks if any dialog is open an close them all and cancel the navigation.

if (this.dialog.openDialogs.length > 0) {
      this.dialog.closeAll();
      return false;
}
return true;

The issue: Everything seems to work as expected but, if you hit a second time the back button of your browser once the modal has been closed by the guard, you do not navigate to your previous route but the second previous route.

Scenario: You are on route “first” You navigate to route “second” You navigate to route “third” You open the dialog You close the dialog with the back button Your hit the back button again

What you should expect is to land on route “second” What happen you land on route “first”

[SvenBudak]

Someone maybe have an idea to disable the back button until this is fixed? The app feel very strange with the default back routing.