javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-14 16:52:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

bug(breadcrumbs): color attribute shows on DOM for Vue (#27040)

Browse Source 
Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
This commit is contained in:
Maria Hutt
2023-03-30 09:57:02 -07:00
committed by GitHub
parent 7864a21ca3
commit dd419c0066
6 changed files with 71 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/vue/test/base/src/router/index.ts
View File

@ -70,6 +70,10 @@ const routes: Array<RouteRecordRaw> = [
path: '/components',
component: () => import('@/views/Components.vue'),
},
{
path: '/components/breadcrumbs',
component: () => import('@/views/Breadcrumbs.vue')
},
{
path: '/components/select',
component: () => import('@/views/Select.vue')

53
packages/vue/test/base/src/views/Breadcrumbs.vue Normal file
View File

@ -0,0 +1,53 @@
<template>
<ion-page>
<ion-header>
<ion-toolbar>
<ion-title>Breadcrumbs</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<h1>Default</h1>
<ion-breadcrumbs id="default">
<ion-breadcrumb href="#"> Home </ion-breadcrumb>
<ion-breadcrumb href="#electronics"> Electronics </ion-breadcrumb>
<ion-breadcrumb href="#photography"> Photography </ion-breadcrumb>
<ion-breadcrumb href="#cameras"> Cameras </ion-breadcrumb>
<ion-breadcrumb href="#film"> Film </ion-breadcrumb>
<ion-breadcrumb> 35 mm </ion-breadcrumb>
</ion-breadcrumbs>
<hr />
<h1>Color: Danger</h1>
<ion-breadcrumbs id="color" color="danger">
<ion-breadcrumb href="#"> Home </ion-breadcrumb>
<ion-breadcrumb href="#electronics"> Electronics </ion-breadcrumb>
<ion-breadcrumb href="#photography"> Photography </ion-breadcrumb>
<ion-breadcrumb href="#cameras"> Cameras </ion-breadcrumb>
<ion-breadcrumb href="#film"> Film </ion-breadcrumb>
<ion-breadcrumb> 35 mm </ion-breadcrumb>
</ion-breadcrumbs>
</ion-content>
</ion-page>
</template>
<script lang="ts">
import {
IonPage,
IonHeader,
IonToolbar,
IonTitle,
IonContent,
IonBreadcrumbs,
} from "@ionic/vue";
import { defineComponent } from "vue";
export default defineComponent({
components: {
IonPage,
IonHeader,
IonToolbar,
IonTitle,
IonContent,
IonBreadcrumbs,
},
});
</script>

3
packages/vue/test/base/src/views/Components.vue
View File

@ -2,6 +2,9 @@
<ion-page>
<ion-content>
<ion-list>
<ion-item button router-link="/components/breadcrumbs">
<ion-label>Breadcrumbs</ion-label>
</ion-item>
<ion-item button router-link="/components/select">
<ion-label>Select</ion-label>
</ion-item>

9
packages/vue/test/base/tests/e2e/specs/breadcrumbs.cy.js Normal file
View File

@ -0,0 +1,9 @@
describe("Components: Breadcrumbs", () => {
beforeEach(() => {
cy.visit("http://localhost:8080/components/breadcrumbs");
});
it("should have color attribute", () => {
cy.get('ion-breadcrumbs#color').should('have.prop', 'color');
});
});