import { describe, it, expect } from 'vitest'
import { mount } from '@vue/test-utils'
import { Card } from '../src/index.js'

describe('Card', () => {
  it('renders default slot and is padded by default', () => {
    const w = mount(Card, { slots: { default: 'Drama synopsis' } })
    expect(w.text()).toContain('Drama synopsis')
    expect(w.classes()).toContain('is-padded')
    expect(w.classes()).not.toContain('is-interactive')
  })

  it('renders header and footer slots when provided', () => {
    const w = mount(Card, {
      slots: { default: 'body', header: 'Cast', footer: 'Up next' },
    })
    expect(w.find('.drama-card__header').text()).toBe('Cast')
    expect(w.find('.drama-card__footer').text()).toBe('Up next')
  })

  it('omits header/footer when no slot', () => {
    const w = mount(Card, { slots: { default: 'body' } })
    expect(w.find('.drama-card__header').exists()).toBe(false)
    expect(w.find('.drama-card__footer').exists()).toBe(false)
  })

  it('applies interactive class and drops padding when configured', () => {
    const w = mount(Card, { props: { interactive: true, padded: false } })
    expect(w.classes()).toContain('is-interactive')
    expect(w.classes()).not.toContain('is-padded')
  })
})