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

afterEach(cleanup);

describe('admin/system page', () => {
	it('renders the backfill versions card', async () => {
		render(AdminSystemPage, { props: {} });

		await expect
			.element(page.getByRole('heading', { name: /verlaufsdaten auffüllen/i }))
			.toBeVisible();
	});

	it('renders the backfill versions button enabled by default', async () => {
		render(AdminSystemPage, { props: {} });

		const btn = (await page
			.getByRole('button', { name: /jetzt auffüllen/i })
			.element()) as HTMLButtonElement;
		expect(btn.disabled).toBe(false);
	});

	it('renders the backfill file-hashes card', async () => {
		render(AdminSystemPage, { props: {} });

		await expect
			.element(page.getByRole('heading', { name: /datei-hashes berechnen/i }))
			.toBeVisible();
	});

	it('renders the backfill file-hashes button enabled by default', async () => {
		render(AdminSystemPage, { props: {} });

		const btn = (await page
			.getByRole('button', { name: /datei-hashes berechnen/i })
			.element()) as HTMLButtonElement;
		expect(btn.disabled).toBe(false);
	});

	it('does not render the backfill success banner before any action', async () => {
		render(AdminSystemPage, { props: {} });

		const banners = document.querySelectorAll('.bg-green-50');
		expect(banners.length).toBe(0);
	});
});