fix(tabs): reload tab after previous clearHistory()

Closes #2664
ionic-team · Feb 10, 2015 · 3628eba · 3628eba
1 parent 2b88b4f
commit 3628eba
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 1 deletion.
diff --git a/js/angular/directive/tab.js b/js/angular/directive/tab.js
@@ -178,6 +178,7 @@ function($compile, $ionicConfig, $ionicBind, $ionicViewSwitcher) {
         function destroyTab() {
           childScope && childScope.$destroy();
           isTabContentAttached && childElement && childElement.remove();
+          tabContentEle.innerHTML = '';
           isTabContentAttached = childScope = childElement = null;
         }
 

diff --git a/js/angular/service/viewSwitcher.js b/js/angular/service/viewSwitcher.js
@@ -76,7 +76,7 @@ function($timeout, $document, $q, $ionicClickBlock, $ionicConfig, $ionicNavBarDe
                 enteringEle = viewEle;
               }
 
-            } else if (viewEle.data(DATA_ELE_IDENTIFIER) === navViewActiveEleId) {
+            } else if (isDefined(navViewActiveEleId) && viewEle.data(DATA_ELE_IDENTIFIER) === navViewActiveEleId) {
               leavingEle = viewEle;
             }
 

diff --git a/test/unit/angular/directive/navView.unit.js b/test/unit/angular/directive/navView.unit.js
@@ -145,6 +145,13 @@ describe('Ionic nav-view', function() {
       }
     }
   },
+  tab1page2State = {
+    views: {
+      'tab1': {
+        template: 'tab1page2'
+      }
+    }
+  },
   tab2page1State = {
     views: {
       'tab2': {
@@ -194,6 +201,7 @@ describe('Ionic nav-view', function() {
       .state('ionViewCacheFalseProperty', ionViewCacheFalsePropertyState)
       .state('tabAbstract', tabAbstractState)
       .state('tabAbstract.tab1page1', tab1page1State)
+      .state('tabAbstract.tab1page2', tab1page2State)
       .state('tabAbstract.tab2page1', tab2page1State)
       .state('tabAbstract.tab3page1', tab3page1State)
       .state('tabAbstract.tab3page2', tab3page2NoCacheState)
@@ -981,6 +989,53 @@ describe('Ionic nav-view', function() {
     expect(tab3Ele.getAttribute('nav-view')).toBe('cached');
   }));
 
+  it('should clear cached tab and reload on return to tab', inject(function ($state, $q, $timeout, $compile, $ionicHistory) {
+    elem.append($compile('<ion-nav-view name="root"></ion-nav-view>')(scope));
+
+    $state.go(tab1page1State);
+    $q.flush();
+    $timeout.flush();
+
+    var tab1Ele = elem[0].querySelector('ion-nav-view[name="tab1"]');
+    expect(tab1Ele.getAttribute('nav-view')).toBe('active');
+    expect(tab1Ele.childElementCount).toBe(1);
+
+    $state.go(tab1page2State);
+    $q.flush();
+    $timeout.flush();
+
+    tab1Ele = elem[0].querySelector('ion-nav-view[name="tab1"]');
+    expect(tab1Ele.getAttribute('nav-view')).toBe('active');
+    expect(tab1Ele.childElementCount).toBe(2);
+
+    $state.go(tab2page1State);
+    $q.flush();
+    $timeout.flush();
+
+    var tab2Ele = elem[0].querySelector('ion-nav-view[name="tab2"]');
+    expect(tab1Ele.getAttribute('nav-view')).toBe('cached');
+    expect(tab1Ele.childElementCount).toBe(2);
+    expect(tab2Ele.getAttribute('nav-view')).toBe('active');
+    expect(tab2Ele.childElementCount).toBe(1);
+
+    $ionicHistory.clearCache();
+
+    tab1Ele = elem[0].querySelector('ion-nav-view[name="tab1"]');
+    expect(tab1Ele).toEqual(null);
+
+    tab2Ele = elem[0].querySelector('ion-nav-view[name="tab2"]');
+    expect(tab2Ele.getAttribute('nav-view')).toBe('active');
+    expect(tab2Ele.childElementCount).toBe(1);
+
+    $state.go(tab1page1State);
+    $q.flush();
+    $timeout.flush();
+
+    tab1Ele = elem[0].querySelector('ion-nav-view[name="tab1"]');
+    expect(tab1Ele.getAttribute('nav-view')).toBe('active');
+    expect(tab1Ele.childElementCount).toBe(1);
+  }));
+
   it('should not cache ion-views when going between history and its the first load, stateParam cache=false', inject(function ($state, $q, $timeout, $compile, $ionicConfig) {
     elem.append($compile('<ion-nav-view name="root"></ion-nav-view>')(scope));