Enable reloading of views even if state / URL has not changed

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bicker",
-  "version": "1.3.2",
+  "version": "1.3.3",
   "private": true,
   "engines": {
     "node": ">=6.9.5"

src/directives/view.js

@@ -14,6 +14,7 @@ function routeViewFactory($log, $compile, $controller, ViewBindings, $q, State,
       let viewManagementPending = false;
       const view = ViewBindings.getView(iAttrs.name);
       const bindings = view.getBindings();
+      let reloading = false
 
       iElement.addClass('ng-hide');
 
@@ -77,14 +78,17 @@ function routeViewFactory($log, $compile, $controller, ViewBindings, $q, State,
             previousBinding = undefined;
             Route.deleteCurrentBinding(view.name)
           }
-          return;
+          return $q.resolve();
         }
 
         const newState = getStateDataForBinding(matchingBinding);
-        if ((matchingBinding === previousBinding) && angular.equals(previousBoundState, newState)) {
-          return;
+
+        if (!reloading && (matchingBinding === previousBinding) && angular.equals(previousBoundState, newState)) {
+          return $q.resolve();
         }
 
+        console.log('reloading state = ', reloading)
+
         previousBinding = matchingBinding;
         previousBoundState = newState;
 
@@ -332,24 +336,35 @@ function routeViewFactory($log, $compile, $controller, ViewBindings, $q, State,
           return;
         }
 
-        const stateWatcher = function (changedPath, newValue, oldValue) {
+        const reload = function () {
           if (viewManagementPending) {
             return;
           }
+
           viewManagementPending = true;
 
           // Wrapped in a timeout so that we can finish the digest cycle before building the view, which should
           // prevent us from re-rendering a view multiple times if multiple properties of the same state dependency
           // get changed with repeated State.set calls
           return $timeout(function () {
-            manageView(iElement, bindings);
-            return viewManagementPending = false;
+            manageView(iElement, bindings).finally(() => {
+              reloading = false;
+              viewManagementPending = false;
+            });
           });
         };
 
-        State.watch(fields, stateWatcher);
+        State.watch(fields, reload);
 
-        viewDirectiveScope.$on('$destroy', () => State.removeWatcher(stateWatcher));
+        const deregisterForcedReloadListener = $rootScope.$on('bicker_router.forcedReload', function() {
+          reloading = true;
+          reload();
+        })
+
+        viewDirectiveScope.$on('$destroy', () => {
+          State.removeWatcher(reload);
+          deregisterForcedReloadListener();
+        });
       });
     }
   }

src/providers/route.js

