refactor(components): [alert] use JSX in Unit test (#7973)

This commit is contained in:
Xc
2022-05-30 09:38:12 +08:00
committed by GitHub
parent 37e2bfaee4
commit 01e5225798

View File

@@ -7,66 +7,39 @@ const AXIOM = 'Rem is the best girl'
describe('Alert.vue', () => {
test('render test & class', () => {
const wrapper = mount(Alert, {
props: {
title: AXIOM,
showIcon: true,
},
})
const wrapper = mount(() => <Alert title={AXIOM} showIcon={true} />)
expect(wrapper.find('.el-alert__title').text()).toEqual(AXIOM)
expect(wrapper.find('.el-alert').classes()).toContain('el-alert--info')
})
test('type', () => {
const wrapper = mount(Alert, {
props: {
title: 'test',
type: 'success',
showIcon: true,
},
})
const wrapper = mount(() => (
<Alert title={'test'} showIcon={true} type={'success'} />
))
expect(wrapper.find('.el-alert').classes()).toContain('el-alert--success')
expect(wrapper.find('.el-alert__icon').classes()).toContain('el-icon')
expect(wrapper.findComponent(TypeComponentsMap.success).exists()).toBe(true)
})
test('description', () => {
const wrapper = mount(Alert, {
props: {
title: 'Dorne',
description: AXIOM,
showIcon: true,
},
})
const wrapper = mount(() => (
<Alert title={'Dorne'} showIcon={true} description={AXIOM} />
))
expect(wrapper.find('.el-alert__description').text()).toEqual(AXIOM)
})
test('theme', () => {
const wrapper = mount(Alert, {
props: {
title: 'test',
effect: 'dark',
},
})
const wrapper = mount(() => <Alert title={'test'} effect={'dark'} />)
expect(wrapper.find('.el-alert').classes()).toContain('is-dark')
})
test('title slot', () => {
const wrapper = mount(Alert, {
slots: {
title: AXIOM,
},
})
const wrapper = mount(() => <Alert title={AXIOM} />)
expect(wrapper.find('.el-alert__title').text()).toEqual(AXIOM)
})
test('close', async () => {
const wrapper = mount(Alert, {
props: {
closeText: 'close',
},
})
const wrapper = mount(() => <Alert closeText={'close'} />)
const closeBtn = wrapper.find('.el-alert__close-btn')
expect(closeBtn.exists()).toBe(true)