mirrors/element
1
0
Fork 0
mirror of https://github.com/ElemeFE/element.git synced 2025-12-16 11:44:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

Result: add result component (#21171)

Browse Source
This commit is contained in:
好多大米
2021-07-21 15:20:25 +08:00
committed by GitHub
parent 6bbc046563
commit 09e789bad2
21 changed files with 692 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
test/unit/specs/descriptions.spec.js
View File

@@ -12,7 +12,7 @@ describe('Descriptions', () => {
{
template: `
<el-descriptions title="title" extra="extra">
<el-descriptions-item v-for="item in 4"></el-descriptions-item>
<el-descriptions-item v-for="item in 4" :key="item"></el-descriptions-item>
</el-descriptions>
`
},
@@ -29,8 +29,8 @@ describe('Descriptions', () => {
{
template: `
<el-descriptions border>
<el-descriptions-item v-for="item in 3" :label="item">{{ item }}</el-descriptions-item>
</el-descriptions
<el-descriptions-item v-for="item in 3" :label="item" :key="item">{{ item }}</el-descriptions-item>
</el-descriptions>
`
},
true
@@ -44,7 +44,7 @@ describe('Descriptions', () => {
{
template: `
<el-descriptions border label-class-name="label-class-name" content-class-name="content-class-name">
<el-descriptions-item v-for="item in 3" :label="item">{{ item }}</el-descriptions-item>
<el-descriptions-item v-for="item in 3" :label="item" :key="item">{{ item }}</el-descriptions-item>
</el-descriptions>
`
},
@@ -58,7 +58,7 @@ describe('Descriptions', () => {
vm = createVue({
template: `
<el-descriptions :column="5" :border="border">
<el-descriptions-item v-for="item in 10" :label="item">{{ item }}</el-descriptions-item>
<el-descriptions-item v-for="item in 10" :label="item" :key="item">{{ item }}</el-descriptions-item>
</el-descriptions>
`,
data() {
@@ -79,7 +79,7 @@ describe('Descriptions', () => {
template: `
<el-descriptions :column="5" :direction="direction" border>
<el-descriptions-item v-for="item in 10" :label="item">{{ item }}</el-descriptions-item>
<el-descriptions-item v-for="item in 10" :label="item" :key="item">{{ item }}</el-descriptions-item>
</el-descriptions>
`,
data() {
@@ -102,7 +102,7 @@ describe('Descriptions', () => {
template: `
<el-descriptions>
<template slot="title">title</template>
<el-descriptions-item v-for="item in 10" :label="item">{{ item }}</el-descriptions-item>
<el-descriptions-item v-for="item in 10" :label="item" :key="item">{{ item }}</el-descriptions-item>
</el-descriptions>
`
}, true);

120
test/unit/specs/result.spec.js Normal file
View File

@@ -0,0 +1,120 @@
import { createVue, destroyVM, waitImmediate } from '../util';
const AXIOM = 'Rem is the best girl';
describe('Result', () => {
let vm;
afterEach(() => {
destroyVM(vm);
});
it('render test', () => {
vm = createVue({
template: '<el-result />'
}, true);
expect(vm.$el.querySelector('.el-result__icon')).to.exist;
expect(Array.from(vm.$el.classList)).to.contain('el-result');
});
it('should render title props', () => {
vm = createVue({
template: '<el-result :title="title"/>',
data() {
return {
title: AXIOM
};
}
}, true);
expect(vm.$el.querySelector('.el-result__title').innerText).to.be.equal(AXIOM);
});
it('should render sub-title props', () => {
vm = createVue({
template: '<el-result :sub-title="subTitle"/>',
data() {
return {
subTitle: AXIOM
};
}
}, true);
expect(vm.$el.querySelector('.el-result__subtitle').innerText).to.be.equal(AXIOM);
});
it('should render icon props', async() => {
vm = createVue({
template: '<el-result :icon="icon"/>',
data() {
return {
icon: 'success'
};
}
}, true);
expect(vm.$el.querySelector('.el-result__icon svg')).to.exist;
expect(Array.from(vm.$el.querySelector('.el-result__icon svg').classList)).to.contain('icon-success');
vm.icon = 'error';
await waitImmediate();
expect(vm.$el.querySelector('.el-result__icon svg')).to.exist;
expect(Array.from(vm.$el.querySelector('.el-result__icon svg').classList)).to.contain('icon-error');
vm.icon = 'warning';
await waitImmediate();
expect(vm.$el.querySelector('.el-result__icon svg')).to.exist;
expect(Array.from(vm.$el.querySelector('.el-result__icon svg').classList)).to.contain('icon-warning');
vm.icon = 'info';
await waitImmediate();
expect(vm.$el.querySelector('.el-result__icon svg')).to.exist;
expect(Array.from(vm.$el.querySelector('.el-result__icon svg').classList)).to.contain('icon-info');
});
it('should render icon slots', () => {
vm = createVue({
template: '<el-result><template slot="icon">{{icon}}</template></el-result>',
data() {
return {
icon: AXIOM
};
}
}, true);
expect(vm.$el.querySelector('.el-result__icon')).to.exist;
expect(vm.$el.querySelector('.el-result__icon').innerText).to.be.equal(AXIOM);
});
it('should render title slots', () => {
vm = createVue({
template: '<el-result><template slot="title">{{title}}</template></el-result>',
data() {
return {
title: AXIOM
};
}
}, true);
expect(vm.$el.querySelector('.el-result__title')).to.exist;
expect(vm.$el.querySelector('.el-result__title').innerText).to.be.equal(AXIOM);
});
it('should render sub-title slots', () => {
vm = createVue({
template: '<el-result><template slot="subTitle">{{subTitle}}</template></el-result>',
data() {
return {
subTitle: AXIOM
};
}
}, true);
expect(vm.$el.querySelector('.el-result__subtitle')).to.exist;
expect(vm.$el.querySelector('.el-result__subtitle').innerText).to.be.equal(AXIOM);
});
it('should render extra slots', () => {
vm = createVue({
template: '<el-result><template slot="extra">{{extra}}</template></el-result>',
data() {
return {
extra: AXIOM
};
}
}, true);
expect(vm.$el.querySelector('.el-result__extra')).to.exist;
expect(vm.$el.querySelector('.el-result__extra').innerText).to.be.equal(AXIOM);
});
});