// @vitest-environment jsdom

import { render, screen } from "@testing-library/react";
import { describe, expect, it } from "vitest";

import {
  CollectionPage,
  DetailPage,
  FormPage,
  StandardPage,
  StatusPage,
} from "../../src/presentation/templates/index.ts";

describe("page template slot contracts", () => {
  it("renders StandardPage minimum and full landmarks with one h1", () => {
    const { rerender } = render(
      <StandardPage heading={{ title: "Minimum" }}>Content</StandardPage>,
    );
    expect(screen.getByRole("heading", { level: 1, name: "Minimum" })).toBeVisible();

    rerender(
      <StandardPage
        heading={{ title: "Full", description: "Long heading contract" }}
        breadcrumb={<a href="/">Home</a>}
        status={<span>Ready</span>}
        actions={[
          { kind: "button", label: "Action", onAction: () => {} },
        ]}
        notices={<p>Notice</p>}
        feedback={<p role="status">Refreshing</p>}
        aside={<p>Aside</p>}
      >
        Content
      </StandardPage>,
    );
    expect(screen.getAllByRole("heading", { level: 1 })).toHaveLength(1);
    expect(screen.getByRole("navigation", { name: "현재 위치" })).toBeVisible();
    expect(screen.getByRole("complementary", { name: "관련 정보" })).toBeVisible();
  });

  it("places collection, detail and form state in stable slots", () => {
    const { rerender } = render(
      <CollectionPage
        heading={{ title: "Collection" }}
        toolbar={<button type="button">Filter</button>}
        resultCount="12 results"
        pagination={<a href="?page=2">Next</a>}
      >
        Results
      </CollectionPage>,
    );
    expect(screen.getByRole("region", { name: "검색과 필터" })).toBeVisible();
    expect(screen.getByRole("navigation", { name: "페이지 탐색" })).toBeVisible();

    rerender(
      <DetailPage
        heading={{ title: "Detail" }}
        metadata={<dl><dt>ID</dt><dd>1</dd></dl>}
        destructiveAction={<button type="button">Delete</button>}
      >
        Sections
      </DetailPage>,
    );
    expect(screen.getByRole("region", { name: "요약 정보" })).toBeVisible();
    expect(screen.getByRole("region", { name: "위험 작업" })).toBeVisible();

    rerender(
      <FormPage
        heading={{ title: "Form" }}
        errorSummary={<p role="alert">Invalid</p>}
        fields={<input aria-label="Field" />}
        formActions={<button type="button">Save</button>}
      />,
    );
    expect(screen.getByRole("alert")).toBeVisible();
    expect(screen.getByRole("textbox", { name: "Field" })).toBeVisible();
  });

  it("renders safe status variants without raw failure values", () => {
    render(
      <StatusPage
        variant="offline"
        heading={{ title: "Offline", description: "Safe recovery copy" }}
        primaryAction={{ kind: "button", label: "Retry", onAction: () => {} }}
        supportReference="SAFE-123"
      />,
    );
    expect(screen.getByRole("heading", { level: 1, name: "Offline" })).toBeVisible();
    expect(screen.getByText(/SAFE-123/)).toBeVisible();
    expect(document.body).not.toHaveTextContent("stack");
  });
});