bug: Vue - Tabs - 5.9.2 - Double click on TabButton breaks tabs-routing

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

• v4.x
• v5.x
• v6.x

Current Behavior

When double clicking a Tab, routing to other Tabs when pressing their TabButton is not working anymore. See:

https://user-images.githubusercontent.com/24892172/145353512-2df35d16-51cb-4b86-9ce2-b14a0661821e.mov

Expected Behavior

Expected to be routed to the Tab when pressing on the Tab2-TabButton (Step 4).

Steps to Reproduce

1. Click on Tab2 --> Routes to Tab2
2. Click on Tab1 --> Routes to Tab1
3. Click Tab1 again --> nothing happens (we already are on the correct tab)
4. Click Tab2 --> route changes but we are not routed to Tab2

Reprocution code is simply a Tabs starter project generated with:

ionic start ionic-vue-tabs-double-tab-bug tabs --type vue

and changed these two lines in the package.json to:

    "@ionic/vue": "5.9.2",
    "@ionic/vue-router": "5.9.2",

Code Reproduction URL

https://github.com/Predarion/ionic-vue-tabs-double-tab-bug

Ionic Info

[WARN] Error loading @capacitor/ios package.json: Error: Cannot find module ‘@capacitor/ios/package’

   Require stack:
   - /usr/local/lib/node_modules/@ionic/cli/lib/project/index.js
   - /usr/local/lib/node_modules/@ionic/cli/lib/index.js
   - /usr/local/lib/node_modules/@ionic/cli/index.js
   - /usr/local/lib/node_modules/@ionic/cli/bin/ionic

[WARN] Error loading @capacitor/android package.json: Error: Cannot find module ‘@capacitor/android/package’

   Require stack:
   - /usr/local/lib/node_modules/@ionic/cli/lib/project/index.js
   - /usr/local/lib/node_modules/@ionic/cli/lib/index.js
   - /usr/local/lib/node_modules/@ionic/cli/index.js
   - /usr/local/lib/node_modules/@ionic/cli/bin/ionic

Ionic:

Ionic CLI : 6.18.1 (/usr/local/lib/node_modules/@ionic/cli) Ionic Framework : @ionic/vue 5.9.2

Capacitor:

Capacitor CLI : 3.3.3 @capacitor/android : not installed @capacitor/core : 3.3.3 @capacitor/ios : not installed

Utility:

cordova-res : not installed globally native-run : 1.5.0

System:

NodeJS : v16.13.0 (/usr/local/bin/node) npm : 8.1.0 OS : macOS Big Sur

Additional Information

This bug might be introduced with the changes from

• vue: switching between tabs preserves query string (#24297) (047d3c7), closes #23699

as this behavior does not occur with version 5.9.1, but does occur with version 5.9.2 and the dev build of aboves issue:

npm install @ionic/[e-mail]1402b @ionic/[e-mail]1402b

[liamdebeasi]

This has been released in Ionic 6.0.1 and Ionic 5.9.3. Ionic 5 users can use the v5-lts tag to get the latest version of Ionic 5:

npm install @ionic/vue@v5-lts @ionic/vue-router@v5-lts

[liamdebeasi]

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