import { describe, it, expect } from 'vitest';
import { render } from '@testing-library/svelte';
import StatusDot from './StatusDot.svelte';
describe('m-status-dot component', () => {
    it('renders with default props', () => {
        const { container } = render(StatusDot);
        const dot = container.querySelector('.mc-status-dot');
        expect(dot).toBeTruthy();
        expect(dot?.classList.contains('mc-status-dot--m')).toBe(true);
        expect(dot?.classList.contains('mc-status-dot--info')).toBe(true);
    });
    it('applies correct size class', () => {
        const sizes = ['s', 'm', 'l'];
        sizes.forEach((size) => {
            const { container } = render(StatusDot, { props: { size } });
            const dot = container.querySelector('.mc-status-dot');
            expect(dot?.classList.contains(`mc-status-dot--${size}`)).toBe(true);
        });
    });
    it('applies correct status class', () => {
        const statuses = ['info', 'success', 'warning', 'error', 'neutral'];
        statuses.forEach((status) => {
            const { container } = render(StatusDot, { props: { status } });
            const dot = container.querySelector('.mc-status-dot');
            expect(dot?.classList.contains(`mc-status-dot--${status}`)).toBe(true);
        });
    });
    it('applies both size and status classes correctly', () => {
        const { container } = render(StatusDot, {
            props: { size: 'l', status: 'error' },
        });
        const dot = container.querySelector('.mc-status-dot');
        expect(dot?.classList.contains('mc-status-dot--l')).toBe(true);
        expect(dot?.classList.contains('mc-status-dot--error')).toBe(true);
    });
});
