import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';

import { describe, expect, it } from 'vitest';

import { EasyFlowFormModal } from '..';

describe('easyFlowFormModal', () => {
  it('renders title, preview and body content when opened', async () => {
    const wrapper = mount(EasyFlowFormModal, {
      global: {
        stubs: {
          teleport: true,
        },
      },
      props: {
        cancelText: '取消',
        confirmText: '保存',
        description: '描述信息',
        open: true,
        showPreview: true,
        title: '测试弹窗',
      },
      slots: {
        default: '<div>表单内容</div>',
        preview: '<div>预览内容</div>',
      },
    });

    await nextTick();
    await nextTick();

    expect(wrapper.text()).toContain('测试弹窗');
    expect(wrapper.text()).toContain('描述信息');
    expect(wrapper.text()).toContain('预览内容');
    expect(wrapper.text()).toContain('表单内容');
  });

  it('emits confirm and cancel actions', async () => {
    const wrapper = mount(EasyFlowFormModal, {
      global: {
        stubs: {
          teleport: true,
        },
      },
      props: {
        cancelText: '取消',
        confirmText: '保存',
        description: '描述信息',
        open: true,
        title: '测试弹窗',
      },
      slots: {
        default: '<div>表单内容</div>',
      },
    });

    await nextTick();
    await nextTick();

    const buttons = wrapper.findAll('button');
    const cancelButton = buttons.find((button) => button.text() === '取消');
    const confirmButton = buttons.find((button) => button.text() === '保存');

    await cancelButton?.trigger('click');
    await confirmButton?.trigger('click');

    expect(wrapper.emitted('cancel')).toHaveLength(1);
    expect(wrapper.emitted('confirm')).toHaveLength(1);
    expect(wrapper.emitted('update:open')?.at(-1)).toEqual([false]);
  });
});
