mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-21 21:15:24 +08:00
test(tabs): clean up tabs badges e2e test so it works
This commit is contained in:
@ -1,6 +1,9 @@
|
|||||||
import {Component, ViewEncapsulation} from '@angular/core';
|
import {Component, ViewEncapsulation} from '@angular/core';
|
||||||
import {ionicBootstrap} from '../../../../../src';
|
import {ionicBootstrap} from '../../../../../src';
|
||||||
|
|
||||||
|
@Component({template:'hi'})
|
||||||
|
class E2EPage{}
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
templateUrl: 'main.html',
|
templateUrl: 'main.html',
|
||||||
@ -8,7 +11,8 @@ import {ionicBootstrap} from '../../../../../src';
|
|||||||
encapsulation: ViewEncapsulation.None
|
encapsulation: ViewEncapsulation.None
|
||||||
})
|
})
|
||||||
class E2EApp {
|
class E2EApp {
|
||||||
myBadge:number = 55;
|
root = E2EPage;
|
||||||
|
myBadge: number = 55;
|
||||||
}
|
}
|
||||||
|
|
||||||
ionicBootstrap(E2EApp);
|
ionicBootstrap(E2EApp);
|
||||||
|
@ -1,68 +1,68 @@
|
|||||||
|
|
||||||
<!-- Text -->
|
<!-- Text -->
|
||||||
<ion-tabs no-navbar>
|
<ion-tabs no-navbar>
|
||||||
<ion-tab tabTitle="Recents"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Recents"></ion-tab>
|
||||||
<ion-tab tabTitle="Favorites" tabBadge="32"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Favorites" tabBadge="32"></ion-tab>
|
||||||
<ion-tab tabTitle="Settings"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Settings"></ion-tab>
|
||||||
</ion-tabs>
|
</ion-tabs>
|
||||||
|
|
||||||
|
|
||||||
<!-- Icons -->
|
<!-- Icons -->
|
||||||
<ion-tabs no-navbar>
|
<ion-tabs no-navbar>
|
||||||
<ion-tab tabIcon="call"></ion-tab>
|
<ion-tab [root]="root" tabIcon="call"></ion-tab>
|
||||||
<ion-tab tabIcon="heart"></ion-tab>
|
<ion-tab [root]="root" tabIcon="heart"></ion-tab>
|
||||||
<ion-tab tabIcon="settings" tabBadge="all" tabBadgeStyle="primary"></ion-tab>
|
<ion-tab [root]="root" tabIcon="settings" tabBadge="all" tabBadgeStyle="primary"></ion-tab>
|
||||||
</ion-tabs>
|
</ion-tabs>
|
||||||
|
|
||||||
|
|
||||||
<!-- Icons on top of text -->
|
<!-- Icons on top of text -->
|
||||||
<ion-tabs no-navbar>
|
<ion-tabs no-navbar>
|
||||||
<ion-tab tabTitle="Location" tabIcon="navigate" tabBadge="11" tabBadgeStyle="secondary"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Location" tabIcon="navigate" tabBadge="11" tabBadgeStyle="secondary"></ion-tab>
|
||||||
<ion-tab tabTitle="Favorites" tabIcon="star"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="star"></ion-tab>
|
||||||
<ion-tab tabTitle="Radio" tabIcon="musical-notes"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Radio" tabIcon="musical-notes"></ion-tab>
|
||||||
</ion-tabs>
|
</ion-tabs>
|
||||||
|
|
||||||
|
|
||||||
<!-- Icons below text -->
|
<!-- Icons below text -->
|
||||||
<ion-tabs tabsLayout="icon-bottom" no-navbar>
|
<ion-tabs tabsLayout="icon-bottom" no-navbar>
|
||||||
<ion-tab tabTitle="Recents" tabIcon="call"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Recents" tabIcon="call"></ion-tab>
|
||||||
<ion-tab tabTitle="Favorites" tabIcon="heart" tabBadge="577" tabBadgeStyle="dark"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart" tabBadge="577" tabBadgeStyle="dark"></ion-tab>
|
||||||
<ion-tab tabTitle="Settings" tabIcon="settings"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings"></ion-tab>
|
||||||
</ion-tabs>
|
</ion-tabs>
|
||||||
|
|
||||||
|
|
||||||
<!-- Icons right of text -->
|
<!-- Icons right of text -->
|
||||||
<ion-tabs tabsLayout="icon-right" primary no-navbar>
|
<ion-tabs tabsLayout="icon-right" primary no-navbar>
|
||||||
<ion-tab tabTitle="Recents" tabIcon="call"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Recents" tabIcon="call"></ion-tab>
|
||||||
<ion-tab tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
||||||
<ion-tab tabTitle="Settings" tabIcon="settings" tabBadge="1030" tabBadgeStyle="light"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings" tabBadge="1030" tabBadgeStyle="light"></ion-tab>
|
||||||
</ion-tabs>
|
</ion-tabs>
|
||||||
|
|
||||||
<!-- Icons left of text -->
|
<!-- Icons left of text -->
|
||||||
<ion-tabs tabsLayout="icon-left" no-navbar>
|
<ion-tabs tabsLayout="icon-left" no-navbar>
|
||||||
<ion-tab tabTitle="Recents" tabIcon="call" tabBadge="32" tabBadgeStyle="danger"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Recents" tabIcon="call" tabBadge="32" tabBadgeStyle="danger"></ion-tab>
|
||||||
<ion-tab tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
||||||
<ion-tab tabTitle="Settings" tabIcon="settings"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings"></ion-tab>
|
||||||
</ion-tabs>
|
</ion-tabs>
|
||||||
|
|
||||||
<!-- No icons -->
|
<!-- No icons -->
|
||||||
<ion-tabs no-navbar tabsLayout="icon-hide">
|
<ion-tabs no-navbar tabsLayout="icon-hide">
|
||||||
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Recents" tabIcon="call"></ion-tab>
|
||||||
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root" tabBadge="4"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart" tabBadge="4"></ion-tab>
|
||||||
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings"></ion-tab>
|
||||||
</ion-tabs>
|
</ion-tabs>
|
||||||
|
|
||||||
|
|
||||||
<!-- No title -->
|
<!-- No title -->
|
||||||
<ion-tabs tabsLayout="title-hide" secondary no-navbar>
|
<ion-tabs tabsLayout="title-hide" secondary no-navbar>
|
||||||
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root" tabBadge="7" tabBadgeStyle="light"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Recents" tabIcon="call" tabBadge="7" tabBadgeStyle="light"></ion-tab>
|
||||||
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
||||||
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings"></ion-tab>
|
||||||
</ion-tabs>
|
</ion-tabs>
|
||||||
|
|
||||||
<!-- Dynamic Badge -->
|
<!-- Dynamic Badge -->
|
||||||
<ion-tabs tabsLayout="icon-left" no-navbar>
|
<ion-tabs tabsLayout="icon-left" no-navbar>
|
||||||
<ion-tab tabTitle="Recents" tabIcon="call"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Recents" tabIcon="call"></ion-tab>
|
||||||
<ion-tab tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
||||||
<ion-tab tabTitle="Settings" tabIcon="settings" [tabBadge]="myBadge" tabBadgeStyle="primary"></ion-tab>
|
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings" [tabBadge]="myBadge" tabBadgeStyle="primary"></ion-tab>
|
||||||
</ion-tabs>
|
</ion-tabs>
|
||||||
|
@ -8,4 +8,5 @@ ion-tabs ion-tabbar {
|
|||||||
top: auto;
|
top: auto;
|
||||||
height: auto;
|
height: auto;
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user