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

describe('VTabList.vue', () => {
  it('renders default slot content', () => {
    const slotContent = '<button>Tab 1</button><button>Tab 2</button>';
    const wrapper = mount(VTabList, {
      slots: { default: slotContent },
    });
    expect(wrapper.html()).toContain(slotContent);
  });

  it('has role="tablist" and class .tab-list', () => {
    const wrapper = mount(VTabList);
    expect(wrapper.attributes('role')).toBe('tablist');
    expect(wrapper.classes()).toContain('tab-list');
  });
});

describe('VTabPanels.vue', () => {
  it('renders default slot content', () => {
    const slotContent = '<div>Panel 1 Content</div><div>Panel 2 Content</div>';
    const wrapper = mount(VTabPanels, {
      slots: { default: slotContent },
    });
    expect(wrapper.html()).toContain(slotContent);
  });

  it('has class .tab-panels-container', () => {
    const wrapper = mount(VTabPanels);
    expect(wrapper.classes()).toContain('tab-panels-container');
  });
});
