import { describe, it, expect, afterEach, vi } from 'vitest'
import { mount } from '@vue/test-utils'
import { readFileSync } from 'node:fs'
import { resolve } from 'node:path'
import DcsCallButton from './DcsCallButton.vue'

/**
 * Raw SFC source, used by the touch-target tests below.
 *
 * SCOPE LIMIT (stated deliberately): `mount()` does not apply an SFC's scoped
 * `<style>` — jsdom never lays the component out — so these assertions prove
 * the 44 px rule is DECLARED, not that a browser renders 44 px. They exist to
 * stop the floor being silently deleted again; the rendered-height proof is a
 * live `getBoundingClientRect()` measurement against a deployed site.
 */
const sfcSource = readFileSync(
  // vitest runs with cwd = the package root; `import.meta.url` is not a file:
  // URL under the jsdom environment, so resolve from cwd instead.
  resolve(process.cwd(), 'src/components/DcsCallButton.vue'),
  'utf8'
)

/**
 * `useTextContent` reads the build-time `__DCS_CONTENT__` global synchronously
 * at setup. Stub it to simulate `.dcs/content.yaml` `global` overrides; pass
 * `null` to simulate a site with no injected content at all (the SSR default).
 */
function stubContent(global: Record<string, string> | null): void {
  if (global === null) {
    vi.stubGlobal('__DCS_CONTENT__', undefined)
    return
  }
  vi.stubGlobal('__DCS_CONTENT__', {
    version: 1,
    lastUpdated: '',
    updatedBy: 'test',
    global,
  })
}

afterEach(() => {
  vi.unstubAllGlobals()
})

