import { describe, it, expect } from 'vitest';
import { render } from '@testing-library/svelte';
import LoadingOverlay from './LoadingOverlay.svelte';
describe('m-loading-overlay component', () => {
    it('does not have visible class by default', () => {
        const { container } = render(LoadingOverlay);
        const overlay = container.querySelector('.mc-loading-loader');
        expect(overlay).toBeTruthy();
        expect(overlay?.classList).not.toContain('is-visible');
    });
    it('adds visible class when isvisible is true', () => {
        const { container } = render(LoadingOverlay, {
            props: { isvisible: true },
        });
        const overlay = container.querySelector('.mc-loading-loader');
        expect(overlay?.classList).toContain('is-visible');
    });
    it('renders with provided text and sets aria-label', () => {
        const text = 'Loading data...';
        const { container, getByRole } = render(LoadingOverlay, {
            props: { isvisible: true, text },
        });
        const dialog = getByRole('dialog');
        expect(dialog).toBeTruthy();
        expect(dialog.getAttribute('aria-label')).toBe(text);
        const loader = container.querySelector('.mc-loader');
        expect(loader).toBeTruthy();
        const loaderText = container.querySelector('.mc-loader__text');
        expect(loaderText?.textContent).toBe(text);
    });
    it('does not render aria-label when no text is provided', () => {
        const { getByRole } = render(LoadingOverlay, {
            props: { isvisible: true },
        });
        const dialog = getByRole('dialog');
        expect(dialog.getAttribute('aria-label')).toBe(null);
    });
});
