import { mount } from '@vue/test-utils';
import { describe, expect, it } from 'vitest';
import { AppButton } from '@components/common/button';

describe('按钮', () => {
	expect(AppButton).toBeTruthy();
	it('type', async () => {
		const wrapper = mount(AppButton, {
			props: {
				type: 'primary',
			},
		});
		expect(wrapper.classes()).toContain('ant-btn-primary');
	});
	it('nativeType', () => {
		const wrapper = mount(AppButton, {
			props: {
				htmlType: 'submit',
			},
		});
		wrapper.attributes();
		expect(wrapper.attributes('type')).toBe('submit');
	});
	it('shape', () => {
		const wrapper = mount(AppButton, {
			props: {
				shape: 'circle',
			},
		});
		expect(wrapper.classes()).toContain('ant-btn-circle');
	});
	it('size', () => {
		const wrapper = mount(AppButton, {
			props: {
				size: 'large',
			},
		});
		expect(wrapper.classes()).toContain('ant-btn-lg');
	});
	it('loading', () => {
		const wrapper = mount(AppButton, {
			props: {
				loading: true,
			},
		});
		expect(wrapper.classes()).toContain('ant-btn-loading');
		expect(wrapper.find('.ant-btn-loading-icon').exists()).toBeTruthy();
	});
	it('disabled', async () => {
		const wrapper = mount(AppButton, {
			props: {
				disabled: true,
			},
		});
		const buttonEle = wrapper.find('button')
    	expect(buttonEle.element.disabled).not.toBeNull()
		await wrapper.trigger('click');
		expect(wrapper.emitted('click')).toBeUndefined();
	});
	it('ghost', () => {
		const wrapper = mount(AppButton, {
			props: {
				ghost: true,
			},
		});
		expect(wrapper.classes()).toContain('ant-btn-background-ghost');
	});
	it('danger', () => {
		const wrapper = mount(AppButton, {
			props: {
				danger: true,
			},
		});
		expect(wrapper.classes()).toContain('ant-btn-dangerous');
	});
	it('block', () => {
		const wrapper = mount(AppButton, {
			props: {
				block: true,
			},
		});
		expect(wrapper.classes()).toContain('ant-btn-block');
	});
	it('icon', () => {
		const wrapper = mount(AppButton, {
			slots: {
				icon: '<div class="button-icon" />',
			},
		});
		expect(wrapper.find('.button-icon').exists()).toBeTruthy();
	});
	it('text', () => {
		const wrapper = mount(AppButton, {
			slots: {
				default: '按钮',
			},
		});
		expect(wrapper.text()).toEqual('按钮');
	});
	it('handle click', async () => {
		const wrapper = mount(AppButton, {
			slots: {
				default: '按钮',
			},
		});
		await wrapper.trigger('click');
		expect(wrapper.emitted()).toBeDefined();
		expect(wrapper.emitted().click).toBeTruthy()
	});
	it('handle click inside', async () => {
		const wrapper = mount(AppButton, {
			slots: {
				default: '<span class="inner-slot"></span>',
			},
		});
		wrapper.find('.inner-slot').trigger('click');
		expect(wrapper.emitted()).toBeDefined();
	});
});