import { readFileSync } from "node:fs";
import { fileURLToPath } from "node:url";

import { describe, expect, it } from "vitest";

const styles = read("../app/globals.css");
const workspaceSource = read("../components/seedream-workspace.tsx");

function read(relativePath: string): string {
  return readFileSync(fileURLToPath(new URL(relativePath, import.meta.url)), "utf8").replace(/\r\n/g, "\n");
}

function cssRule(selector: string): string {
  const escapedSelector = selector.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
  const match = styles.match(new RegExp(`${escapedSelector}\\s*\\{([^}]*)\\}`));
  if (!match) throw new Error(`CSS rule not found: ${selector}`);
  return match[1];
}

describe("Seedream workspace layout contract", () => {
  it("keeps vertical scrolling on the workspace instead of nesting it inside the canvas", () => {
    const workspace = cssRule(".seedream-workspace");
    const viewport = cssRule(".seedream-canvas-viewport");

    expect(workspace).toMatch(/overflow-x\s*:\s*hidden/);
    expect(workspace).toMatch(/overflow-y\s*:\s*auto/);
    expect(workspace).not.toMatch(/overflow\s*:\s*auto/);
    expect(viewport).toMatch(/overflow\s*:\s*hidden/);
    expect(viewport).not.toMatch(/overflow\s*:\s*(?:auto|scroll)/);
  });

  it("caps the annotation canvas without making it consume the remaining column height", () => {
    const viewport = cssRule(".seedream-canvas-viewport");
    const image = cssRule(".seedream-canvas-stage > img");

    expect(viewport).toMatch(/--seedream-canvas-height\s*:\s*clamp\(280px,\s*38vh,\s*460px\)/);
    expect(viewport).toMatch(/height\s*:\s*var\(--seedream-canvas-height\)/);
    expect(viewport).toMatch(/flex\s*:\s*0\s+0\s+auto/);
    expect(image).toMatch(/max-height\s*:\s*calc\(var\(--seedream-canvas-height\)\s*-\s*22px\)/);
  });

  it("does not render the redundant source picker for single-image layer decomposition", () => {
    expect(workspaceSource).toMatch(/\{mode === "interactive" && sources\.length \? \(\s*<div className="seedream-source-picker">/);
  });
});