import { describe, it, expect } from 'vitest';
import { render, fireEvent } from '@testing-library/svelte';
import Pagination from './Pagination.svelte';
import { tick } from 'svelte';
describe('m-pagination component', () => {
    const baseProps = {
        id: 'test-pagination',
        value: 1,
        total: 5,
        selectLabel: 'Page selector',
        prefixlabel: 'Page ',
        pagelabel: ' of ',
    };
    it('renders with correct initial state', () => {
        const { container, getByLabelText } = render(Pagination, {
            props: baseProps,
        });
        const select = getByLabelText(baseProps.selectLabel);
        expect(select.value).toBe('1');
        const prevBtn = container.querySelector('button[aria-label="Previous page"]');
        const nextBtn = container.querySelector('button[aria-label="Next page"]');
        expect(prevBtn).toBeDisabled();
        expect(nextBtn).not.toBeDisabled();
    });
    it('updates value when select changes', async () => {
        const { getByLabelText } = render(Pagination, {
            props: baseProps,
        });
        const select = getByLabelText(baseProps.selectLabel);
        await fireEvent.change(select, { target: { value: '3' } });
        await tick();
        expect(select.value).toBe('3');
    });
    it('previous and next buttons navigate pages correctly', async () => {
        const { container, getByLabelText } = render(Pagination, {
            props: baseProps,
        });
        const prevBtn = container.querySelector('button[aria-label="Previous page"]');
        const nextBtn = container.querySelector('button[aria-label="Next page"]');
        const select = getByLabelText(baseProps.selectLabel);
        expect(prevBtn.disabled).toBe(true);
        await fireEvent.click(nextBtn);
        await tick();
        expect(select.value).toBe('2');
        expect(prevBtn.disabled).toBe(false);
        await fireEvent.click(prevBtn);
        await tick();
        expect(select.value).toBe('1');
        expect(prevBtn.disabled).toBe(true);
    });
    it('disables next button on last page', async () => {
        const props = { ...baseProps, value: 5, total: 5 };
        const { container } = render(Pagination, { props });
        const nextBtn = container.querySelector('button[aria-label="Next page"]');
        expect(nextBtn.disabled).toBe(true);
        const prevBtn = container.querySelector('button[aria-label="Previous page"]');
        expect(prevBtn.disabled).toBe(false);
    });
    it('renders compact version correctly', () => {
        const props = { ...baseProps, compact: true };
        const { container, getByText } = render(Pagination, { props });
        expect(container.querySelector('select')).toBeNull();
        expect(getByText(/Page 1 of 5/)).toBeTruthy();
    });
});