@@ -87,7 +87,7 @@ angular.module('bicker_router').provider('Route', function(ObjectHelper) {
       return str.replace(/[\-\[\]\/\(\)\*\+\?\\\^\$\|]/g, "\\$&");
     },
 
-    $get($location, $injector, $q) {
+    $get($location, $injector, $q, $rootScope) {
       'ngInject';
 
       // When getting a new instance of the service (only done once), we need to iterate over the urlWriters and turn
@@ -197,8 +197,21 @@ angular.module('bicker_router').provider('Route', function(ObjectHelper) {
           return urlWriters[name](data);
         },
 
-        go(name, data = {}) {
-          return $location.url(this.invokeUrlWriter(name, data));
+        go(name, data = {}, forceReload = false) {
+          const currentUrl = $location.url();
+          const newUrl = this.invokeUrlWriter(name, data);
+
+          if (currentUrl !== newUrl) {
+            return $location.url(newUrl);
+          }
+
+          if (forceReload) {
+            this.reload();
+          }
+        },
+
+        reload() {
+          $rootScope.$emit('bicker_router.forcedReload');
         },
 
         getPersistentStates() {

src/router.js

@@ -11,6 +11,7 @@ angular.module('bicker_router', ['ngAnimate']).run(function (State, Route, $loca
   $rootScope.$on('$locationChangeSuccess', function (e, newUrl) {
     // Work-around for AngularJS issue https://github.com/angular/angular.js/issues/8368
     let data;
+
     if (newUrl === oldUrl) {
       return;
     }

test/karma/directives/view.test.js

@@ -447,6 +447,41 @@ describe('View directive', function() {
     });
   });
 
+  it('should reload the view when the bicker_router.forcedReload event is received', function() {
+    const stateAController = jasmine.createSpy('stateAController');
+
+    const viewAstateVariationA = {
+      name: 'viewAstateVariationA',
+      controller: 'StateVariationActrl',
+      templateUrl: 'stateVariationA.html',
+      requiredState: ['stateFieldA']
+    };
+
+    window.angular.mock.module(function(RouteProvider, ViewBindingsProvider, $controllerProvider) {
+      RouteProvider.registerUrl('/fake_initial_url');
+      $controllerProvider.register('StateVariationActrl', ['$scope', stateAController]);
+      RouteProvider.setPersistentStates('stateFieldA');
+      ViewBindingsProvider.bind('viewA', [viewAstateVariationA]);
+    });
+
+    mockTemplateRequest('stateVariationA.html', '<div id="contentsA"></div>');
+    mockLocationSuccess();
+
+    inject(function(State, $rootScope, $timeout) {
+      State.set('stateFieldA', 'some value');
+
+      createView('viewA');
+      triggerOpeningAnimationCompleteCallbacks();
+      deliverMainTemplate();
+
+      expect(stateAController, 'before: stateAController should be called').toHaveBeenCalled();
+      stateAController.calls.reset();
+      $rootScope.$emit('bicker_router.forcedReload')
+      $timeout.flush()
+      expect(stateAController, 'after: view should be reloaded').toHaveBeenCalled();
+    });
+  });
+
   it('caches the template so that it is not requested more than once', function() {
     const controller = jasmine.createSpy();
 

test/karma/providers/route.test.js

@@ -481,19 +481,65 @@ describe('Route', function() {
   });
 
   describe('go', function() {
-    it("should call the specified url writer and update the browser's URL to the value returned", function () {
-      window.angular.mock.module(function (RouteProvider) {
-        RouteProvider.registerUrlWriter('pagination', UrlData => `/page/${UrlData.page}`);
+    describe('When the target URL is different to the current URL', function () {
+      it("should call the specified url writer and update the browser's URL to the value returned", function () {
+        window.angular.mock.module(function (RouteProvider) {
+          RouteProvider.registerUrlWriter('pagination', UrlData => `/page/${UrlData.page}`);
+        });
+
+        inject(function (Route, $location) {
+          spyOn($location, 'url').and.returnValue('/some/other/url')
+          Route.go('pagination', {page: 3});
+          expect($location.url).toHaveBeenCalledWith('/page/3');
+        });
+      });
+    });
+
+    describe('When the target URL is the same as the current URL and forceReload is set to true', function () {
+      it("should force the view to re-render", function () {
+        window.angular.mock.module(function (RouteProvider) {
+          RouteProvider.registerUrlWriter('pagination', UrlData => '/some/url');
+        });
+
+        inject(function (Route, $location) {
+          const forceReload = true
+          spyOn($location, 'url').and.returnValue('/some/url')
+          spyOn(Route, 'reload')
+          Route.go('pagination', {}, forceReload);
+          expect(Route.reload).toHaveBeenCalled();
+          expect($location.url).not.toHaveBeenCalledWith('/some/url');
+        });
       });
+    });
+
+    describe('When the target URL is the same as the current URL and forceReload is set to false', function () {
+      it("should force the view to re-render", function () {
+        window.angular.mock.module(function (RouteProvider) {
+          RouteProvider.registerUrlWriter('pagination', UrlData => '/some/url');
+        });
 
-      inject(function (Route, $location) {
-        spyOn($location, 'url');
-        Route.go('pagination', {page: 3});
-        expect($location.url).toHaveBeenCalledWith('/page/3');
+        inject(function (Route, $location) {
+          const forceReload = false
+          spyOn($location, 'url').and.returnValue('/some/url')
+          spyOn(Route, 'reload')
+          Route.go('pagination', {}, forceReload);
+          expect(Route.reload).not.toHaveBeenCalled();
+          expect($location.url).not.toHaveBeenCalledWith('/some/url');
+        });
       });
     });
   });
 
+  describe('Reload', function() {
+    it('emits the event bicker_router.forcedReload', function () {
+      inject(function (Route, $rootScope) {
+        spyOn($rootScope, '$emit')
+        Route.reload()
+        expect($rootScope.$emit).toHaveBeenCalledWith('bicker_router.forcedReload')
+      });
+    })
+  })
+
   describe('persistentStates',  function() {
     it('set/get should work as expected', function() {
       window.angular.mock.module(function(RouteProvider) {