/* dialog.test.ts — 全局对话框服务与宿主组件闭环验证（Teleport 后从 document 查询） */
import { describe, it, expect } from 'vitest'
import { mount, flushPromises } from '@vue/test-utils'
import AppDialog from '../src/components/common/AppDialog.vue'
import { appAlert, appConfirm, appPrompt, dialogState, resolveDialog } from '../src/core/dialog'

/** 触发 body 上（Teleport）按钮点击 */
function clickBtn(idx: number) {
  const btns = document.body.querySelectorAll('.modal-actions button')
  ;(btns[idx] as HTMLElement).click()
}

describe('dialog 服务 + AppDialog 宿主', () => {
  it('appPrompt 打开对话框 → 输入值提交', async () => {
    const wrapper = mount(AppDialog, { attachTo: document.body })
    const p = appPrompt('生成整套', { placeholder: '主题' })
    await flushPromises()
    expect(dialogState.open.value).toBe(true)
    const input = document.body.querySelector('.modal-mask input') as HTMLInputElement
    expect(input).not.toBeNull()
    input.value = '远程办公'
    input.dispatchEvent(new Event('input'))
    await flushPromises()
    clickBtn(1) // 确定
    await expect(p).resolves.toBe('远程办公')
    expect(dialogState.open.value).toBe(false)
    wrapper.unmount()
  })

  it('appConfirm 取消 → false；确定 → true', async () => {
    const wrapper = mount(AppDialog, { attachTo: document.body })
    const p1 = appConfirm('删除？', '不可恢复', { danger: true })
    await flushPromises()
    clickBtn(0) // 取消
    await expect(p1).resolves.toBe(false)

    const p2 = appConfirm('删除？')
    await flushPromises()
    clickBtn(1) // 确定
    await expect(p2).resolves.toBe(true)
    wrapper.unmount()
  })

  it('appAlert 无输入框，单按钮关闭', async () => {
    const wrapper = mount(AppDialog, { attachTo: document.body })
    const p = appAlert('提示', '内容')
    await flushPromises()
    expect(document.body.querySelector('.modal-mask input')).toBeNull()
    expect(document.body.querySelectorAll('.modal-actions button').length).toBe(1)
    clickBtn(0)
    await expect(p).resolves.toEqual({ ok: true, value: '' })
    wrapper.unmount()
  })

  it('对话框 DOM 挂到 body（Teleport）且带 modal-mask/modal 类', async () => {
    const wrapper = mount(AppDialog, { attachTo: document.body })
    appAlert('标题')
    await flushPromises()
    const mask = document.body.querySelector('.modal-mask')
    expect(mask).not.toBeNull()
    expect(mask!.querySelector('.modal')).not.toBeNull()
    resolveDialog({ ok: true, value: '' })
    await flushPromises()
    wrapper.unmount()
  })
})