fix(router): set correct redirect/default URL from hashchange

Currently, hashchange events outside of Angular that cause navigation
do not take into account cases where the initial route URL changes
due to a redirect or a default route.

Closes #5590

Closes #5683

modules/angular2/src/router/hash_location_strategy.ts

@@ -58,7 +58,10 @@ export class HashLocationStrategy extends LocationStrategy {
     }
   }
 
-  onPopState(fn: EventListener): void { this._platformLocation.onPopState(fn); }
+  onPopState(fn: EventListener): void {
+    this._platformLocation.onPopState(fn);
+    this._platformLocation.onHashChange(fn);
+  }
 
   getBaseHref(): string { return this._baseHref; }
 
@@ -87,6 +90,14 @@ export class HashLocationStrategy extends LocationStrategy {
     this._platformLocation.pushState(state, title, url);
   }
 
+  replaceState(state: any, title: string, path: string, queryParams: string) {
+    var url = this.prepareExternalUrl(path + normalizeQueryParams(queryParams));
+    if (url.length == 0) {
+      url = this._platformLocation.pathname;
+    }
+    this._platformLocation.replaceState(state, title, url);
+  }
+
   forward(): void { this._platformLocation.forward(); }
 
   back(): void { this._platformLocation.back(); }

modules/angular2/src/router/location.ts

@@ -52,8 +52,9 @@ export class Location {
   constructor(public platformStrategy: LocationStrategy) {
     var browserBaseHref = this.platformStrategy.getBaseHref();
     this._baseHref = stripTrailingSlash(stripIndexHtml(browserBaseHref));
-    this.platformStrategy.onPopState(
-        (_) => { ObservableWrapper.callEmit(this._subject, {'url': this.path(), 'pop': true}); });
+    this.platformStrategy.onPopState((ev) => {
+      ObservableWrapper.callEmit(this._subject, {'url': this.path(), 'pop': true, 'type': ev.type});
+    });
   }
 
   /**
@@ -82,6 +83,7 @@ export class Location {
     return this.platformStrategy.prepareExternalUrl(url);
   }
 
+  // TODO: rename this method to pushState
   /**
    * Changes the browsers URL to the normalized version of the given URL, and pushes a
    * new item onto the platform's history.
@@ -90,6 +92,14 @@ export class Location {
     this.platformStrategy.pushState(null, '', path, query);
   }
 
+  /**
+   * Changes the browsers URL to the normalized version of the given URL, and replaces
+   * the top item on the platform's history stack.
+   */
+  replaceState(path: string, query: string = ''): void {
+    this.platformStrategy.replaceState(null, '', path, query);
+  }
+
   /**
    * Navigates forward in the platform's history.
    */

modules/angular2/src/router/location_strategy.ts

@@ -21,6 +21,7 @@ export abstract class LocationStrategy {
   abstract path(): string;
   abstract prepareExternalUrl(internal: string): string;
   abstract pushState(state: any, title: string, url: string, queryParams: string): void;
+  abstract replaceState(state: any, title: string, url: string, queryParams: string): void;
   abstract forward(): void;
   abstract back(): void;
   abstract onPopState(fn: (_: any) => any): void;

modules/angular2/src/router/path_location_strategy.ts

@@ -93,6 +93,11 @@ export class PathLocationStrategy extends LocationStrategy {
     this._platformLocation.pushState(state, title, externalUrl);
   }
 
+  replaceState(state: any, title: string, url: string, queryParams: string) {
+    var externalUrl = this.prepareExternalUrl(url + normalizeQueryParams(queryParams));
+    this._platformLocation.replaceState(state, title, externalUrl);
+  }
+
   forward(): void { this._platformLocation.forward(); }
 
   back(): void { this._platformLocation.back(); }

modules/angular2/src/router/platform_location.ts

@@ -40,6 +40,10 @@ export class PlatformLocation {
     this._history.pushState(state, title, url);
   }
 
+  replaceState(state: any, title: string, url: string): void {
+    this._history.replaceState(state, title, url);
+  }
+
   forward(): void { this._history.forward(); }
 
   back(): void { this._history.back(); }

modules/angular2/src/router/router.ts

@@ -425,8 +425,38 @@ export class RootRouter extends Router {
               @Inject(ROUTER_PRIMARY_COMPONENT) primaryComponent: Type) {
     super(registry, null, primaryComponent);
     this._location = location;
-    this._locationSub = this._location.subscribe(
-        (change) => this.navigateByUrl(change['url'], isPresent(change['pop'])));
+    this._locationSub = this._location.subscribe((change) => {
+      // we call recognize ourselves
+      this.recognize(change['url'])
+          .then((instruction) => {
+            this.navigateByInstruction(instruction, isPresent(change['pop']))
+                .then((_) => {
+                  // this is a popstate event; no need to change the URL
+                  if (isPresent(change['pop']) && change['type'] != 'hashchange') {
+                    return;
+                  }
+                  var emitPath = instruction.toUrlPath();
+                  var emitQuery = instruction.toUrlQuery();
+                  if (emitPath.length > 0) {
+                    emitPath = '/' + emitPath;
+                  }
+
+                  // Because we've opted to use All hashchange events occur outside Angular.
+                  // However, apps that are migrating might have hash links that operate outside
+                  // angular to which routing must respond.
+                  // To support these cases where we respond to hashchanges and redirect as a
+                  // result, we need to replace the top item on the stack.
+                  if (change['type'] == 'hashchange') {
+                    if (instruction.toRootUrl() != this._location.path()) {
+                      this._location.replaceState(emitPath, emitQuery);
+                    }
+                  } else {
+                    this._location.go(emitPath, emitQuery);
+                  }
+                });
+          });
+    });
+
     this.registry.configFromComponent(primaryComponent);
     this.navigateByUrl(location.path());
   }