import { UCard } from './UCard'
import { describe, it, expect } from 'vitest'
import { mount } from '@vue/test-utils'

describe('UCard', () => {
  it('renders correctly', () => {
    const wrapper = mount(UCard)
    expect(wrapper.html()).toMatchSnapshot()
  })

  it('renders with the correct slot', () => {
    const wrapper = mount(UCard, {
      slots: {
        default: 'test',
      },
    })
    expect(wrapper.html()).toMatchSnapshot()
    expect(wrapper.text()).toBe('test')
  })

  it('renders with the correct color classes', () => {
    const wrapper = mount(UCard, {
      props: {
        color: 'gray-100',
      },
    })
    expect(wrapper.html()).toMatchSnapshot()
  })

  it('renders with the correct color classes', () => {
    const wrapper = mount(UCard, {
      props: {
        color: 'white',
      },
    })
    expect(wrapper.html()).toMatchSnapshot()
  })

  it('renders with the correct rounded classes', () => {
    const wrapper = mount(UCard, {
      props: {
        rounded: 'md',
      },
    })
    expect(wrapper.html()).toMatchSnapshot()
  })

  it('renders with the correct rounded classes', () => {
    const wrapper = mount(UCard, {
      props: {
        rounded: 'lg',
      },
    })
    expect(wrapper.html()).toMatchSnapshot()
  })

  it('renders with the correct shadow classes', () => {
    const wrapper = mount(UCard, {
      props: {
        shadow: 'sm',
      },
    })
    expect(wrapper.html()).toMatchSnapshot()
  })

  it('renders with the correct border classes', () => {
    const wrapper = mount(UCard, {
      props: {
        borderColor: 'gray-200',
      },
    })
    expect(wrapper.html()).toMatchSnapshot()
  })

  it('renders with the correct border classes', () => {
    const wrapper = mount(UCard, {
      props: {
        borderColor: 'error-300',
      },
    })
    expect(wrapper.html()).toMatchSnapshot()
  })
})