import { render, fireEvent } from '@testing-library/svelte';
import { describe, it, expect, vi } from 'vitest';
import ActionListboxItem from './ActionListboxItem.svelte';
describe('ActionListboxItem', () => {
    it('renders the provided label', () => {
        const { getByText } = render(ActionListboxItem, { props: { label: 'Edit item' } });
        expect(getByText('Edit item')).toBeTruthy();
    });
    it('adds danger class when appearance="danger"', () => {
        const { container } = render(ActionListboxItem, {
            props: { label: 'Delete', appearance: 'danger' },
        });
        expect(container.querySelector('.mc-action-list__element--danger')).toBeTruthy();
    });
    it('adds disabled class when disabled is true', () => {
        const { container } = render(ActionListboxItem, {
            props: { label: 'Disabled', disabled: true },
        });
        expect(container.querySelector('.mc-action-list__element--disabled')).toBeTruthy();
    });
    it('renders a divider when divider is true', () => {
        const { container } = render(ActionListboxItem, {
            props: { label: 'With divider', divider: true },
        });
        expect(container.querySelector('.mc-action-list__divider')).toBeTruthy();
    });
    it('calls onclick handler when the button is clicked', async () => {
        const handle = vi.fn();
        const { getByRole } = render(ActionListboxItem, {
            props: { label: 'Click me', onclick: handle },
        });
        const li = getByRole('menuitem');
        const btn = li.querySelector('button');
        await fireEvent.click(btn);
        expect(handle).toHaveBeenCalled();
    });
});
