Skip to content

Commit ad50a11

Browse files
committed
fix(nav): reset zIndex when goes under 0
Closes #5718
1 parent e92feef commit ad50a11

File tree

2 files changed

+44
-6
lines changed

2 files changed

+44
-6
lines changed

ionic/components/nav/nav-controller.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1261,8 +1261,18 @@ export class NavController extends Ion {
12611261
view.destroy();
12621262
});
12631263

1264+
// if any z-index goes under 0, then reset them all
1265+
let shouldResetZIndex = this._views.some(v => v.zIndex < 0);
1266+
if (shouldResetZIndex) {
1267+
this._views.forEach(view => {
1268+
view.setZIndex( view.zIndex + INIT_ZINDEX + 1, this._renderer );
1269+
});
1270+
}
12641271
}
12651272

1273+
/**
1274+
* @private
1275+
*/
12661276
ngOnDestroy() {
12671277
for (var i = this._views.length - 1; i >= 0; i--) {
12681278
this._views[i].destroy();

ionic/components/nav/test/nav-controller.spec.ts

Lines changed: 34 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -350,6 +350,30 @@ export function run() {
350350
expect(view2.destroy).toHaveBeenCalled();
351351
expect(view3.destroy).toHaveBeenCalled();
352352
});
353+
354+
it('should reset zIndexes if their is a negative zindex', () => {
355+
let view1 = new ViewController(Page1);
356+
view1.setPageRef( getElementRef() );
357+
view1.state = STATE_INACTIVE;
358+
view1.zIndex = -1;
359+
360+
let view2 = new ViewController(Page2);
361+
view2.setPageRef( getElementRef() );
362+
view2.state = STATE_INACTIVE;
363+
view2.zIndex = 0;
364+
365+
let view3 = new ViewController(Page3);
366+
view3.setPageRef( getElementRef() );
367+
view3.state = STATE_ACTIVE;
368+
view3.zIndex = 1;
369+
370+
nav._views = [view1, view2, view3];
371+
nav._cleanup();
372+
373+
expect(view1.zIndex).toEqual(10);
374+
expect(view2.zIndex).toEqual(11);
375+
expect(view3.zIndex).toEqual(12);
376+
});
353377
});
354378

355379
describe('_postRender', () => {
@@ -747,7 +771,7 @@ export function run() {
747771

748772
nav._transFinish(1, enteringView, leavingView, 'back', hasCompleted);
749773

750-
expect(nav._cleanup).toHaveBeenCalled()
774+
expect(nav._cleanup).toHaveBeenCalled();
751775
});
752776

753777
it('should not run cleanup when most not recent transition', () => {
@@ -763,7 +787,7 @@ export function run() {
763787

764788
nav._transFinish(2, enteringView, leavingView, 'back', hasCompleted);
765789

766-
expect(nav._cleanup).not.toHaveBeenCalled()
790+
expect(nav._cleanup).not.toHaveBeenCalled();
767791
});
768792

769793
it('should not run cleanup when it hasnt completed transition, but is the most recent', () => {
@@ -779,7 +803,7 @@ export function run() {
779803

780804
nav._transFinish(1, enteringView, leavingView, 'back', hasCompleted);
781805

782-
expect(nav._cleanup).not.toHaveBeenCalled()
806+
expect(nav._cleanup).not.toHaveBeenCalled();
783807
});
784808

785809
it('should set transitioning is over when most recent transition finishes', () => {
@@ -1150,9 +1174,7 @@ export function run() {
11501174
});
11511175

11521176
function mockNav() {
1153-
let elementRef = {
1154-
nativeElement: document.createElement('div')
1155-
};
1177+
let elementRef = getElementRef();
11561178

11571179
let nav = new NavController(null, null, config, null, elementRef, null, null, null, null, null);
11581180

@@ -1178,6 +1200,12 @@ export function run() {
11781200
return nav;
11791201
}
11801202

1203+
function getElementRef() {
1204+
return {
1205+
nativeElement: document.createElement('div')
1206+
}
1207+
}
1208+
11811209
});
11821210
}
11831211

0 commit comments

Comments
 (0)