fix($location): avoid unnecessary $locationChange* events due to empty hash

Fixes #16632

Closes #16636

Author: gkalpak

src/ng/browser.js

@@ -6,6 +6,10 @@ function getHash(url) {
   return index === -1 ? '' : url.substr(index);
 }
 
+function trimEmptyHash(url) {
+  return url.replace(/#$/, '');
+}
+
 /**
  * ! This is a private undocumented service !
  *
@@ -72,20 +76,21 @@ function Browser(window, document, $log, $sniffer, $$taskTrackerFactory) {
    *
    * @description
    * GETTER:
-   * Without any argument, this method just returns current value of location.href.
+   * Without any argument, this method just returns current value of `location.href` (with a
+   * trailing `#` stripped of if the hash is empty).
    *
    * SETTER:
    * With at least one argument, this method sets url to new value.
-   * If html5 history api supported, pushState/replaceState is used, otherwise
-   * location.href/location.replace is used.
-   * Returns its own instance to allow chaining
+   * If html5 history api supported, `pushState`/`replaceState` is used, otherwise
+   * `location.href`/`location.replace` is used.
+   * Returns its own instance to allow chaining.
    *
-   * NOTE: this api is intended for use only by the $location service. Please use the
+   * NOTE: this api is intended for use only by the `$location` service. Please use the
    * {@link ng.$location $location service} to change url.
    *
    * @param {string} url New url (when used as setter)
    * @param {boolean=} replace Should new url replace current history record?
-   * @param {object=} state object to use with pushState/replaceState
+   * @param {object=} state State object to use with `pushState`/`replaceState`
    */
   self.url = function(url, replace, state) {
     // In modern browsers `history.state` is `null` by default; treating it separately
@@ -143,7 +148,7 @@ function Browser(window, document, $log, $sniffer, $$taskTrackerFactory) {
       // - pendingLocation is needed as browsers don't allow to read out
       //   the new location.href if a reload happened or if there is a bug like in iOS 9 (see
       //   https://openradar.appspot.com/22186109).
-      return pendingLocation || location.href;
+      return trimEmptyHash(pendingLocation || location.href);
     }
   };
 

src/ng/location.js

@@ -95,17 +95,11 @@ function stripBaseUrl(base, url) {
   }
 }
 
-
 function stripHash(url) {
   var index = url.indexOf('#');
   return index === -1 ? url : url.substr(0, index);
 }
 
-function trimEmptyHash(url) {
-  return url.replace(/#$/, '');
-}
-
-
 function stripFile(url) {
   return url.substr(0, stripHash(url).lastIndexOf('/') + 1);
 }
@@ -944,7 +938,7 @@ function $LocationProvider() {
 
 
     // rewrite hashbang url <> html5 url
-    if (trimEmptyHash($location.absUrl()) !== trimEmptyHash(initialUrl)) {
+    if ($location.absUrl() !== initialUrl) {
       $browser.url($location.absUrl(), true);
     }
 
@@ -963,7 +957,6 @@ function $LocationProvider() {
         var oldUrl = $location.absUrl();
         var oldState = $location.$$state;
         var defaultPrevented;
-        newUrl = trimEmptyHash(newUrl);
         $location.$$parse(newUrl);
         $location.$$state = newState;
 
@@ -991,8 +984,8 @@ function $LocationProvider() {
       if (initializing || $location.$$urlUpdatedByLocation) {
         $location.$$urlUpdatedByLocation = false;
 
-        var oldUrl = trimEmptyHash($browser.url());
-        var newUrl = trimEmptyHash($location.absUrl());
+        var oldUrl = $browser.url();
+        var newUrl = $location.absUrl();
         var oldState = $browser.state();
         var currentReplace = $location.$$replace;
         var urlOrStateChanged = !urlsEqual(oldUrl, newUrl) ||

src/ngMock/angular-mocks.js

@@ -225,7 +225,8 @@ angular.mock.$Browser.prototype = {
       state = null;
     }
     if (url) {
-      this.$$url = url;
+      // The `$browser` service trims empty hashes; simulate it.
+      this.$$url = url.replace(/#$/, '');
       // Native pushState serializes & copies the object; simulate it.
       this.$$state = angular.copy(state);
       return this;

test/ng/browserSpecs.js

@@ -404,6 +404,14 @@ describe('browser', function() {
       expect(browser.url()).toEqual('https://another.com');
     });
 
+    it('should strip an empty hash fragment', function() {
+      fakeWindow.location.href = 'http://test.com#';
+      expect(browser.url()).toEqual('http://test.com');
+
+      fakeWindow.location.href = 'https://another.com#foo';
+      expect(browser.url()).toEqual('https://another.com#foo');
+    });
+
     it('should use history.pushState when available', function() {
       sniffer.history = true;
       browser.url('http://new.org');
@@ -1047,6 +1055,32 @@ describe('browser', function() {
         expect($location.absUrl()).toEqual('http://server/#otherHash');
       });
     });
+
+    // issue #16632
+    it('should not trigger `$locationChangeStart` more than once due to trailing `#`', function() {
+      setup({
+        history: true,
+        html5Mode: true
+      });
+
+      inject(function($flushPendingTasks, $location, $rootScope) {
+        $rootScope.$digest();
+
+        var spy = jasmine.createSpy('$locationChangeStart');
+        $rootScope.$on('$locationChangeStart', spy);
+
+        $rootScope.$evalAsync(function() {
+          fakeWindow.location.href += '#';
+        });
+        $rootScope.$digest();
+
+        expect(fakeWindow.location.href).toBe('http://server/#');
+        expect($location.absUrl()).toBe('http://server/');
+
+        expect(spy.calls.count()).toBe(0);
+        expect(spy).not.toHaveBeenCalled();
+      });
+    });
   });
 
   describe('integration test with $rootScope', function() {

test/ng/locationSpec.js

@@ -709,7 +709,7 @@ describe('$location', function() {
       initService({html5Mode: true, supportHistory: true});
       mockUpBrowser({initialUrl: 'http://new.com/#', baseHref: '/'});
       inject(function($browser, $location, $window) {
-        expect($browser.url()).toBe('http://new.com/#');
+        expect($browser.url()).toBe('http://new.com/');
         expect($location.absUrl()).toBe('http://new.com/');
         expect($window.location.href).toBe('http://new.com/#');
       });