diff --git a/examples/docs/zh-cn/progress.md b/examples/docs/zh-cn/progress.md index ed9ab55ef..4a9a55736 100644 --- a/examples/docs/zh-cn/progress.md +++ b/examples/docs/zh-cn/progress.md @@ -20,7 +20,7 @@ ```html - + ``` diff --git a/packages/progress/src/progress.vue b/packages/progress/src/progress.vue index 163155e65..5dac70687 100644 --- a/packages/progress/src/progress.vue +++ b/packages/progress/src/progress.vue @@ -42,10 +42,6 @@ default: 'line', validator: val => ['line', 'circle'].indexOf(val) > -1 }, - size: { - type: String, - validator: val => !val || ['large', 'small'].indexOf(val) > -1 - }, percentage: { type: Number, default: 0, diff --git a/test/unit/specs/progress.spec.js b/test/unit/specs/progress.spec.js new file mode 100644 index 000000000..59fa8c2ee --- /dev/null +++ b/test/unit/specs/progress.spec.js @@ -0,0 +1,85 @@ +import { createVue } from '../util'; + +describe('Progress', () => { + it('create', () => { + const vm = createVue({ + template: ` +
+ + + +
+ ` + }, true); + expect(vm.$refs.percent0.$el.querySelector('.el-progress__text').innerText).to.be.equal('0%'); + expect(vm.$refs.percent0.$el.querySelector('.el-progress-bar__inner').style.width).to.be.equal('0%'); + + expect(vm.$refs.percent50.$el.querySelector('.el-progress__text').innerText).to.be.equal('50%'); + expect(vm.$refs.percent50.$el.querySelector('.el-progress-bar__inner').style.width).to.be.equal('50%'); + + expect(vm.$refs.percent100.$el.querySelector('.el-progress__text').innerText).to.be.equal('100%'); + expect(vm.$refs.percent100.$el.querySelector('.el-progress-bar__inner').style.width).to.be.equal('100%'); + }); + it('status', () => { + const vm = createVue({ + template: ` +
+ + + + +
+ ` + }, true); + expect(vm.$refs.lineSuccess.$el.classList.contains('is-success')).to.be.true; + expect(vm.$refs.lineSuccess.$el.querySelector('.el-progress__text .el-icon-circle-check')).to.be.exist; + expect(vm.$refs.lineException.$el.classList.contains('is-exception')).to.be.true; + expect(vm.$refs.lineException.$el.querySelector('.el-progress__text .el-icon-circle-cross')).to.be.exist; + + expect(vm.$refs.circleSuccess.$el.classList.contains('is-success')).to.be.true; + expect(vm.$refs.circleSuccess.$el.querySelector('.el-progress__text .el-icon-check')).to.be.exist; + expect(vm.$refs.circleException.$el.classList.contains('is-exception')).to.be.true; + expect(vm.$refs.circleException.$el.querySelector('.el-progress__text .el-icon-close')).to.be.exist; + }); + it('text inside', () => { + const vm = createVue({ + template: ` + + ` + }, true); + expect(vm.$el.classList.contains('el-progress--text-inside')).to.be.true; + }); + it('stroke width', () => { + const vm = createVue({ + template: ` + + ` + }, true); + expect(vm.$el.querySelector('.el-progress-bar__outer').style.height).to.be.equal('8px'); + }); + it('show text', () => { + const vm = createVue({ + template: ` + + ` + }, true); + expect(vm.$el.querySelector('.el-progress__text')).to.not.exist; + }); + it('circle', () => { + const vm = createVue({ + template: ` + + ` + }, true); + expect(vm.$el.classList.contains('el-progress--circle')).to.be.true; + }); + it('width', () => { + const vm = createVue({ + template: ` + + ` + }, true); + expect(vm.$el.querySelector('.el-progress-circle').style.height).to.be.equal('120px'); + expect(vm.$el.querySelector('.el-progress-circle').style.width).to.be.equal('120px'); + }); +});