From 5faabb1847ec4bb8073ea0f3153d26e33163a0b9 Mon Sep 17 00:00:00 2001
From: Andy Joslin <andytjoslin@gmail.com>
Date: Sat, 8 Mar 2014 13:10:54 -0700
Subject: [PATCH] test(ionBar): make tests instant

---
 js/ext/angular/src/directive/ionicBar.js      |  2 +-
 .../angular/test/directive/ionicBar.unit.js   | 67 +++++++------------
 js/views/headerBarView.js                     | 51 +++++++-------
 3 files changed, 52 insertions(+), 68 deletions(-)

diff --git a/js/ext/angular/src/directive/ionicBar.js b/js/ext/angular/src/directive/ionicBar.js
index 431c24cb16..1528b3631a 100644
--- a/js/ext/angular/src/directive/ionicBar.js
+++ b/js/ext/angular/src/directive/ionicBar.js
@@ -50,7 +50,7 @@ angular.module('ionic.ui.header', ['ngAnimate', 'ngSanitize'])
  *  align-title="center">
  * </ion-header-bar>
  * ```
- * 
+ *
  */
 .directive('ionHeaderBar', ['$ionicScrollDelegate', function($ionicScrollDelegate) {
   return {
diff --git a/js/ext/angular/test/directive/ionicBar.unit.js b/js/ext/angular/test/directive/ionicBar.unit.js
index 1e9b3d27cb..ea6d8e01ef 100644
--- a/js/ext/angular/test/directive/ionicBar.unit.js
+++ b/js/ext/angular/test/directive/ionicBar.unit.js
@@ -3,60 +3,41 @@ describe('Ionic Header Bar', function() {
 
   beforeEach(module('ionic'));
 
-  beforeEach(inject(function($compile, $rootScope) {
+  beforeEach(inject(function($animate, $compile, $rootScope) {
     compile = $compile;
     rootScope = $rootScope;
+    ionic.requestAnimationFrame = function(cb) { cb(); };
+    $animate.enabled(false);
+    el = null;
   }));
 
   it('Should not add title-left or title-right classes when align-title=center', function() {
-    runs(function(){
-      el = compile('<ion-header-bar align-title="center"></ion-header-bar>')(rootScope);
-    });
-
-    //wait for headerBar View to align() the title
-    waits(500);
-
-    runs(function(){
-      var headerView = el.isolateScope().headerBarView;
-      var title = angular.element(headerView.el.querySelector('.title'));
-      expect(title.hasClass('title-left')).not.toEqual(true);
-      expect(title.hasClass('title-right')).not.toEqual(true);
-    });
+    el = compile('<ion-header-bar align-title="center"></ion-header-bar>')(rootScope);
+    var headerView = el.isolateScope().headerBarView;
+    var title = angular.element(headerView.el.querySelector('.title'));
+    expect(title.hasClass('title-left')).not.toEqual(true);
+    expect(title.hasClass('title-right')).not.toEqual(true);
   });
 
-  it('Should add title-left class when align-title=left', function() {
-    runs(function(){
-      el = compile('<ion-header-bar align-title="left"></ion-header-bar>')(rootScope);
-    });
-
-    //wait for headerBar View to align() the title
-    waits(500);
-
-    runs(function(){
-      var headerView = el.isolateScope().headerBarView;
-      var title = angular.element(headerView.el.querySelector('.title'));
-      expect(title.hasClass('title-left')).toEqual(true);
-    });
-  });
+  it('Should add title-left class when align-title=left', inject(function($animate) {
+    el = compile('<ion-header-bar align-title="left"></ion-header-bar>')(rootScope);
+    rootScope.$apply();
+    var headerView = el.isolateScope().headerBarView;
+    var title = angular.element(headerView.el.querySelector('.title'));
+    expect(title.hasClass('title-left')).toEqual(true);
+  }));
 
   it('Should add title-right class when align-title=right', function() {
-    runs(function(){
-      el = compile('<ion-header-bar align-title="right"></ion-header-bar>')(rootScope);
-    });
-
-    //wait for headerBar View to align() the title
-    waits(500);
-
-    runs(function(){
-      var headerView = el.isolateScope().headerBarView;
-      var title = angular.element(headerView.el.querySelector('.title'));
-      expect(title.hasClass('title-right')).toEqual(true);
-    });
+    el = compile('<ion-header-bar align-title="right"></ion-header-bar>')(rootScope);
+    rootScope.$apply();
+    var headerView = el.isolateScope().headerBarView;
+    var title = angular.element(headerView.el.querySelector('.title'));
+    expect(title.hasClass('title-right')).toEqual(true);
   });
 
   it('Should re-align the title when leftButtons change', function() {
     rootScope.leftButtons = [];
-    el = compile('<ion-header-bar left-buttons="leftButtons" align-title="right"></ion-header-bar>')(rootScope); 
+    el = compile('<ion-header-bar left-buttons="leftButtons" align-title="right"></ion-header-bar>')(rootScope);
     var headerView = el.isolateScope().headerBarView;
 
     //trigger initial align()
@@ -73,7 +54,7 @@ describe('Ionic Header Bar', function() {
 
     it('Should re-align the title when rightButtons change', function() {
     rootScope.rightButtons = [];
-    el = compile('<ion-header-bar right-buttons="rightButtons" align-title="right"></ion-header-bar>')(rootScope); 
+    el = compile('<ion-header-bar right-buttons="rightButtons" align-title="right"></ion-header-bar>')(rootScope);
     var headerView = el.isolateScope().headerBarView;
 
     //trigger initial align()
@@ -88,6 +69,6 @@ describe('Ionic Header Bar', function() {
     expect(headerView.align).toHaveBeenCalled();
   });
 
-    
+
 
 });
diff --git a/js/views/headerBarView.js b/js/views/headerBarView.js
index eb59b9f7b3..0e79d321ef 100644
--- a/js/views/headerBarView.js
+++ b/js/views/headerBarView.js
@@ -17,10 +17,10 @@
      * so that the header text size is maximized and aligned
      * correctly as long as possible.
      */
-    align: ionic.animationFrameThrottle(function(titleSelector) {
+    align: function() {
 
       // Find the titleEl element
-      var titleEl = this.el.querySelector(titleSelector || '.title');
+      var titleEl = this.el.querySelector('.title');
       if(!titleEl) {
         return;
       }
@@ -56,32 +56,35 @@
         }
       }
 
-      var margin = Math.max(leftWidth, rightWidth) + 10;
+      var self = this;
+      ionic.requestAnimationFrame(function() {
+        var margin = Math.max(leftWidth, rightWidth) + 10;
 
-      // Size and align the header titleEl based on the sizes of the left and
-      // right children, and the desired alignment mode
-      if(this.alignTitle == 'center') {
-        if(margin > 10) {
-          titleEl.style.left = margin + 'px';
-          titleEl.style.right = margin + 'px';
-        }
-        if(titleEl.offsetWidth < titleEl.scrollWidth) {
+        // Size and align the header titleEl based on the sizes of the left and
+        // right children, and the desired alignment mode
+        if(self.alignTitle == 'center') {
+          if(margin > 10) {
+            titleEl.style.left = margin + 'px';
+            titleEl.style.right = margin + 'px';
+          }
+          if(titleEl.offsetWidth < titleEl.scrollWidth) {
+            if(rightWidth > 0) {
+              titleEl.style.right = (rightWidth + 5) + 'px';
+            }
+          }
+        } else if(self.alignTitle == 'left') {
+          titleEl.classList.add('title-left');
+          if(leftWidth > 0) {
+            titleEl.style.left = (leftWidth + 15) + 'px';
+          }
+        } else if(self.alignTitle == 'right') {
+          titleEl.classList.add('title-right');
           if(rightWidth > 0) {
-            titleEl.style.right = (rightWidth + 5) + 'px';
+            titleEl.style.right = (rightWidth + 15) + 'px';
           }
         }
-      } else if(this.alignTitle == 'left') {
-        titleEl.classList.add('title-left');
-        if(leftWidth > 0) {
-          titleEl.style.left = (leftWidth + 15) + 'px';
-        }
-      } else if(this.alignTitle == 'right') {
-        titleEl.classList.add('title-right');
-        if(rightWidth > 0) {
-          titleEl.style.right = (rightWidth + 15) + 'px';
-        }
-      }
-    })
+      });
+    }
   });
 
 })(ionic);