mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-16 10:01:59 +08:00
fix(vue): go back to correct view with memory history (#25732)
resolves #25705
This commit is contained in:
@ -120,7 +120,12 @@ export const createIonRouter = (opts: IonicVueRouterOptions, router: Router) =>
|
|||||||
* will go back in a linear fashion.
|
* will go back in a linear fashion.
|
||||||
*/
|
*/
|
||||||
prevInfo.pathname === routeInfo.pushedByRoute &&
|
prevInfo.pathname === routeInfo.pushedByRoute &&
|
||||||
routeInfo.tab === '' && prevInfo.tab === ''
|
|
||||||
|
/**
|
||||||
|
* Tab info can be undefined or '' (empty string)
|
||||||
|
* both are false-y values, so we can just use !.
|
||||||
|
*/
|
||||||
|
!routeInfo.tab && !prevInfo.tab
|
||||||
)
|
)
|
||||||
) {
|
) {
|
||||||
router.back();
|
router.back();
|
||||||
|
76
packages/vue/test-app/tests/unit/memory.spec.ts
Normal file
76
packages/vue/test-app/tests/unit/memory.spec.ts
Normal file
@ -0,0 +1,76 @@
|
|||||||
|
import { mount } from '@vue/test-utils';
|
||||||
|
import { createRouter, createMemoryHistory } from '@ionic/vue-router';
|
||||||
|
import {
|
||||||
|
IonContent,
|
||||||
|
IonHeader,
|
||||||
|
IonToolbar,
|
||||||
|
IonBackButton,
|
||||||
|
IonicVue,
|
||||||
|
IonApp,
|
||||||
|
IonRouterOutlet,
|
||||||
|
IonPage,
|
||||||
|
} from '@ionic/vue';
|
||||||
|
import { waitForRouter } from './utils';
|
||||||
|
|
||||||
|
const App = {
|
||||||
|
components: { IonApp, IonRouterOutlet },
|
||||||
|
template: '<ion-app><ion-router-outlet /></ion-app>',
|
||||||
|
}
|
||||||
|
|
||||||
|
describe('createMemoryHistory', () => {
|
||||||
|
beforeAll(() => {
|
||||||
|
(HTMLElement.prototype as HTMLIonRouterOutletElement).commit = jest.fn();
|
||||||
|
});
|
||||||
|
it('should not error when going back with memory router', async () => {
|
||||||
|
const PageTemplate = {
|
||||||
|
template: `
|
||||||
|
<ion-page>
|
||||||
|
<ion-header>
|
||||||
|
<ion-toolbar>
|
||||||
|
<ion-back-button></ion-back-button>
|
||||||
|
</ion-toolbar>
|
||||||
|
</ion-header>
|
||||||
|
<ion-content></ion-content>
|
||||||
|
</ion-page>
|
||||||
|
`,
|
||||||
|
components: { IonPage, IonContent, IonHeader, IonToolbar, IonBackButton }
|
||||||
|
}
|
||||||
|
|
||||||
|
const router = createRouter({
|
||||||
|
history: createMemoryHistory(process.env.BASE_URL),
|
||||||
|
routes: [
|
||||||
|
{ path: '/', component: PageTemplate },
|
||||||
|
{ path: '/page2', component: PageTemplate },
|
||||||
|
{ path: '/page3', component: PageTemplate }
|
||||||
|
]
|
||||||
|
});
|
||||||
|
const push = jest.spyOn(router, 'back')
|
||||||
|
|
||||||
|
router.push('/');
|
||||||
|
await router.isReady();
|
||||||
|
const wrapper = mount(App, {
|
||||||
|
global: {
|
||||||
|
plugins: [router, IonicVue]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
router.push('/page2');
|
||||||
|
await waitForRouter();
|
||||||
|
|
||||||
|
router.push('/page3');
|
||||||
|
await waitForRouter();
|
||||||
|
|
||||||
|
|
||||||
|
const backButtons = wrapper.findAllComponents(IonBackButton);
|
||||||
|
const pageTwoButton = backButtons[1];
|
||||||
|
const pageThreeButton = backButtons[2];
|
||||||
|
|
||||||
|
await pageThreeButton.trigger('click');
|
||||||
|
await waitForRouter();
|
||||||
|
|
||||||
|
await pageTwoButton.trigger('click');
|
||||||
|
await waitForRouter();
|
||||||
|
|
||||||
|
expect(push).toHaveBeenCalledTimes(2);
|
||||||
|
});
|
||||||
|
})
|
Reference in New Issue
Block a user