import { expect, test } from "@playwright/test";
import crypto from "node:crypto";
import fs from "node:fs";
import path from "node:path";

const fixture = path.resolve(import.meta.dirname, "../../../tests/files/web/modifier_grease_pencil_scene.blend");
const golden = JSON.parse(fs.readFileSync(path.resolve(import.meta.dirname, "../../../tests/golden/M9-08/grease-pencil-reorder.json"), "utf8"));

test("M9-08 reorders Grease Pencil layers and frames through Main undo, save and reopen", async ({ page }) => {
  test.setTimeout(120_000);
  expect(crypto.createHash("sha256").update(fs.readFileSync(fixture)).digest("hex")).toBe(golden.fixtureSha256);
  await page.goto("/");
  await expect(page.getByTestId("engine-status")).toContainText("ready, open a .blend file", { timeout: 20_000 });
  await page.getByTestId("blend-file-input").setInputFiles(fixture);
  await page.getByText("GreasePencilObject", { exact: true }).click();

  const app = page.locator(".blender-app");
  const editor = page.getByTestId("grease-pencil-editor");
  const revision = async () => Number(await app.getAttribute("data-current-main-revision"));
  await expect(editor).toHaveAttribute("data-layer-order", golden.source.layerOrder.join(","));
  await editor.getByLabel("Grease Pencil new layer name").fill("Web Drafts");
  await editor.getByRole("button", { name: "Add Layer" }).click();
  await expect(editor).toHaveAttribute("data-layer-order", golden.beforeReorder.layerOrder.join(","));
  await editor.getByLabel("Grease Pencil layer", { exact: true }).selectOption({ label: "Web Drafts" });
  await editor.getByRole("button", { name: "Add Frame" }).click();
  await expect(editor).toHaveAttribute("data-selected-layer-frames", "1");
  const drawingId = await editor.getAttribute("data-selected-layer-drawing-ids");
  expect(drawingId).toMatch(/^grease-pencil-drawing:GreasePencilData:\d+$/);

  const beforeLayerMove = await revision();
  await editor.getByRole("button", { name: "Move layer down" }).click();
  await expect(editor).toHaveAttribute("data-layer-order", golden.afterReorder.layerOrder.join(","));
  expect(await revision()).toBe(beforeLayerMove + 1);

  await page.getByRole("button", { name: "撤销" }).click();
  await expect(editor).toHaveAttribute("data-layer-order", golden.beforeReorder.layerOrder.join(","));
  await page.getByRole("button", { name: "重做" }).click();
  await expect(editor).toHaveAttribute("data-layer-order", golden.afterReorder.layerOrder.join(","));

  const beforeFrameMove = await revision();
  await editor.getByLabel("Grease Pencil target frame").fill("12");
  await editor.getByRole("button", { name: "Move Grease Pencil frame" }).click();
  await expect(editor).toHaveAttribute("data-selected-layer-frames", golden.afterReorder.framesByLayer["Web Drafts"].join(","));
  await expect(editor).toHaveAttribute("data-selected-layer-drawing-ids", drawingId!);
  expect(await revision()).toBe(beforeFrameMove + 1);

  await page.getByRole("button", { name: "撤销" }).click();
  await expect(editor).toHaveAttribute("data-selected-layer-frames", golden.beforeReorder.framesByLayer["Web Drafts"].join(","));
  await expect(editor).toHaveAttribute("data-selected-layer-drawing-ids", drawingId!);
  await page.getByRole("button", { name: "重做" }).click();
  await expect(editor).toHaveAttribute("data-selected-layer-frames", golden.afterReorder.framesByLayer["Web Drafts"].join(","));

  const download = page.waitForEvent("download");
  await page.getByRole("button", { name: "保存项目" }).click();
  await download;
  await expect(app).toHaveAttribute("data-dirty", "false");
  await page.getByRole("button", { name: "关闭项目" }).click();
  await expect(editor).toHaveCount(0);
  await page.getByRole("button", { name: "恢复项目" }).click();
  await page.getByText("GreasePencilObject", { exact: true }).click();
  await expect(editor).toHaveAttribute("data-layer-order", golden.reopened.layerOrder.join(","));
  await editor.getByLabel("Grease Pencil layer", { exact: true }).selectOption({ label: "Web Drafts" });
  await expect(editor).toHaveAttribute("data-selected-layer-frames", golden.reopened.framesByLayer["Web Drafts"].join(","));
  await expect(editor).toHaveAttribute("data-selected-layer-drawing-ids", drawingId!);
});