javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(transition): no timeout after render

Browse Source
This commit is contained in:
Adam Bradley
2014-12-03 01:57:51 -06:00
parent d1c92dae14
commit 6b4963ea6f
2 changed files with 4 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
js/angular/service/viewSwitcher.js vendored
View File

@@ -163,9 +163,6 @@ function($timeout, $document, $q, $ionicClickBlock, $ionicConfig, $ionicNavBarDe
},
render: function(registerData, callback) {
var enteringData = getTransitionData(viewLocals, enteringEle, registerData.direction, enteringView);
var transitionFn = $ionicConfig.transitions.views[enteringData.transition];
// disconnect the leaving scope before reconnecting or creating a scope for the entering view
leavingEle && ionic.Utils.disconnectScope(leavingEle.scope());
@@ -173,15 +170,14 @@ function($timeout, $document, $q, $ionicClickBlock, $ionicConfig, $ionicNavBarDe
// it was already found in the DOM, just reconnect the scope
ionic.Utils.reconnectScope(enteringEle.scope());
// set the styles of where this element will end up going so
// the DOM has some time to render its correct starting point
transitionFn(enteringEle, null, enteringData.direction, false).run(0);
} else {
// the entering element is not already in the DOM
// set that the entering element should be "staged" and its
// styles of where this element will go before it hits the DOM
navViewAttr(enteringEle, VIEW_STATUS_STAGED);
var enteringData = getTransitionData(viewLocals, enteringEle, registerData.direction, enteringView);
var transitionFn = $ionicConfig.transitions.views[enteringData.transition];
transitionFn(enteringEle, null, enteringData.direction, true).run(0);
historyCursorAttr(enteringEle, registerData.isHistoryRoot ? HISTORY_ROOT : HISTORY_AFTER_ROOT);
@@ -203,7 +199,7 @@ function($timeout, $document, $q, $ionicClickBlock, $ionicConfig, $ionicNavBarDe
// update that this view was just accessed
enteringEle.data(DATA_VIEW_ACCESSED, Date.now());
$timeout(callback, 16);
callback && callback();
},
transition: function(direction, enableBack) {

53
test/unit/angular/directive/navView.unit.js
View File

@@ -340,7 +340,6 @@ describe('Ionic nav-view', function() {
$state.go(iState);
$q.flush();
$timeout.flush();
$timeout.flush();
// verify if ng-repeat has been compiled
expect(elem.find('li').length).toBe(scope.items.length);
@@ -349,7 +348,6 @@ describe('Ionic nav-view', function() {
$state.go(jState);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem[0].querySelector('[nav-view="active"]').innerText).toBe(jState.template);
@@ -357,7 +355,6 @@ describe('Ionic nav-view', function() {
$state.go(iState);
$q.flush();
$timeout.flush();
$timeout.flush();
// verify if the initial view is correct
expect(elem[0].querySelectorAll('[nav-view="active"] li').length).toBe(scope.items.length);
@@ -413,7 +410,6 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
var divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(1);
expect(divs.eq(0).attr('nav-view')).toBe('active');
@@ -422,7 +418,6 @@ describe('Ionic nav-view', function() {
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(2);
@@ -435,7 +430,6 @@ describe('Ionic nav-view', function() {
$state.go(page3State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(3);
@@ -451,7 +445,6 @@ describe('Ionic nav-view', function() {
$state.go(page4State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(4);
@@ -474,22 +467,18 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
$state.go(page3State);
$q.flush();
$timeout.flush();
$timeout.flush();
$state.go(page4State);
$q.flush();
$timeout.flush();
$timeout.flush();
var divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(4);
@@ -501,7 +490,6 @@ describe('Ionic nav-view', function() {
$state.go(page3State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(3);
expect(divs.eq(0).attr('nav-view')).toBe('cached');
@@ -511,7 +499,6 @@ describe('Ionic nav-view', function() {
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(2);
expect(divs.eq(0).attr('nav-view')).toBe('cached');
@@ -520,7 +507,6 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(1);
expect(divs.eq(0).attr('nav-view')).toBe('active');
@@ -532,7 +518,6 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
var divs = elem.find('ion-nav-view').find('div');
expect(divs.eq(0).scope().$$disconnected).toBeUndefined();
@@ -540,7 +525,6 @@ describe('Ionic nav-view', function() {
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.eq(0).scope().$$disconnected).toBe(true);
@@ -549,7 +533,6 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.eq(0).scope().$$disconnected).toBe(false);
}));
@@ -562,43 +545,36 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('div').length).toBe(1);
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('div').length).toBe(2);
$state.go(page3State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('div').length).toBe(3);
$state.go(page4State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('div').length).toBe(3);
$state.go(page3State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('div').length).toBe(2);
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('div').length).toBe(1);
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('div').length).toBe(1);
}));
@@ -649,14 +625,12 @@ describe('Ionic nav-view', function() {
$state.go(ionView1State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('ion-view').length).toBe(1);
expect(elem.find('ion-nav-view').find('ion-view').eq(0).text()).toBe('ionView1');
$state.go(ionViewCacheFalseAttrState);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('ion-view').length).toBe(2);
expect(elem.find('ion-nav-view').find('ion-view').eq(0).text()).toBe('ionView1');
expect(elem.find('ion-nav-view').find('ion-view').eq(1).text()).toBe('ionViewCacheFalseAttr');
@@ -664,7 +638,6 @@ describe('Ionic nav-view', function() {
$state.go(ionView2State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('ion-view').length).toBe(2);
expect(elem.find('ion-nav-view').find('ion-view').eq(0).text()).toBe('ionView1');
expect(elem.find('ion-nav-view').find('ion-view').eq(1).text()).toBe('ionView2');
@@ -676,14 +649,12 @@ describe('Ionic nav-view', function() {
$state.go(ionView1State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('ion-view').length).toBe(1);
expect(elem.find('ion-nav-view').find('ion-view').eq(0).text()).toBe('ionView1');
$state.go(ionViewCacheFalsePropertyState);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('ion-view').length).toBe(2);
expect(elem.find('ion-nav-view').find('ion-view').eq(0).text()).toBe('ionView1');
expect(elem.find('ion-nav-view').find('ion-view').eq(1).text()).toBe('ionViewCacheFalsePropertyState');
@@ -691,7 +662,6 @@ describe('Ionic nav-view', function() {
$state.go(ionView2State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(elem.find('ion-nav-view').find('ion-view').length).toBe(2);
expect(elem.find('ion-nav-view').find('ion-view').eq(0).text()).toBe('ionView1');
expect(elem.find('ion-nav-view').find('ion-view').eq(1).text()).toBe('ionView2');
@@ -705,7 +675,6 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
var divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(1);
expect(divs.eq(0).text()).toBe('page1');
@@ -713,7 +682,6 @@ describe('Ionic nav-view', function() {
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(2);
expect(divs.eq(1).text()).toBe('page2');
@@ -721,7 +689,6 @@ describe('Ionic nav-view', function() {
$state.go(page3State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(3);
expect(divs.eq(2).text()).toBe('page3');
@@ -729,21 +696,18 @@ describe('Ionic nav-view', function() {
$state.go(page4State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(4);
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(4);
$state.go(page5State);
$q.flush();
$timeout.flush();
$timeout.flush();
divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(4);
expect(divs.eq(0).text()).toBe('page1');
@@ -763,7 +727,6 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(loaded.stateName).toEqual('page1');
loaded = null;
@@ -771,21 +734,18 @@ describe('Ionic nav-view', function() {
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(loaded.stateName).toEqual('page2');
loaded = null;
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(loaded).toEqual(null);
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(loaded.stateName).toEqual('page2');
loaded = null;
@@ -808,7 +768,6 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(beforeEnter.stateName).toEqual('page1');
expect(afterEnter.stateName).toEqual('page1');
@@ -819,7 +778,6 @@ describe('Ionic nav-view', function() {
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(beforeEnter.stateName).toEqual('page2');
expect(afterEnter.stateName).toEqual('page2');
@@ -830,7 +788,6 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(beforeEnter.stateName).toEqual('page1');
expect(afterEnter.stateName).toEqual('page1');
@@ -856,12 +813,10 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(beforeLeave.stateName).toEqual('page1');
expect(afterLeave.stateName).toEqual('page1');
@@ -871,7 +826,6 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(beforeLeave.stateName).toEqual('page2');
expect(afterLeave.stateName).toEqual('page2');
@@ -881,7 +835,6 @@ describe('Ionic nav-view', function() {
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
expect(beforeLeave.stateName).toEqual('page1');
expect(afterLeave.stateName).toEqual('page1');
@@ -895,17 +848,14 @@ describe('Ionic nav-view', function() {
$state.go(page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
$state.go(page3State);
$q.flush();
$timeout.flush();
$timeout.flush();
var divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(3);
@@ -938,7 +888,6 @@ describe('Ionic nav-view', function() {
$state.go(page2State);
$q.flush();
$timeout.flush();
$timeout.flush();
var divs = elem.find('ion-nav-view').find('div');
expect(divs.length).toBe(1);
@@ -989,7 +938,6 @@ describe('Ionic nav-view', function() {
$state.go(tab3page2NoCacheState);
$q.flush();
$timeout.flush();
$timeout.flush();
var tab3NoCacheEle = elem[0].querySelector('ion-nav-view[name="tab3"]');
expect(tab3NoCacheEle.getAttribute('nav-view')).toBe('active');
@@ -1000,7 +948,6 @@ describe('Ionic nav-view', function() {
$state.go(tab1page1State);
$q.flush();
$timeout.flush();
$timeout.flush();
var tab1Ele = elem[0].querySelector('ion-nav-view[name="tab1"]');
expect(tab3NoCacheEle.getAttribute('nav-view')).toBe('cached');