Skip to content

[4.0.0-beta.16] NavController goBack triggers navigation to previous page after using navigateRoot #16340

@TomDemulierChevret

Description

@TomDemulierChevret

Bug Report

Ionic Info
Run ionic info from a terminal/cmd prompt and paste the output below.

Ionic:

   ionic (Ionic CLI)             : 4.3.1
   Ionic Framework               : @ionic/angular 4.0.0-beta.15
   @angular-devkit/build-angular : 0.8.6
   @angular-devkit/schematics    : 0.8.6
   @angular/cli                  : 6.2.6
   @ionic/angular-toolkit        : 1.1.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.1
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.2.0, (and 10 other plugins)

System:

   NodeJS : v8.10.0 (C:\Program Files\nodejs\node.exe)
   npm    : 6.3.0
   OS     : Windows 10

Describe the Bug

NavController goBack triggers navigation to previous page after using navigateRoot.

The source if this issue is quite obvious.
Currently NavController goBack method has this implementation :

goBack(animated?: boolean) {
     this.setIntent(NavIntent.Back, animated);
     return this.location.back();
}

It uses Angular Location provider, which allow to navigate using the browser history (its back method will trigger navigation to last URL in history).

The issue is that no check is done against the current stack and that NavController never clear browser history when the current stack is empty.

Therefore any call to NavController goBack (manually, throught IonBackButton or with Android Hardware back button) will trigger navigation to the previous page even if we navigated to the current page using navigateRoot.

Steps to Reproduce
Steps to reproduce the behavior:

  1. Have at least 2 routes in your application
  2. Call this.navController.navigateRoot to navigate from route A to route B
  3. Call this.navController.goBack
  4. Witness the navigation to route A

Related Code
If you are able to illustrate the bug with an example, please provide a sample application via an online code collaborator such as StackBlitz, or GitHub.

Expected Behavior
NavController goBack should not trigger navigation to previous page if we used navigateRoot.

Additional Context
After further investigation, NavController stack is not even filled properly.
Indeed, after using navigateRoot the url of the target page is just pushed in the stack, leaving the previous pages urls :

private guessDirection() {
    const index = this.stack.indexOf(document.location!.href);
    if (index === -1) {
      this.stack.push(document.location!.href);
      return 1;
    } else if (index < this.stack.length - 1) {
      this.stack = this.stack.slice(0, index + 1);
      return -1;
    }
    return 0;
  }

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions