import { describe, it, expect, afterEach, vi } from 'vitest';
import { cleanup, render } from 'vitest-browser-svelte';
import { page } from 'vitest/browser';
import BackButton from './BackButton.svelte';

afterEach(cleanup);

describe('BackButton', () => {
	it('renders a button with "Zurück" text', async () => {
		render(BackButton);
		await expect.element(page.getByRole('button', { name: /zurück/i })).toBeInTheDocument();
	});

	it('calls history.back() when clicked', async () => {
		const backSpy = vi.spyOn(history, 'back').mockImplementation(() => {});
		render(BackButton);

		await page.getByRole('button', { name: /zurück/i }).click();

		expect(backSpy).toHaveBeenCalledOnce();
		backSpy.mockRestore();
	});

	it('applies mb-4 by default', async () => {
		render(BackButton);
		const btn = document.querySelector('button');
		expect(btn?.className).toContain('mb-4');
	});

	it('applies custom class prop instead of default', async () => {
		render(BackButton, { props: { class: 'mr-3 md:hidden' } });
		const btn = document.querySelector('button');
		expect(btn?.className).toContain('mr-3');
		expect(btn?.className).not.toContain('mb-4');
	});

	it('hides label text and sets aria-label when showLabel is false', async () => {
		render(BackButton, { props: { showLabel: false } });
		const btn = document.querySelector('button');
		expect(btn?.textContent?.trim()).toBe('');
		expect(btn?.getAttribute('aria-label')).toMatch(/zurück/i);
	});
});