import { env } from "@commontools/integration";
import { sleep } from "@commontools/utils/sleep";
import { ShellIntegration } from "@commontools/integration/shell-utils";
import { afterAll, beforeAll, describe, it } from "@std/testing/bdd";
import { join } from "@std/path";
import { assert } from "@std/assert";
import "../src/globals.ts";
import { Identity } from "@commontools/identity";
import { CharmsController } from "@commontools/charm/ops";
import { FileSystemProgramResolver } from "@commontools/js-compiler";

const { API_URL, SPACE_NAME, FRONTEND_URL } = env;

describe("shell charm tests", () => {
  const shell = new ShellIntegration();
  shell.bindLifecycle();

  let charmId: string;
  let identity: Identity;
  let cc: CharmsController;

  beforeAll(async () => {
    identity = await Identity.generate({ implementation: "noble" });
    cc = await CharmsController.initialize({
      spaceName: SPACE_NAME,
      apiUrl: new URL(API_URL),
      identity: identity,
    });
    const sourcePath = join(
      import.meta.dirname!,
      "..",
      "..",
      "patterns",
      "counter.tsx",
    );
    const program = await cc.manager().runtime.harness
      .resolve(
        new FileSystemProgramResolver(sourcePath),
      );
    const charm = await cc.create(
      program,
      { start: false },
    );
    charmId = charm.id;
  });

  afterAll(async () => {
    if (cc) await cc.dispose();
  });

  it("can view and interact with a charm", async () => {
    const page = shell.page();
    await shell.goto({
      frontendUrl: FRONTEND_URL,
      view: {
        spaceName: SPACE_NAME,
        charmId,
      },
      identity,
    });

    // Click twice
    for (let i = 0; i < 2; i++) {
      const handle = await page.waitForSelector(
        "#counter-decrement",
        { strategy: "pierce" },
      );
      // Wait for inner text. There's some
      // race here where we can click before the
      // box model is available.
      const _ = await handle.innerText();
      handle.click();
      await sleep(1000);
    }
    const handle = await page.waitForSelector(
      "#counter-result",
      { strategy: "pierce" },
    );
    await sleep(1500);
    const text = await handle.innerText();
    assert(text === "Counter is the -2th number");
  });
});