import { test, expect } from '@playwright/test';

test.describe('Page département', () => {
  test('/departement/75 (Paris) — métropole', async ({ page }) => {
    await page.goto('/departement/75');
    await expect(page.getByRole('heading', { name: 'Paris', exact: true })).toBeVisible();
    // Graph interactif avec onglets période
    await expect(page.getByRole('tab', { name: '7 jours' })).toBeVisible();
    await expect(page.getByRole('tab', { name: '30 jours' })).toBeVisible();
  });

  test('Tabs période changent activeselected', async ({ page }) => {
    await page.goto('/departement/75');
    const tab7 = page.getByRole('tab', { name: '7 jours' });
    const tab30 = page.getByRole('tab', { name: '30 jours' });
    await tab30.click();
    await expect(tab30).toHaveAttribute('aria-selected', 'true');
    await expect(tab7).toHaveAttribute('aria-selected', 'false');
  });

  test('/departement/971 (Guadeloupe) — DROM affiche notice', async ({ page }) => {
    await page.goto('/departement/971');
    await expect(page.getByRole('heading', { name: 'Guadeloupe' })).toBeVisible();
    await expect(page.getByText(/Vigilance Outre-mer non couverte/i)).toBeVisible();
  });

  test('Page dept invalide retourne 404', async ({ page }) => {
    const res = await page.goto('/departement/999');
    expect(res?.status()).toBe(404);
  });
});