fix($ionicLoading): stop race condition with show and hide

Fixes #1100.
ionic-team · Apr 10, 2014 · eb1dee9 · eb1dee9
1 parent 56eb2cf
commit eb1dee9
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 11 deletions.
diff --git a/js/ext/angular/src/directive/ionicNavBar.js b/js/ext/angular/src/directive/ionicNavBar.js
@@ -191,8 +191,6 @@ function($scope, $element, $attrs, $ionicViewService, $animate, $compile, $ionic
   this._animateTitles = function() {
     var oldTitleEl, newTitleEl, currentTitles;
 
-    console.log('animateTItles');
-
     //If we have any title right now
     //(or more than one, they could be transitioning on switch),
     //replace the first one with an oldTitle element

diff --git a/js/ext/angular/src/service/ionicLoading.js b/js/ext/angular/src/service/ionicLoading.js
@@ -111,18 +111,19 @@ function($animate, $document, $ionicTemplateLoader, $ionicBackdrop, $timeout, $q
             }
           });
 
+          this.isShown = true;
           ionic.requestAnimationFrame(function() {
-            $animate.removeClass(self.element, 'ng-hide');
-            //Fix for ios: if we center the element twice, it always gets
-            //position right. Otherwise, it doesn't
-            ionic.DomUtil.centerElementByMargin(self.element[0]);
-            //One frame after it's visible, position it
-            ionic.requestAnimationFrame(function() {
+            if (self.isShown) {
+              $animate.removeClass(self.element, 'ng-hide');
+              //Fix for ios: if we center the element twice, it always gets
+              //position right. Otherwise, it doesn't
               ionic.DomUtil.centerElementByMargin(self.element[0]);
-            });
+              //One frame after it's visible, position it
+              ionic.requestAnimationFrame(function() {
+                ionic.DomUtil.centerElementByMargin(self.element[0]);
+              });
+            }
           });
-
-          this.isShown = true;
         };
         loader.hide = function() {
           if (this.isShown) {

diff --git a/js/ext/angular/test/service/ionicLoading.unit.js b/js/ext/angular/test/service/ionicLoading.unit.js
@@ -134,6 +134,20 @@ describe('$ionicLoading service', function() {
       expect(loader.isShown).toBe(false);
       expect(loader.element.hasClass('ng-hide')).toBe(true);
     }));
+    it('show should only removeClass after raf is still isShown', inject(function($ionicLoading) {
+      var loader = TestUtil.unwrapPromise($ionicLoading._getLoader());
+      var rafCallback;
+      ionic.requestAnimationFrame = function(cb) { 
+        rafCallback = cb;
+      };
+      loader.show({});
+      expect(loader.isShown).toBe(true);
+      loader.hide();
+      expect(loader.isShown).toBe(false);
+      rafCallback();
+      expect(loader.element.hasClass('ng-hide')).toBe(true);
+      ionic.requestAnimationFrame = function(cb) { cb(); };
+    }));
 
   });
 });