import { mount } from '@vue/test-utils'
import Button from '../src/index.vue'
const AXIOM = 'Rem is the best girl'
const COMMON_CONFIG = {
global: {
provide: {
elForm: {},
elFormItem: {},
},
},
}
describe('Button.vue', () => {
it('create', () => {
const wrapper = mount(Button, {
props: { type: 'primary' },
...COMMON_CONFIG,
})
expect(wrapper.classes()).toContain('el-button--primary')
})
it('icon', () => {
const wrapper = mount(Button, {
props: { icon: 'el-icon-search' },
...COMMON_CONFIG,
})
expect(wrapper.find('.el-icon-search').exists()).toBeTruthy()
})
it('nativeType', () => {
const wrapper = mount(Button, {
props: { nativeType: 'submit' },
...COMMON_CONFIG,
})
expect(wrapper.attributes('type')).toBe('submit')
})
it('loading', () => {
const wrapper = mount(Button, {
props: { loading: true },
...COMMON_CONFIG,
})
expect(wrapper.classes()).toContain('is-loading')
expect(wrapper.find('.el-icon-loading').exists()).toBeTruthy()
})
it('size', () => {
const wrapper = mount(Button, {
props: { size: 'medium' },
...COMMON_CONFIG,
})
expect(wrapper.classes()).toContain('el-button--medium')
})
it('plain', () => {
const wrapper = mount(Button, {
props: { plain: true },
...COMMON_CONFIG,
})
expect(wrapper.classes()).toContain('is-plain')
})
it('round', () => {
const wrapper = mount(Button, {
props: { round: true },
...COMMON_CONFIG,
})
expect(wrapper.classes()).toContain('is-round')
})
it('circle', () => {
const wrapper = mount(Button, {
props: { circle: true },
...COMMON_CONFIG,
})
expect(wrapper.classes()).toContain('is-circle')
})
test('render text', () => {
const wrapper = mount(Button, {
slots: {
default: AXIOM,
},
...COMMON_CONFIG,
})
expect(wrapper.text()).toEqual(AXIOM)
})
test('handle click', async () => {
const wrapper = mount(Button, {
slots: {
default: AXIOM,
},
...COMMON_CONFIG,
})
await wrapper.trigger('click')
expect(wrapper.emitted()).toBeDefined()
})
test('handle click inside', async () => {
const wrapper = mount(Button, {
slots: {
default: '',
},
...COMMON_CONFIG,
})
await (wrapper.element.querySelector('.inner-slot')).click()
expect(wrapper.emitted()).toBeDefined()
})
test('loading implies disabled', async () => {
const wrapper = mount(Button, {
slots: {
default: AXIOM,
},
props: { loading: true },
...COMMON_CONFIG,
})
await wrapper.trigger('click')
expect(wrapper.emitted('click')).toBeUndefined()
})
it('disabled', async () => {
const wrapper = mount(Button, {
props: { disabled: true },
...COMMON_CONFIG,
})
expect(wrapper.classes()).toContain('is-disabled')
await wrapper.trigger('click')
expect(wrapper.emitted('click')).toBeUndefined()
})
})