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.

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

bug: tab sub-page navigation breaks occasionally with ionic-vue-router #29413

Open
3 tasks done
socialmedialabs opened this issue Apr 29, 2024 · 1 comment
Open
3 tasks done
Labels
package: vue @ionic/vue package type: bug a confirmed bug report

Comments

@socialmedialabs
Copy link

socialmedialabs commented Apr 29, 2024

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

Navigating into tab sub-page and clicking on the respective tab bar in order to get to the initial tab page breaks navigation occasionally.
Either nothing happens or the following error viewItem2 is undefined is shown, sometimes subsequently followed by this error enteringEl is undefined.

When this happens the navigation for the view in question stays broken. Other routes may keep working but eventually they stop working as well. The broken navigation point may starts working again.

Expected Behavior

Inside a tab navigating to a sub page and then to another tab and then back to the initial sub page and then clicking on the tab of the sub page again should lead me to the initial tab page, regardless of the order of navigation steps I took before.

Steps to Reproduce

Unfortunately there I wasn't able to identify precise steps in order to reproduce this. But I think these are steps that should work

  1. On Tab 1 click the Next button in order to enter Tab 1 sub page
  2. Click on Tab 5
  3. Click on Tab 3
  4. Click the Next button on Tab 3 in order to enter Tab 3 sub page
  5. Click on Tab 5 again
  6. Click Tab 1 (you should be on Tab 1 Sub Page)
  7. Click Tab 1 again in order to get to initial page of Tab 1
  8. There it is TypeError: viewItem2 is undefined @ionic_vue_router.js:562:7
  9. (If it's not broken by now go to Tab 3 (you should be on the sub page there), click Tab 3 again in order to get to the inital page of Tab 3 - Tab 3 doesn't do anything anymore)

Code Reproduction URL

https://stackblitz.com/~/github.com/socialmedialabs/ionic-sample-tabs-app

Ionic Info

Ionic:

Ionic CLI : 5.4.16 (/home/ubuntu/.nvm/versions/node/v21.6.1/lib/node_modules/ionic)

Capacitor:

Capacitor CLI : 6.0.0
@capacitor/core : 6.0.0

Utility:

cordova-res : not installed
native-run : 2.0.1

System:

NodeJS : v21.6.1 (/home/ubuntu/.nvm/versions/node/v21.6.1/bin/node)
npm : 10.2.4
OS : Linux 6.5

Additional Information

The coresponding Github repo can be found here: https://github.com/socialmedialabs/ionic-sample-tabs-app

@thetaPC
Copy link
Contributor

thetaPC commented May 2, 2024

Thank you for submitting the issue!

I was able to replicate it with your steps.

@thetaPC thetaPC added package: vue @ionic/vue package type: bug a confirmed bug report labels May 2, 2024
@ionitron-bot ionitron-bot bot removed the triage label May 2, 2024
@thetaPC thetaPC removed their assignment May 2, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: vue @ionic/vue package type: bug a confirmed bug report
Projects
None yet
Development

No branches or pull requests

2 participants