Ionic-framework: bug: ionic vue cannot destroy and re-create tabs

[scottix]

Bug Report

Ionic version:


[ ] 4.x
[x] 5.x

Current behavior:
When I have an initial view like a login page. Then I navigate to a page with tabs. It work fine, when I hit the back button and then click on the link to view the tab bar again it fails.

Expected behavior:
Should load the page again with the tabBar

Steps to reproduce:

1. Load first page.
2. Click link to go to view with tab bar
3. Hit the back button
4. Hit the link again to go to the view with the tab bar

Related code:

I have a sample app here.
https://github.com/scottix/vue-pretab

Console log of error

Uncaught (in promise) TypeError: Cannot set property 'selectedTab' of null
    at Proxy.checkActiveTab (index.js?8a30:1007)
    at eval (router.js?66ab:157)
    at Array.forEach (<anonymous>)
    at handleHistoryChange (router.js?66ab:157)
    at eval (router.js?66ab:5)
    at eval (vue-router.esm-bundler.js?6c02:1830)
    at new Promise (<anonymous>)
    at eval (vue-router.esm-bundler.js?6c02:1804)
    at eval (vue-router.esm-bundler.js?6c02:2725)
checkActiveTab @ index.js?8a30:1007
eval @ router.js?66ab:157
handleHistoryChange @ router.js?66ab:157
eval @ router.js?66ab:5
eval @ vue-router.esm-bundler.js?6c02:1830
eval @ vue-router.esm-bundler.js?6c02:1804
eval @ vue-router.esm-bundler.js?6c02:2725
Promise.then (async)
pushWithRedirect @ vue-router.esm-bundler.js?6c02:2398
push @ vue-router.esm-bundler.js?6c02:2338
navigate @ router.js?66ab:168
handleClick @ index.js?8a30:63
callWithErrorHandling @ runtime-core.esm-bundler.js?5c40:154
callWithAsyncErrorHandling @ runtime-core.esm-bundler.js?5c40:163
invoker @ runtime-dom.esm-bundler.js?830f:292

Other information:
Seems like it doesn't get loaded again properly.

Ionic info:

Ionic:
   Ionic CLI       : 6.11.8-testing.0 (/usr/lib/node_modules/@ionic/cli)
   Ionic Framework : @ionic/vue 0.5.2

System:

   NodeJS : v12.18.4 (/usr/bin/node)
   npm    : 6.14.6
   OS     : Linux 5.4

[liamdebeasi]

Thanks for the issue. Can you try the following dev build and let me know if it resolves the issue?

npm install @ionic/[email protected] @ionic/[email protected]

[scottix]

Yep fixes this bug.

Thanks for the issue. Can you try the following dev build and let me know if it resolves the issue?

npm install @ionic/[email protected] @ionic/[email protected]

[liamdebeasi]

Thanks for the issue. This has been resolved via https://github.com/ionic-team/ionic-framework/pull/22261, and a fix will be available in an upcoming release of Ionic Framework.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.