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

import { imageExportModule } from "../../modules/built-ins/image-export/image-export-module";
import { svgExportModule } from "../../modules/built-ins/svg-export/svg-export-module";
import { defineToolcraft } from "../../schema/define-toolcraft";
import { ToolcraftApp } from "./toolcraft-app";

afterEach(() => {
  cleanup();
  window.localStorage.clear();
});

describe("ToolcraftApp scene export boundary", () => {
  it("applies composition scene bounds to the live infinite product surface", () => {
    const schema = defineToolcraft({
      base: {
        identity: { id: "runtime-test", title: "Toolcraft App" },
        canvas: {
          enabled: true,
          size: { height: 180, unit: "px", width: 320 },
          sizing: { defaultMode: "infinite", mode: "editable-output" },
        },
        panels: {},
        persistence: { storage: "none" },
      },
      modules: [],
    });
    const { container } = render(
      <ToolcraftApp
        canvasContent={<div data-testid="product-scene" />}
        sceneBoundsProvider={() => [
          { height: 240, width: 400, x: -200, y: -120 },
        ]}
        schema={schema}
      />,
    );
    const productScene = container.querySelector<HTMLElement>(
      "[data-toolcraft-product-scene]",
    );

    expect(productScene?.style.height).toBe("240px");
    expect(productScene?.style.left).toBe("-200px");
    expect(productScene?.style.top).toBe("-120px");
    expect(productScene?.style.width).toBe("400px");
  });

  it("fails before mount when a typed product export has no shared renderer", () => {
    const schema = defineToolcraft({
      base: {
        identity: { id: "runtime-test", title: "Toolcraft App" },
        canvas: {
          enabled: true,
          size: { height: 180, unit: "px", width: 320 },
        },
        panels: { controls: { sections: [], title: "Controls" } },
      },
      modules: [imageExportModule()],
    });
    expect(() =>
      render(
        <ToolcraftApp
          canvasContent={<div data-testid="product-scene" />}
          schema={schema}
        />,
      ),
    ).toThrow(
      'Toolcraft integration port "scene.rasterFrameRenderer" is missing',
    );
  });

  it("requires typed SVG actions and SVG renderers to correspond", () => {
    const schema = defineToolcraft({
      base: {
        identity: { id: "runtime-test", title: "Toolcraft App" },
        canvas: { enabled: true },
        panels: { controls: { sections: [], title: "Controls" } },
        persistence: { storage: "none" },
      },
      modules: [svgExportModule()],
    });

    expect(() => render(<ToolcraftApp schema={schema} />)).toThrow(
      'Toolcraft integration port "scene.vectorFrameRenderer" is missing',
    );
    expect(() =>
      render(
        <ToolcraftApp
          schema={defineToolcraft({
            base: {
              identity: { id: "runtime-test", title: "Toolcraft App" },
              canvas: { enabled: true },
              panels: {},
              persistence: { storage: "none" },
            },
            modules: [],
          })}
          svgExportRenderer={{ baseFileName: "vector", renderFrame: () => {} }}
        />,
      ),
    ).toThrow(
      'Toolcraft integration port "scene.vectorFrameRenderer" is provided but unused; no resolved module consumes it.',
    );
  });
});