Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

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

Merged
merged 4 commits into from Jan 16, 2024
+52 −38
Merged

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

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
8191d0b
fix(nav): getLength is part of the public API
liamdebeasi Jan 15, 2024
93fcdbc
test: account for async getLength
liamdebeasi Jan 15, 2024
89af37e
chore: update breaking guide
liamdebeasi Jan 15, 2024
eddf6ce
Update BREAKING.md
liamdebeasi Jan 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
5 changes: 5 additions & 0 deletions BREAKING.md
View file
Open in desktop
Expand Up @@ -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>
Expand Down Expand Up @@ -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.
Expand Down
1 change: 1 addition & 0 deletions core/api.txt
View file
Open in desktop
Expand Up @@ -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>
Expand Down
4 changes: 4 additions & 0 deletions core/src/components.d.ts
View file
Open in desktop
Expand Up @@ -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.
Expand Down
8 changes: 6 additions & 2 deletions core/src/components/nav/nav.tsx
View file
Open in desktop
Expand Up @@ -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 {
Expand Down
72 changes: 36 additions & 36 deletions core/src/components/nav/test/nav-controller.spec.ts
View file
Open in desktop
Expand Up @@ -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
Expand All @@ -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);

Expand All @@ -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);
Expand All @@ -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);
Expand All @@ -59,22 +59,22 @@ 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);

// 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);
});
Expand All @@ -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);
Expand All @@ -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);
Expand Down Expand Up @@ -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);
});

Expand All @@ -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 () => {
Expand All @@ -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 () => {
Expand All @@ -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) => {
Expand All @@ -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);
Expand Down Expand Up @@ -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);
Expand All @@ -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();
});
Expand Down Expand Up @@ -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);
Expand All @@ -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);
Expand All @@ -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);
Expand Down Expand Up @@ -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);
});
Expand Down Expand Up @@ -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);

Expand All @@ -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);
});
Expand Down Expand Up @@ -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);

Expand Down Expand Up @@ -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);
Expand Down Expand Up @@ -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);
Expand Down Expand Up @@ -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);

Expand Down Expand Up @@ -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);

Expand Down Expand Up @@ -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);

Expand All @@ -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);
});
Expand All @@ -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);
Expand Down