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

describe('EmptyState', () => {
  it('renders action through BaseButton and emits action clicks', async () => {
    const wrapper = mount(EmptyState, {
      props: {
        title: 'No experiments',
        actionLabel: 'Create experiment',
      },
    })

    const button = wrapper.find('.mint-button')
    expect(button.exists()).toBe(true)
    expect(button.classes()).toContain('mint-button--secondary')
    expect(button.text()).toBe('Create experiment')

    await button.trigger('click')

    expect(wrapper.emitted('action')).toHaveLength(1)
  })

  it('should wrap default-slot content in the spaced content block', () => {
    const wrapper = mount(EmptyState, {
      props: { title: 'No instruments yet', description: 'Add the lab systems.' },
      slots: { default: '<button class="slot-action">New instrument</button>' },
    })

    expect(wrapper.find('.mint-empty-state__content .slot-action').exists()).toBe(true)
  })

  it('should not render the content block without default-slot content', () => {
    const wrapper = mount(EmptyState, { props: { title: 'Empty' } })

    expect(wrapper.find('.mint-empty-state__content').exists()).toBe(false)
  })
})