Merge pull request #496 from batikanu/fix-flickering-ui

Flickering replicationcontroller list view fixed

src/app/frontend/replicationcontrollerlist/replicationcontrollerlist_stateconfig.js

@@ -56,11 +56,10 @@ export default function stateConfig($stateProvider) {
  * deleted.
  * Transition to: zerostate
  * @param {!ui.router.$state} $state
- * @param {!angular.$timeout} $timeout
  * @param {!backendApi.ReplicationControllerList} replicationControllers
  * @ngInject
  */
-export function redirectIfNeeded($state, $timeout, replicationControllers) {
+export function redirectIfNeeded($state, replicationControllers) {
   /** @type {boolean} */
   let isEmpty = replicationControllers.replicationControllers.length === 0;
   // should only display RC list if RCs exist that are not in the kube-system namespace,
@@ -71,12 +70,8 @@ export function redirectIfNeeded($state, $timeout, replicationControllers) {
       });
 
   if (isEmpty || containsOnlyKubeSystemRCs) {
-    // allow original state change to finish before redirecting to new state to avoid error
-
-    $timeout(() => {
-      let stateParams = new StateParams(containsOnlyKubeSystemRCs);
-      $state.go(zerostate, stateParams);
-    });
+    let stateParams = new StateParams(containsOnlyKubeSystemRCs);
+    $state.transition.then(() => { $state.go(zerostate, stateParams); });
   }
 }
 
@@ -88,6 +83,5 @@ export function redirectIfNeeded($state, $timeout, replicationControllers) {
 function resolveReplicationControllers($resource) {
   /** @type {!angular.Resource<!backendApi.ReplicationControllerList>} */
   let resource = $resource('api/v1/replicationcontrollers');
-
   return resource.get().$promise;
 }

src/test/frontend/replicationcontrollerlist/replicationcontrollerlist_stateconfig_test.js

@@ -14,19 +14,20 @@
 
 import replicationControllerListModule from 'replicationcontrollerlist/replicationcontrollerlist_module';
 import {redirectIfNeeded} from 'replicationcontrollerlist/replicationcontrollerlist_stateconfig';
-
 describe('StateConfig for replication controller list', () => {
   /** @type {!ui.router.$state} */
   let state;
-  /** @type {!angular.$timeout} */
-  let timeout;
+  let deferred;
+  let $rootScope;
+
   beforeEach(() => {
     angular.mock.module(replicationControllerListModule.name);
-
-    angular.mock.inject(($state, $timeout) => {
+    angular.mock.inject(($state, $q, _$rootScope_) => {
       state = $state;
-      timeout = $timeout;
+      $rootScope = _$rootScope_;
+      deferred = $q.defer();
     });
+    state.transition = deferred.promise;
   });
 
   it('should redirect to zerostate when RCs exist only in namespace kube-system', () => {
@@ -39,9 +40,8 @@ describe('StateConfig for replication controller list', () => {
     };
 
     // when
-    redirectIfNeeded(state, timeout, replicationControllers);
-    timeout.flush();
-
+    redirectIfNeeded(state, replicationControllers);
+    resolveStateTransitionPromise();
     // then
     expect(state.go).toHaveBeenCalled();
   });
@@ -52,8 +52,8 @@ describe('StateConfig for replication controller list', () => {
     let replicationControllers = {replicationControllers: []};
 
     // when
-    redirectIfNeeded(state, timeout, replicationControllers);
-    timeout.flush();
+    redirectIfNeeded(state, replicationControllers);
+    resolveStateTransitionPromise();
 
     // then
     expect(state.go).toHaveBeenCalled();
@@ -70,7 +70,8 @@ describe('StateConfig for replication controller list', () => {
        };
 
        // when
-       redirectIfNeeded(state, timeout, replicationControllers);
+       redirectIfNeeded(state, replicationControllers);
+       resolveStateTransitionPromise();
 
        // then
        expect(state.go).not.toHaveBeenCalled();
@@ -88,9 +89,20 @@ describe('StateConfig for replication controller list', () => {
        };
 
        // when
-       redirectIfNeeded(state, timeout, replicationControllers);
+       redirectIfNeeded(state, replicationControllers);
+       resolveStateTransitionPromise();
 
        // then
        expect(state.go).not.toHaveBeenCalled();
      });
+
+  /**
+   * Resolves the mocked state transition promise
+   *
+   * @export
+   */
+  function resolveStateTransitionPromise() {
+    deferred.resolve();
+    $rootScope.$apply();
+  }
 });