fix(tabs): preserve query params and fragment from tab button href

[ShaneK]

Issue number: resolves #25470

---

What is the current behavior?

When an <ion-tab-button> declares an href with a query string or fragment, activating the tab drops both. In Angular, IonTabs.select navigates to tabsPrefix/tab and never reads the button's href. In Vue, the router splits the path on ? and discards everything after it, and IonTabBar compares the raw href against the pathname so a tab with query params never shows as selected. In React, this issue has been fixed as part of the RR6 migration.

What is the new behavior?

Tab activation forwards the href's query and fragment as navigation extras. A saved view's previously-captured extras still win when re-selecting a tab with prior history, so mid-stack state isn't clobbered. IonTabBar's selection check now compares pathnames only, so a tab with a query string still highlights when its pathname is active.

Added Playwright coverage in @ionic/angular and Cypress coverage in @ionic/vue for first visit, switching tabs, switching back, and re-clicking the active tab. The Vue tests will cause a conflict on merging into major-9.0, but I volunteer to fix that issue when it comes up.

Does this introduce a breaking change?

• Yes
• No

Other information

Preview pages:

• Angular: https://ionic-framework-git-fw-7146-ionic1.vercel.app/angular/standalone/tabs-search-params/tab1?foo=bar
• Vue: https://ionic-framework-git-fw-7146-ionic1.vercel.app/vue/tabs-search-params/tab1?foo=bar

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
ionic-framework	Ready	Preview, Comment	May 19, 2026 3:43pm