import { describe, expect, it } from 'vitest'
import { mountSuspended } from '@nuxt/test-utils/runtime'
import PaginationNav from '~/components/PaginationNav.vue'

describe('PaginationNav', () => {
  it('renders nothing when there is only one page', async () => {
    const wrapper = await mountSuspended(PaginationNav, { props: { page: 1, pageCount: 1, locale: 'it' } })
    expect(wrapper.find('nav').exists()).toBe(false)
  })

  it('marks only the current page as aria-current, others as plain links', async () => {
    const wrapper = await mountSuspended(PaginationNav, { props: { page: 4, pageCount: 7, locale: 'it' } })
    const current = wrapper.find('.pagination-link.is-current')
    expect(current.text()).toBe('4')
    expect(current.attributes('aria-current')).toBe('page')

    const links = wrapper.findAll('a.pagination-link')
    expect(links.map((l) => l.text())).toEqual(['1', '2', '3', '5', '6', '7'])
    for (const link of links) {
      expect(link.attributes('aria-current')).toBeUndefined()
    }
  })

  it('collapses far-away pages into an ellipsis', async () => {
    const wrapper = await mountSuspended(PaginationNav, { props: { page: 1, pageCount: 20, locale: 'it' } })
    expect(wrapper.find('.pagination-ellipsis').exists()).toBe(true)
    expect(wrapper.findAll('a.pagination-link').length).toBeLessThan(20)
  })

  it('disables the previous arrow on the first page and the next arrow on the last', async () => {
    const first = await mountSuspended(PaginationNav, { props: { page: 1, pageCount: 5, locale: 'it' } })
    expect(first.find('a.pagination-arrow[rel="prev"]').exists()).toBe(false)
    expect(first.find('a.pagination-arrow[rel="next"]').exists()).toBe(true)

    const last = await mountSuspended(PaginationNav, { props: { page: 5, pageCount: 5, locale: 'it' } })
    expect(last.find('a.pagination-arrow[rel="next"]').exists()).toBe(false)
    expect(last.find('a.pagination-arrow[rel="prev"]').exists()).toBe(true)
  })
})