From a3294db4aeb88cb9a3c72e24d9c2f873895f4bf0 Mon Sep 17 00:00:00 2001 From: wzhaofei <505139165@qq.com> Date: Wed, 20 Oct 2021 23:20:51 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9card=E7=BB=84=E4=BB=B6?= =?UTF-8?q?=E6=B5=8B=E8=AF=95=E7=94=A8=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- devui/card/__tests__/card.spec.ts | 341 ++++++++++++++++-------------- 1 file changed, 185 insertions(+), 156 deletions(-) diff --git a/devui/card/__tests__/card.spec.ts b/devui/card/__tests__/card.spec.ts index b70b4692..f5bc5531 100644 --- a/devui/card/__tests__/card.spec.ts +++ b/devui/card/__tests__/card.spec.ts @@ -1,165 +1,194 @@ import { mount } from '@vue/test-utils'; -import { ref } from 'vue'; import DCard from '../src/card'; import DAvatar from '../../avatar/src/avatar'; -describe('Card', () => { - it('render', async () => { - const wrapper = mount({ - components: { - DCard, - DAvatar - }, - template: ` - - - - - - - - `, - - }); - - const avatar = wrapper.findAllComponents({ name: 'dAvatar' })[0]; - expect(avatar.classes()).toContain('devui-avatar'); - expect(avatar.find('.devui-avatar-style').text()).toBe('DE') - expect(wrapper.find('.devui-card-title').text()).toBe('DEVUI Course') - expect(wrapper.find('.devui-card-subtitle').text()).toBe('DevUI') - expect(wrapper.find('.devui-card-content').text()).toBe('DEVUI') - expect(wrapper.find('.devui-card-actions').exists()).toBeTruthy(); - expect(wrapper.find('.card-block').text()).toBe('btn') +describe('card', () => { + it('should render correctly', async () => { + const wrapper = mount(DCard); + expect(wrapper.element).toMatchSnapshot() + }) + it('should render correctly avatar', async () => { + const wrapper = mount({ + components: { + DCard, + DAvatar + }, + template: ` + + + + `, }); - it('v-slot:', async () => { - const wrapper = mount({ - components: { - DCard, - DAvatar - }, - template: ` - - - - - - - - `, - - }); - - const avatar = wrapper.findAllComponents({ name: 'dAvatar' })[0]; - expect(avatar.classes()).toContain('devui-avatar'); - expect(avatar.find('.devui-avatar-style').text()).toBe('DE') - expect(wrapper.find('.devui-card-title').text()).toBe('DEVUI Course') - expect(wrapper.find('.devui-card-subtitle').text()).toBe('DevUI') - expect(wrapper.find('.devui-card-content').text()).toBe('DEVUI') - expect(wrapper.find('.devui-card-actions').exists()).toBeTruthy(); - expect(wrapper.find('.card-block').text()).toBe('btn') + const avatar = wrapper.findAllComponents({ name: 'dAvatar' })[0]; + expect(avatar.classes()).toContain('devui-avatar'); + }) + it('in v-slot mode should render correctly avatar', async () => { + const wrapper = mount({ + components: { + DCard, + DAvatar + }, + template: ` + + + + `, }); - it('src', async () => { - const wrapper = mount({ - components: { - DCard, - DAvatar - }, - template: ` - - - - - - - - `, - - }); - - const avatar = wrapper.findAllComponents({ name: 'dAvatar' })[0]; - expect(avatar.classes()).toContain('devui-avatar'); - expect(avatar.find('.devui-avatar-style').text()).toBe('DE') - expect(wrapper.find('.devui-card-title').text()).toBe('DEVUI Course') - expect(wrapper.find('.devui-card-subtitle').text()).toBe('DevUI') - expect(wrapper.find('.devui-card-meta').attributes('src').includes('https://devui.design/components/assets/image1.png')).toBeTruthy(); - expect(wrapper.find('.devui-card-content').text()).toBe('DEVUI') - expect(wrapper.find('.devui-card-actions').exists()).toBeTruthy(); - expect(wrapper.find('.card-block').text()).toBe('btn') + const avatar = wrapper.findAllComponents({ name: 'dAvatar' })[0]; + expect(avatar.classes()).toContain('devui-avatar'); + }) + it('should render correctly title', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + + `, }); - it('src', async () => { - const wrapper = mount({ - components: { - DCard, - DAvatar - }, - template: ` - - - - - - - - `, - - }); - - expect(wrapper.find('.devui-card-actions-align-spaceBetween').exists()).toBeTruthy(); - const avatar = wrapper.findAllComponents({ name: 'dAvatar' })[0]; - expect(avatar.classes()).toContain('devui-avatar'); - expect(avatar.find('.devui-avatar-style').text()).toBe('DE') - expect(wrapper.find('.devui-card-title').text()).toBe('DEVUI Course') - expect(wrapper.find('.devui-card-subtitle').text()).toBe('DevUI') - expect(wrapper.find('.devui-card-content').text()).toBe('DEVUI') - expect(wrapper.find('.devui-card-actions').exists()).toBeTruthy(); - expect(wrapper.find('.card-block').text()).toBe('btn') + expect(wrapper.find('.devui-card-title').text()).toBe('DevUI') + }) + it('in v-slot mode should render title', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + + `, }); + expect(wrapper.find('.devui-card-title').text()).toBe('DEVUI Course') + }) + it('should render correctly subtitle', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + + `, + }); + expect(wrapper.find('.devui-card-subtitle').text()).toBe('DevUI') + }) + it('in v-slot mode should render subtitle', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + + `, + }); + expect(wrapper.find('.devui-card-subtitle').text()).toBe('DevUI') + }) + it('should render correctly content', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + + `, + }); + expect(wrapper.find('.devui-card-content').text()).toBe('DevUI') + }) + it('in v-slot mode should render content', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + + `, + }); + expect(wrapper.find('.devui-card-content').text()).toBe('DevUI') + }) + it('should render correctly actions', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + + `, + }); + expect(wrapper.find('.devui-card-actions').exists()).toBeTruthy(); + expect(wrapper.find('.card-block').text()).toBe('btn') + }) + it('in v-slot mode should render actions', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + + `, + }); + expect(wrapper.find('.devui-card-actions').exists()).toBeTruthy(); + expect(wrapper.find('.card-block').text()).toBe('btn') + }) + it('should render correctly image', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + `, + }); + expect(wrapper.find('.devui-card-meta').attributes('src').includes('https://devui.design/components/assets/image1.png')).toBeTruthy(); + }) + it('should render correctly align', async () => { + const wrapper = mount({ + components: { + DCard, + }, + template: ` + + + `, + }); + expect(wrapper.find('.devui-card-actions-align-spaceBetween').exists()).toBeTruthy(); + }) }) \ No newline at end of file -- Gitee