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

fix(vue): ensure that only tab pages get added to the tab navigation stack (#25045)

Browse Source 
resolves #24859
This commit is contained in:
Liam DeBeasi
2022-04-12 10:22:36 -04:00
committed by GitHub
parent da89684877
commit a0054a7cbd
2 changed files with 46 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
packages/vue-router/src/router.ts
View File

@ -65,7 +65,6 @@ export const createIonRouter = (opts: IonicVueRouterOptions, router: Router) =>
let currentRouteInfo: RouteInfo; let currentRouteInfo: RouteInfo;
let incomingRouteParams: RouteParams; let incomingRouteParams: RouteParams;
let currentTab: string | undefined;
// TODO types // TODO types
let historyChangeListeners: any[] = []; let historyChangeListeners: any[] = [];
@ -238,8 +237,7 @@ export const createIonRouter = (opts: IonicVueRouterOptions, router: Router) =>
if (action === 'replace') { if (action === 'replace') {
incomingRouteParams = { incomingRouteParams = {
routerAction: 'replace', routerAction: 'replace',
routerDirection: 'none', routerDirection: 'none'
tab: currentTab
} }
} else if (action === 'pop') { } else if (action === 'pop') {
const routeInfo = locationHistory.current(initialHistoryPosition, currentHistoryPosition - delta); const routeInfo = locationHistory.current(initialHistoryPosition, currentHistoryPosition - delta);
@ -254,16 +252,15 @@ export const createIonRouter = (opts: IonicVueRouterOptions, router: Router) =>
} else { } else {
incomingRouteParams = { incomingRouteParams = {
routerAction: 'pop', routerAction: 'pop',
routerDirection: 'none', routerDirection: 'none'
tab: currentTab
} }
} }
} }
if (!incomingRouteParams) { if (!incomingRouteParams) {
incomingRouteParams = { incomingRouteParams = {
routerAction: 'push', routerAction: 'push',
routerDirection: direction || 'forward', routerDirection: direction || 'forward'
tab: currentTab
} }
} }
} }
@ -288,7 +285,6 @@ export const createIonRouter = (opts: IonicVueRouterOptions, router: Router) =>
} }
if (isPushed) { if (isPushed) {
routeInfo.tab = leavingLocationInfo.tab;
routeInfo.pushedByRoute = (leavingLocationInfo.pathname !== '') ? leavingLocationInfo.pathname : undefined; routeInfo.pushedByRoute = (leavingLocationInfo.pathname !== '') ? leavingLocationInfo.pathname : undefined;
} else if (routeInfo.routerAction === 'pop') { } else if (routeInfo.routerAction === 'pop') {
const route = locationHistory.findLastLocation(routeInfo); const route = locationHistory.findLastLocation(routeInfo);
@ -460,9 +456,18 @@ export const createIonRouter = (opts: IonicVueRouterOptions, router: Router) =>
} }
} }
/**
* This method is invoked by the IonTabs component
* during a history change callback. It is responsible
* for ensuring that tabbed routes have the correct
* "tab" field in its routeInfo object.
*
* IonTabs will determine if the current route
* is in tabs and assign it the correct tab.
* If the current route is not in tabs,
* then IonTabs will not invoke this.
*/
const handleSetCurrentTab = (tab: string) => { const handleSetCurrentTab = (tab: string) => {
currentTab = tab;
const ri = { ...locationHistory.last() }; const ri = { ...locationHistory.last() };
if (ri.tab !== tab) { if (ri.tab !== tab) {
ri.tab = tab; ri.tab = tab;

32
packages/vue/test-app/tests/e2e/specs/tabs.js
View File

@ -435,7 +435,7 @@ describe('Tabs', () => {
}); });
// Verifies fix for https://github.com/ionic-team/ionic-framework/issues/24432 // Verifies fix for https://github.com/ionic-team/ionic-framework/issues/24432
it('should correct replace a route in a child tab route', () => { it('should correctly replace a route in a child tab route', () => {
cy.visit('http://localhost:8080/tabs'); cy.visit('http://localhost:8080/tabs');
cy.routerPush('/tabs/tab1/childone'); cy.routerPush('/tabs/tab1/childone');
@ -446,6 +446,36 @@ describe('Tabs', () => {
cy.ionPageVisible('tab1'); cy.ionPageVisible('tab1');
cy.ionPageDoesNotExist('tab1childone'); cy.ionPageDoesNotExist('tab1childone');
}) })
// Verifies fix for https://github.com/ionic-team/ionic-framework/issues/24859
it('should go back to the root page after navigating between tab and non tab outlets', () => {
cy.visit('http://localhost:8080');
cy.routerPush('/tabs/tab1');
cy.ionPageVisible('tab1');
cy.ionPageHidden('home');
cy.get('ion-tab-button#tab-button-tab2').click();
cy.ionPageHidden('tab1');
cy.ionPageVisible('tab2');
cy.routerPush('/routing');
cy.ionPageVisible('routing');
cy.ionPageHidden('tabs');
cy.routerPush('/tabs/tab1');
cy.ionPageVisible('tabs');
cy.ionPageVisible('tab1');
cy.ionPageHidden('routing');
cy.get('ion-tab-button#tab-button-tab2').click();
cy.ionPageHidden('tab1');
cy.ionPageVisible('tab2');
cy.ionBackClick('tab2');
cy.ionPageVisible('home');
cy.ionPageDoesNotExist('tabs');
});
}) })
describe('Tabs - Swipe to Go Back', () => { describe('Tabs - Swipe to Go Back', () => {