feat(tabs): migrate to Modular Ionic#31116
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
| <button class="expand" onclick="updateBadgeCount()">Update Badge Count</button> | ||
| <button class="expand" onclick="updateBadgeColor()">Update Badge Color</button> |
There was a problem hiding this comment.
These buttons weren't doing anything. I do plan on adding updateBadgeCount to the tab-bar/test/badge page when we migrate.
| </ion-header> | ||
| <ion-content class="ion-padding"> | ||
| Page Four | ||
| <h1>Page Four</h1> |
There was a problem hiding this comment.
Following the setup of the other 3 pages.
| private setActive(selectedTab: HTMLIonTabElement): Promise<void> { | ||
| if (this.transitioning) { | ||
| return Promise.reject('transitioning already happening'); | ||
| return Promise.reject(new Error('transitioning already happening')); |
There was a problem hiding this comment.
This change attaches a stack trace to the rejection, making it easier to identify where the error originated when debugging.
|
|
||
| if (!tabEl) { | ||
| printIonError(`[ion-tabs] - Tab with id: "${tabEl}" does not exist`); | ||
| printIonError(`[ion-tabs] - Tab with id: "${tab}" does not exist`); |
There was a problem hiding this comment.
This kept showing as [ion-tabs] - Tab with id: "undefined" does not exist so I fixed it by passing the correct variable.
|
|
||
| contain: layout size style; | ||
| z-index: $z-index-page-container; | ||
| z-index: 0; |
There was a problem hiding this comment.
Was inlining 0 here instead of using $z-index-page-container deliberate? nav.scss and router-outlet.scss are still on the variable, so tabs becomes the lone magic number until they migrate too. Is the plan to define $z-index-page-container somewhere reachable from mixins.scss, or to inline 0 everywhere once those two migrate as well? Either way it works, but a short comment noting it tracks the page-container z-index would keep the intent visible during the transition.
Issue number: resolves internal
What is the current behavior?
ion-tabsuses a legacy@importin its stylesheet, has a separatetabs-interface.tsfile (hyphen naming), and carries a@virtualProp themedoc that is no longer applicable after the Modular Ionic migration. An error message in thegetTabhelper always logs"undefined"instead of the actual tab id that was passed.What is the new behavior?
tabs-interface.ts->tabs.interfaces.tsto match the format in Modular Ionic@import "native.globals"to@use "../../themes/mixins" as mixins@virtualProp themeJSDocgetTab. Now correctly logs the tab id passed by the caller instead of always logging"undefined"Does this introduce a breaking change?
Other information
Previews