Skip to content

Conversation

@ShaneK
Copy link
Member

@ShaneK ShaneK commented Dec 11, 2025

Issue number: resolves #30448


What is the current behavior?

When using ion-tabs with routes that share a common prefix (e.g., /home, /home2, /home3), navigating to /home2 incorrectly highlights the /home tab. This occurs because the tab matching logic uses pathname.startsWith(href), which causes /home2 to match /home since /home2 starts with /home.

What is the new behavior?

Tab selection now uses path segment matching instead of simple prefix matching. A tab's href will only match if the pathname is an exact match OR starts with the href followed by a / (for nested routes). This ensures /home2 no longer incorrectly matches /home, while still allowing /home/details to correctly match the /home tab.

Does this introduce a breaking change?

  • Yes
  • No

Other information

Current dev build:

8.7.13-dev.11765486444.14025098

@ShaneK ShaneK requested a review from a team as a code owner December 11, 2025 21:01
@ShaneK ShaneK requested a review from BenOsodrac December 11, 2025 21:01
@vercel
Copy link

vercel bot commented Dec 11, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
ionic-framework Ready Ready Preview Comment Dec 11, 2025 9:06pm

@github-actions github-actions bot added package: vue @ionic/vue package package: react @ionic/react package labels Dec 11, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: react @ionic/react package package: vue @ionic/vue package

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug: tab buttons aren't visibly selected when switching between routes that are substrings of another route

2 participants