import { test, expect } from '@playwright/test';
import { signUp, waitForMap } from '../support/app.js';

// e2e/seed.js puts this one in activefires. Visiting an active fire archives it
// and canonicalizes the URL to /fire/archive/<other id>, which is itself worth
// pinning: it is the link every notification and every tweet points at.
const SEEDED_FIRE = '/fire/active/e2e0000000000000000000a1';

test.describe('detalle de un fuego y comentarios', () => {
  test('a seeded fire opens, keeps its map and canonicalizes its URL', async ({ page }) => {
    await page.goto(SEEDED_FIRE);
    await expect(page.getByText(/Información adicional sobre fuego detectado/)).toBeVisible();
    await expect(page).toHaveURL(/\/fire\/archive\/[0-9a-f]{24}$/);
    await waitForMap(page);
    await expect(page.getByText('Coordenadas: 40.41, -3.7')).toBeVisible();
  });

  test('a signed-in user can comment on a fire and sees it appear', async ({ page }) => {
    await signUp(page);
    await page.goto(SEEDED_FIRE);
    await expect(page.getByText('Comentarios')).toBeVisible();

    const comment = `Ardió el pinar de la ladera norte ${Date.now()}`;
    await page.locator('textarea.create-comment').fill(comment);
    await page.getByRole('button', { name: 'Añadir comentario' }).click();

    await expect(page.getByText(comment)).toBeVisible({ timeout: 30000 });

    // And it is really stored, not just echoed into the DOM.
    await page.reload();
    await expect(page.getByText(comment)).toBeVisible({ timeout: 30000 });
  });

  test('an anonymous visitor is asked to sign in instead of getting a comment box', async ({ page }) => {
    await page.goto(SEEDED_FIRE);
    await expect(page.getByRole('heading', { name: 'Comentarios' })).toBeVisible();
    await expect(page.getByText('Necesitas iniciar sesión para añadir comentarios')).toBeVisible();
    await expect(page.locator('textarea.create-comment')).toHaveCount(0);
  });
});