import { flushPromises, mount } from '@vue/test-utils'
import { createMemoryHistory, createRouter } from 'vue-router'
import { describe, expect, it } from 'vitest'

import { routes } from '@/router'

import AppNav from './AppNav.vue'

async function setup(initialPath = '/') {
  const router = createRouter({ history: createMemoryHistory(), routes })
  await router.push(initialPath)
  await router.isReady()

  const wrapper = mount(AppNav, { global: { plugins: [router] }, attachTo: document.body })
  return { wrapper, router }
}

describe('AppNav', () => {
  it('渲染看板与今日两个入口', () => {
    return setup().then(({ wrapper }) => {
      expect(wrapper.findAll('a').map((node) => node.text())).toEqual(['看板', '今日'])
    })
  })

  it('当前路由的入口标记 aria-current', async () => {
    const { wrapper } = await setup('/')
    const links = wrapper.findAll('a')

    expect(links[0]?.attributes('aria-current')).toBe('page')
    expect(links[1]?.attributes('aria-current')).toBeUndefined()
  })

  it('在今日页时高亮今日入口', async () => {
    const { wrapper } = await setup('/today')
    const links = wrapper.findAll('a')

    expect(links[0]?.attributes('aria-current')).toBeUndefined()
    expect(links[1]?.attributes('aria-current')).toBe('page')
  })

  it('点击可切换路由', async () => {
    const { wrapper, router } = await setup('/')

    await wrapper.findAll('a')[1]?.trigger('click')
    // 路由跳转是异步的，必须等 Promise 落地
    await flushPromises()

    expect(router.currentRoute.value.path).toBe('/today')
  })

  it('导航带可访问性标签', async () => {
    const { wrapper } = await setup()
    expect(wrapper.find('nav').attributes('aria-label')).toBe('主导航')
  })
})