javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-08 15:51:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(nav): getLength is part of the public API (#28832)

Browse Source 
resolves #28826

BREAKING CHANGE: `getLength` returns `Promise<number>` instead of `<number>`. This method was not previously available in Nav's TypeScript interface, but developers could still access it by casting Nav as `any`. Developers should ensure they `await` their `getLength` call before accessing the returned value.
This commit is contained in:
Liam DeBeasi
2024-01-16 11:54:25 -05:00
committed by GitHub
parent 76f6362410
commit 4fd05b6416
5 changed files with 52 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
BREAKING.md
View File

@ -19,6 +19,7 @@ This is a comprehensive list of the breaking changes introduced in the major ver
- [Button](#version-8x-button)
- [Content](#version-8x-content)
- [Datetime](#version-8x-datetime)
- [Nav](#version-8x-nav)
- [Picker](#version-8x-picker)
<h2 id="version-8x-browser-platform-support">Browser and Platform Support</h2>
@ -80,6 +81,10 @@ This allows components to inherit the color properly when used outside of Ionic
}
```
<h4 id="version-8x-nav">Nav</h4>
- `getLength` returns `Promise<number>` instead of `<number>`. This method was not previously available in Nav's TypeScript interface, but developers could still access it by casting Nav as `any`. Developers should ensure they `await` their `getLength` call before accessing the returned value.
<h4 id="version-8x-picker">Picker</h4>
- `ion-picker` and `ion-picker-column` have been renamed to `ion-picker-legacy` and `ion-picker-legacy-column`, respectively. This change was made to accommodate the new inline picker component while allowing developers to continue to use the legacy picker during this migration period.

1
core/api.txt
View File

@ -884,6 +884,7 @@ ion-nav,prop,swipeGesture,boolean | undefined,undefined,false,false
ion-nav,method,canGoBack,canGoBack(view?: ViewController) => Promise<boolean>
ion-nav,method,getActive,getActive() => Promise<ViewController | undefined>
ion-nav,method,getByIndex,getByIndex(index: number) => Promise<ViewController | undefined>
ion-nav,method,getLength,getLength() => Promise<number>
ion-nav,method,getPrevious,getPrevious(view?: ViewController) => Promise<ViewController | undefined>
ion-nav,method,insert,insert<T extends NavComponent>(insertIndex: number, component: T, componentProps?: ComponentProps<T> | null, opts?: NavOptions | null, done?: TransitionDoneFn) => Promise<boolean>
ion-nav,method,insertPages,insertPages(insertIndex: number, insertComponents: NavComponent[] | NavComponentWithProps[], opts?: NavOptions | null, done?: TransitionDoneFn) => Promise<boolean>

4
core/src/components.d.ts vendored
View File

@ -1822,6 +1822,10 @@ export namespace Components {
* @param index The index of the view.
*/
"getByIndex": (index: number) => Promise<ViewController | undefined>;
/**
* Returns the number of views in the stack.
*/
"getLength": () => Promise<number>;
/**
* Get the previous view.
* @param view The view to get.

8
core/src/components/nav/nav.tsx
View File

@ -483,8 +483,12 @@ export class Nav implements NavOutlet {
return this.getPreviousSync(view);
}
getLength() {
return this.views.length;
/**
* Returns the number of views in the stack.
*/
@Method()
async getLength(): Promise<number> {
return Promise.resolve(this.views.length);
}
private getActiveSync(): ViewController | undefined {

72
core/src/components/nav/test/nav-controller.spec.ts
View File

@ -23,7 +23,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(push1Done).toHaveBeenCalledWith(hasCompleted, requiresTransition, view1, undefined, 'forward');
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView1);
// Push 2
@ -32,7 +32,7 @@ describe('NavController', () => {
expect(push2Done).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view1, 'forward');
expect(nav.getLength()).toEqual(2);
expect(await nav.getLength()).toEqual(2);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
@ -41,7 +41,7 @@ describe('NavController', () => {
await nav.push(view3, null, { animated: false }, push3Done);
expect(push3Done).toHaveBeenCalledWith(hasCompleted, requiresTransition, view3, view2, 'forward');
expect(nav.getLength()).toEqual(3);
expect(await nav.getLength()).toEqual(3);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
expect(nav['views'][2].component).toEqual(MockView3);
@ -50,7 +50,7 @@ describe('NavController', () => {
const view4 = mockView(MockView4);
await nav.push(view4, null, { animated: false }, push4Done);
expect(push4Done).toHaveBeenCalledWith(hasCompleted, requiresTransition, view4, view3, 'forward');
expect(nav.getLength()).toEqual(4);
expect(await nav.getLength()).toEqual(4);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
expect(nav['views'][2].component).toEqual(MockView3);
@ -59,7 +59,7 @@ describe('NavController', () => {
// Pop 1
await nav.pop({ animated: false }, pop1Done);
expect(pop1Done).toHaveBeenCalledWith(hasCompleted, requiresTransition, view3, view4, 'back');
expect(nav.getLength()).toEqual(3);
expect(await nav.getLength()).toEqual(3);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
expect(nav['views'][2].component).toEqual(MockView3);
@ -67,14 +67,14 @@ describe('NavController', () => {
// Pop 2
await nav.pop({ animated: false }, pop2Done);
expect(pop2Done).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view3, 'back');
expect(nav.getLength()).toEqual(2);
expect(await nav.getLength()).toEqual(2);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
// Pop 3
await nav.pop({ animated: false }, pop3Done);
expect(pop3Done).toHaveBeenCalledWith(hasCompleted, requiresTransition, view1, view2, 'back');
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView1);
}, 10000);
});
@ -86,7 +86,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view1, undefined, 'forward');
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['isTransitioning']).toEqual(false);
}, 10000);
@ -102,7 +102,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view1, 'forward');
expect(nav.getLength()).toEqual(2);
expect(await nav.getLength()).toEqual(2);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
expect(nav['isTransitioning']).toEqual(false);
@ -134,7 +134,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view1, 'forward');
expect(nav.getLength()).toEqual(2);
expect(await nav.getLength()).toEqual(2);
}, 10000);
});
@ -156,9 +156,9 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = false;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, undefined, undefined, undefined);
expect(nav.getLength()).toEqual(4);
expect(await nav.getLength()).toEqual(4);
expect(nav['views'][0].component).toEqual(MockView4);
expect(nav['views'][nav.getLength() - 1].component).toEqual(MockView3);
expect(nav['views'][(await nav.getLength()) - 1].component).toEqual(MockView3);
}, 10000);
it('should insert at the end when given -1', async () => {
@ -172,8 +172,8 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view1, 'forward');
expect(nav.getLength()).toEqual(2);
expect(nav['views'][nav.getLength() - 1].component).toEqual(MockView2);
expect(await nav.getLength()).toEqual(2);
expect(nav['views'][(await nav.getLength()) - 1].component).toEqual(MockView2);
}, 10000);
it('should insert at the end when given a number greater than actual length', async () => {
@ -185,8 +185,8 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view1, 'forward');
expect(nav.getLength()).toEqual(2);
expect(nav['views'][nav.getLength() - 1].component).toEqual(MockView2);
expect(await nav.getLength()).toEqual(2);
expect(nav['views'][(await nav.getLength()) - 1].component).toEqual(MockView2);
}, 10000);
it('should not insert if null view', (done) => {
@ -197,14 +197,14 @@ describe('NavController', () => {
.then(() => {
fail('it should not succeed');
})
.catch((err: Error) => {
.catch(async (err: Error) => {
const hasCompleted = false;
const requiresTransition = false;
const rejectReason = new Error('invalid views to insert');
expect(err).toEqual(rejectReason);
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, rejectReason);
expect(nav.getLength()).toEqual(1);
expect(nav['views'][nav.getLength() - 1].component).toEqual(MockView1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][(await nav.getLength()) - 1].component).toEqual(MockView1);
done();
});
}, 10000);
@ -232,7 +232,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = false;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, undefined, undefined, undefined);
expect(nav.getLength()).toEqual(5);
expect(await nav.getLength()).toEqual(5);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView4);
expect(nav['views'][2].component).toEqual(MockView5);
@ -251,13 +251,13 @@ describe('NavController', () => {
.then(() => {
fail('it should not succeed');
})
.catch((err: any) => {
.catch(async (err: any) => {
const hasCompleted = false;
const requiresTransition = false;
const rejectReason = new Error('no views in the stack to be removed');
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, rejectReason);
expect(err).toEqual(rejectReason);
expect(nav.getLength()).toEqual(0);
expect(await nav.getLength()).toEqual(0);
expect(nav['isTransitioning']).toEqual(false);
done();
});
@ -287,7 +287,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view1, view2, 'back');
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['isTransitioning']).toEqual(false);
}, 10000);
@ -305,7 +305,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view3, 'back');
expect(nav.getLength()).toEqual(2);
expect(await nav.getLength()).toEqual(2);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
}, 10000);
@ -322,7 +322,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view4, 'back');
expect(nav.getLength()).toEqual(2);
expect(await nav.getLength()).toEqual(2);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
}, 10000);
@ -368,7 +368,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view1, view4, 'back');
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView1);
}, 10000);
});
@ -415,7 +415,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view1, view4, 'back');
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView1);
}, 10000);
@ -427,7 +427,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = false;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, undefined, undefined, undefined);
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView1);
}, 10000);
});
@ -474,7 +474,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = false;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, undefined, undefined, undefined);
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView4);
}, 10000);
@ -527,7 +527,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = false;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, undefined, undefined, undefined);
expect(nav.getLength()).toEqual(3);
expect(await nav.getLength()).toEqual(3);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
expect(nav['views'][2].component).toEqual(MockView5);
@ -574,7 +574,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view4, 'back');
expect(nav.getLength()).toEqual(2);
expect(await nav.getLength()).toEqual(2);
expect(nav['views'][0].component).toEqual(MockView1);
expect(nav['views'][1].component).toEqual(MockView2);
}, 10000);
@ -613,7 +613,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = false;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, undefined, undefined, undefined);
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView3);
}, 10000);
@ -649,7 +649,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view2, view3, 'back');
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView2);
}, 10000);
@ -685,7 +685,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view1, view3, 'back');
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView1);
}, 10000);
@ -708,7 +708,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view4, view3, 'back');
expect(nav.getLength()).toEqual(1);
expect(await nav.getLength()).toEqual(1);
expect(nav['views'][0].component).toEqual(MockView4);
}, 10000);
});
@ -732,7 +732,7 @@ describe('NavController', () => {
const hasCompleted = true;
const requiresTransition = true;
expect(trnsDone).toHaveBeenCalledWith(hasCompleted, requiresTransition, view5, view2, 'back');
expect(nav.getLength()).toEqual(2);
expect(await nav.getLength()).toEqual(2);
expect(nav['views'][0].component).toEqual(MockView4);
expect(nav['views'][1].component).toEqual(MockView5);
}, 10000);