describe('DcsCallButton', () => {
  it('renders a tel: link with the managed number when business.phone is set', () => {
    stubContent({ 'business.phone': '(248) 385-2926', 'business.name': 'Iron Oak' })

    const wrapper = mount(DcsCallButton, { props: { variant: 'inline' } })
    const link = wrapper.find('a')

    expect(link.exists()).toBe(true)
    expect(link.attributes('href')).toBe('tel:2483852926')
    expect(link.text()).toContain('(248) 385-2926')
    expect(link.attributes('aria-label')).toBe('Call Iron Oak at (248) 385-2926')
    // The visible number is editor-discoverable via the managed content key.
    expect(link.find('[data-dcs-text="business.phone"]').exists()).toBe(true)
  })

  it('renders nothing when the business.phone key is absent', () => {
    stubContent({ 'business.name': 'Iron Oak' })

    const wrapper = mount(DcsCallButton)

    expect(wrapper.find('a').exists()).toBe(false)
    expect(wrapper.text()).toBe('')
  })

  it('renders nothing when business.phone is present but blank', () => {
    stubContent({ 'business.phone': '   ' })

    const wrapper = mount(DcsCallButton)

    expect(wrapper.find('a').exists()).toBe(false)
  })

  it('renders nothing when no managed content is injected at all (SSR default)', () => {
    stubContent(null)

    const wrapper = mount(DcsCallButton)

    // No fabricated fallback number — the A-34 SSR-fabrication class must be
    // impossible by construction.
    expect(wrapper.find('a').exists()).toBe(false)
  })

  it('normalizes a US-formatted number to a digits-only tel: href', () => {
    stubContent({ 'business.phone': '(248) 385-2926' })

    const wrapper = mount(DcsCallButton)

    expect(wrapper.find('a').attributes('href')).toBe('tel:2483852926')
  })

  it('preserves a single leading + for E.164 international numbers', () => {
    stubContent({ 'business.phone': '+1 (248) 385-2926' })

    const wrapper = mount(DcsCallButton)

    expect(wrapper.find('a').attributes('href')).toBe('tel:+12483852926')
  })

  it('strips dots and spaces from the tel: href', () => {
    stubContent({ 'business.phone': '248.385.2926' })

    const wrapper = mount(DcsCallButton)

    expect(wrapper.find('a').attributes('href')).toBe('tel:2483852926')
  })

  it('icon variant hides the visible number but keeps an accessible label', () => {
    stubContent({ 'business.phone': '(248) 385-2926', 'business.name': 'Iron Oak' })

    const wrapper = mount(DcsCallButton, { props: { variant: 'icon' } })
    const link = wrapper.find('a')

    expect(link.exists()).toBe(true)
    // No visible number text — it's icon-only.
    expect(link.text()).toBe('')
    expect(link.find('svg').exists()).toBe(true)
    expect(link.attributes('aria-label')).toBe('Call Iron Oak at (248) 385-2926')
    expect(link.attributes('title')).toBe('Call Iron Oak at (248) 385-2926')
  })

  it('falls back to "Call {number}" when no business name is available', () => {
    stubContent({ 'business.phone': '(248) 385-2926' })

    const wrapper = mount(DcsCallButton, { props: { variant: 'icon' } })

    expect(wrapper.find('a').attributes('aria-label')).toBe('Call (248) 385-2926')
  })

  it('prefers an explicit businessName prop over managed business.name', () => {
    stubContent({ 'business.phone': '(248) 385-2926', 'business.name': 'Managed Name' })

    const wrapper = mount(DcsCallButton, {
      props: { variant: 'icon', businessName: 'Explicit Name' },
    })

    expect(wrapper.find('a').attributes('aria-label')).toBe(
      'Call Explicit Name at (248) 385-2926'
    )
  })

  // -------------------------------------------------------------------------
  // C-321 — WCAG 2.5.5 / 2.5.8 minimum touch target on BOTH variants.
  //
  // Regression guard: the floor used to live only on `--icon`, which left the
  // DEFAULT `inline` variant (hero / nav tap-to-call — the primary mobile
  // conversion on a service-business site) at its line-box height.
  // -------------------------------------------------------------------------
  describe('touch target', () => {
    it('declares the 44px floor on the BASE class, so it applies to every variant', () => {
      const base = sfcSource.match(/\.dcs-call-button\s*\{[^}]*\}/)
      expect(base, 'base .dcs-call-button rule must exist').not.toBeNull()
      expect(base![0]).toMatch(/min-height:\s*var\(--dcs-call-min-target,\s*2\.75rem\)/)
    })

    it('keeps the icon variant square by pinning min-width to the same token', () => {
      const icon = sfcSource.match(/\.dcs-call-button--icon\s*\{[^}]*\}/)
      expect(icon, '.dcs-call-button--icon rule must exist').not.toBeNull()
      expect(icon![0]).toMatch(/min-width:\s*var\(--dcs-call-min-target,\s*2\.75rem\)/)
    })

    it('gives the inline variant real hit area on its long axis too', () => {
      const inline = sfcSource.match(/\.dcs-call-button--inline\s*\{[^}]*\}/)
      expect(inline, '.dcs-call-button--inline rule must exist').not.toBeNull()
      // Padding must not be the old flat `0` — that is what produced a 24px tall
      // target on the flagship real-estate site.
      expect(inline![0]).not.toMatch(/padding:\s*var\(--dcs-call-inline-padding,\s*0\)/)
      expect(inline![0]).toMatch(/padding:/)
    })

    it('never lets a variant override the floor below 44px', () => {
      // Any `min-height` declaration in the stylesheet must resolve to >= 2.75rem.
      const declared = [...sfcSource.matchAll(/min-height:\s*([^;]+);/g)].map((m) => m[1]!.trim())
      expect(declared.length).toBeGreaterThan(0)
      for (const value of declared) {
        const rem = Number(value.match(/(\d+(?:\.\d+)?)rem/)?.[1] ?? '0')
        expect(rem, `min-height "${value}" must be >= 2.75rem`).toBeGreaterThanOrEqual(2.75)
      }
    })
  })
})