import { writeFileSync } from "node:fs";

const cdpPort = process.env.CDP_PORT ?? "9224";
const baseUrl = process.env.SITE_URL ?? "http://127.0.0.1:4323";
const pages = await fetch(`http://127.0.0.1:${cdpPort}/json/list`).then((response) => response.json());
const page = pages.find((entry) => entry.type === "page");
if (!page) throw new Error(`CDP ${cdpPort} 没有可用页面`);

const socket = new WebSocket(page.webSocketDebuggerUrl);
await new Promise((resolve, reject) => {
  socket.addEventListener("open", resolve, { once: true });
  socket.addEventListener("error", reject, { once: true });
});

let nextId = 0;
const pending = new Map();
const exceptions = [];
socket.addEventListener("message", (event) => {
  const message = JSON.parse(event.data);
  if (message.id && pending.has(message.id)) {
    const { resolve, reject } = pending.get(message.id);
    pending.delete(message.id);
    if (message.error) reject(new Error(message.error.message));
    else resolve(message.result);
  }
  if (message.method === "Runtime.exceptionThrown") {
    exceptions.push(message.params.exceptionDetails.text);
  }
});

const command = (method, params = {}) => new Promise((resolve, reject) => {
  const id = ++nextId;
  pending.set(id, { resolve, reject });
  socket.send(JSON.stringify({ id, method, params }));
});
const pause = (milliseconds) => new Promise((resolve) => setTimeout(resolve, milliseconds));
const evaluate = async (expression) => {
  const result = await command("Runtime.evaluate", {
    expression,
    returnByValue: true,
    awaitPromise: true,
  });
  if (result.exceptionDetails) throw new Error(result.exceptionDetails.text);
  return result.result.value;
};
const navigate = async (path) => {
  await command("Page.navigate", { url: `${baseUrl}${path}` });
  for (let attempt = 0; attempt < 40; attempt += 1) {
    await pause(100);
    if (await evaluate("document.readyState === 'complete'")) return;
  }
  throw new Error(`${path} 加载超时`);
};
const screenshot = async (path, full = false) => {
  const params = { format: "png", captureBeyondViewport: full };
  if (full) {
    const metrics = await command("Page.getLayoutMetrics");
    params.clip = {
      x: 0,
      y: 0,
      width: metrics.cssContentSize.width,
      height: metrics.cssContentSize.height,
      scale: 1,
    };
  }
  const result = await command("Page.captureScreenshot", params);
  writeFileSync(path, Buffer.from(result.data, "base64"));
};

await command("Page.enable");
await command("Runtime.enable");
await command("Emulation.setDeviceMetricsOverride", {
  width: 1440,
  height: 1100,
  deviceScaleFactor: 1,
  mobile: false,
});
await navigate("/reasoning/");
await screenshot("/tmp/llm-atlas-reasoning-desktop.png");

const budget = await evaluate(`(() => {
  const root = document.querySelector("[data-reasoning-lab]");
  const correlation = root.querySelector("[data-correlation]");
  correlation.value = "0";
  correlation.dispatchEvent(new Event("input", { bubbles: true }));
  const independent = {
    coverage: root.querySelector("[data-metric-coverage]").textContent,
    effective: root.querySelector("[data-effective]").textContent,
  };
  correlation.value = "95";
  correlation.dispatchEvent(new Event("input", { bubbles: true }));
  const correlated = {
    coverage: root.querySelector("[data-metric-coverage]").textContent,
    effective: root.querySelector("[data-effective]").textContent,
  };
  root.querySelector('[data-budget-preset="agent"]').click();
  return {
    independent,
    correlated,
    preset: root.querySelector("[data-budget-name]").textContent,
    buys: root.querySelector("[data-budget-buys]").textContent,
    metrics: root.querySelectorAll(".budget-metrics > article").length,
  };
})()`);

const grpo = await evaluate(`(() => {
  const root = document.querySelector("[data-reasoning-lab]");
  root.querySelector('[data-lab-tab="grpo"]').click();
  root.querySelector('[data-rollout-profile="all-right"]').click();
  const allRight = {
    signal: root.querySelector("[data-group-signal]").textContent,
    note: root.querySelector("[data-group-note]").textContent,
  };
  root.querySelector('[data-rollout-profile="rare"]').click();
  const ratio = root.querySelector("[data-ratio-window]");
  ratio.value = "10";
  ratio.dispatchEvent(new Event("input", { bubbles: true }));
  return {
    allRight,
    rareSignal: root.querySelector("[data-group-signal]").textContent,
    masks: root.querySelector("[data-mask-count]").textContent,
    rows: root.querySelectorAll("[data-gradient-row]").length,
  };
})()`);

const mopd = await evaluate(`(() => {
  const root = document.querySelector("[data-reasoning-lab]");
  root.querySelector('[data-lab-tab="mopd"]').click();
  root.querySelector('[data-teacher="coding-max"]').click();
  const distance = root.querySelector("[data-distance]");
  const clip = root.querySelector("[data-clip]");
  distance.value = "90";
  clip.value = "10";
  distance.dispatchEvent(new Event("input", { bubbles: true }));
  clip.dispatchEvent(new Event("input", { bubbles: true }));
  return {
    teacher: root.querySelector("[data-teacher-name]").textContent,
    warning: root.querySelector("[data-mopd-warning]").textContent,
    clipped: root.querySelector("[data-mopd-clipped]").textContent,
    density: [...root.querySelectorAll(".mopd-metrics > article b")].at(-1).textContent,
    tokens: root.querySelectorAll("[data-mopd-token]").length,
  };
})()`);

const layout = await evaluate(`(() => {
  const nav = document.querySelector(".top-nav");
  const meta = document.querySelector(".header-meta");
  const viewport = document.documentElement.clientWidth;
  const overflowers = [...document.querySelectorAll("*")]
    .map((node) => {
      const rect = node.getBoundingClientRect();
      return {
        tag: node.tagName,
        className: typeof node.className === "string" ? node.className : "",
        parentClass: typeof node.parentElement?.className === "string" ? node.parentElement.className : "",
        text: (node.textContent ?? "").trim().replace(/\\s+/g, " ").slice(0, 70),
        left: Number(rect.left.toFixed(1)),
        right: Number(rect.right.toFixed(1)),
        width: Number(rect.width.toFixed(1)),
        scrollWidth: node.scrollWidth,
      };
    })
    .filter((item) => item.right > viewport + 1 || item.left < -1)
    .sort((a, b) => Math.max(b.right - viewport, -b.left) - Math.max(a.right - viewport, -a.left))
    .slice(0, 12);
  const scrollNodes = [...document.querySelectorAll("*")]
    .map((node) => ({
      tag: node.tagName,
      className: typeof node.className === "string" ? node.className : "",
      parentClass: typeof node.parentElement?.className === "string" ? node.parentElement.className : "",
      delta: node.scrollWidth - node.clientWidth,
      clientWidth: node.clientWidth,
      scrollWidth: node.scrollWidth,
      overflowX: getComputedStyle(node).overflowX,
    }))
    .filter((item) => item.delta > 1)
    .sort((a, b) => b.delta - a.delta)
    .slice(0, 12);
  return {
    documentOverflow: document.documentElement.scrollWidth - document.documentElement.clientWidth,
    navGap: Number((meta.getBoundingClientRect().left - nav.getBoundingClientRect().right).toFixed(1)),
    navLinks: document.querySelectorAll(".top-nav a").length,
    articleSections: document.querySelectorAll(".article-section").length,
    paperLinks: document.querySelectorAll(".paper-chain a").length,
    overflowers,
  };
})()`);

await evaluate(`(() => {
  document.documentElement.style.scrollBehavior = "auto";
  document.querySelector("[data-reasoning-lab]").scrollIntoView({ block: "start", behavior: "instant" });
})()`);
await pause(150);
await screenshot("/tmp/llm-atlas-reasoning-lab-desktop.png");

await command("Emulation.setDeviceMetricsOverride", {
  width: 390,
  height: 844,
  deviceScaleFactor: 1,
  mobile: true,
});
await navigate("/reasoning/");
await screenshot("/tmp/llm-atlas-reasoning-mobile-closed.png");
const mobile = await evaluate(`(() => {
  const toggle = document.querySelector("#menu-toggle");
  toggle.click();
  const viewport = document.documentElement.clientWidth;
  const overflowers = [...document.querySelectorAll("*")]
    .map((node) => {
      const rect = node.getBoundingClientRect();
      return {
        tag: node.tagName,
        className: typeof node.className === "string" ? node.className : "",
        parentClass: typeof node.parentElement?.className === "string" ? node.parentElement.className : "",
        text: (node.textContent ?? "").trim().replace(/\\s+/g, " ").slice(0, 70),
        left: Number(rect.left.toFixed(1)),
        right: Number(rect.right.toFixed(1)),
        width: Number(rect.width.toFixed(1)),
        scrollWidth: node.scrollWidth,
      };
    })
    .filter((item) => item.right > viewport + 1 || item.left < -1)
    .sort((a, b) => Math.max(b.right - viewport, -b.left) - Math.max(a.right - viewport, -a.left))
    .slice(0, 12);
  const scrollNodes = [...document.querySelectorAll("*")]
    .map((node) => ({
      tag: node.tagName,
      className: typeof node.className === "string" ? node.className : "",
      parentClass: typeof node.parentElement?.className === "string" ? node.parentElement.className : "",
      delta: node.scrollWidth - node.clientWidth,
      clientWidth: node.clientWidth,
      scrollWidth: node.scrollWidth,
      overflowX: getComputedStyle(node).overflowX,
    }))
    .filter((item) => item.delta > 1)
    .sort((a, b) => b.delta - a.delta)
    .slice(0, 12);
  return {
    documentOverflow: document.documentElement.scrollWidth - document.documentElement.clientWidth,
    menuVisible: getComputedStyle(toggle).display !== "none",
    menuOpen: toggle.getAttribute("aria-expanded"),
    title: document.querySelector("h1").innerText,
    overflowers,
    scrollNodes,
  };
})()`);
await screenshot("/tmp/llm-atlas-reasoning-mobile.png");

await command("Emulation.setDeviceMetricsOverride", {
  width: 1440,
  height: 1100,
  deviceScaleFactor: 1,
  mobile: false,
});
await navigate("/");
await evaluate("scrollTo(0, 0)");
const home = await evaluate(`({
  documentOverflow: document.documentElement.scrollWidth - document.documentElement.clientWidth,
  releaseCards: document.querySelectorAll(".release-card").length,
  firstRelease: document.querySelector(".release-card h2").textContent,
  navLinks: document.querySelectorAll(".top-nav a").length,
})`);
await evaluate(`document.querySelector("#new-chapters").scrollIntoView({ block: "start", behavior: "instant" })`);
await pause(100);
await screenshot("/tmp/llm-atlas-home-reasoning-release.png");

const report = { budget, grpo, mopd, layout, mobile, home, exceptions };
console.log(JSON.stringify(report, null, 2));

const numeric = (value) => Number.parseFloat(value);
const failures = [];
if (numeric(budget.independent.coverage) <= numeric(budget.correlated.coverage)) {
  failures.push("候选相关性没有降低 coverage");
}
if (numeric(budget.independent.effective) <= numeric(budget.correlated.effective)) {
  failures.push("候选相关性没有降低有效独立样本");
}
if (!budget.preset.includes("TOOL AGENT") || !budget.buys.includes("新观察")) failures.push("Tool Agent 预设未生效");
if (budget.metrics !== 4) failures.push(`预算指标数量异常：${budget.metrics}`);
if (!grpo.allRight.signal.includes("零") || !grpo.allRight.note.includes("Dynamic Sampling")) {
  failures.push("全对组零优势解释缺失");
}
if (grpo.rows !== 8 || numeric(grpo.masks) < 1) failures.push("GRPO 行数或 K2.5 mask 异常");
if (!mopd.teacher.includes("CODING · MAX") || !mopd.warning.includes("高风险")) failures.push("MOPD 远教师预设未生效");
if (mopd.tokens !== 12 || mopd.density.trim() !== "12 / 12") failures.push("MOPD 稠密 token 信号异常");
if (layout.articleSections !== 15 || layout.paperLinks !== 30) failures.push("章节或论文链数量异常");
if (layout.documentOverflow > 0 || mobile.documentOverflow > 0 || home.documentOverflow > 0) {
  failures.push("页面存在横向溢出");
}
if (layout.navGap < 0) failures.push(`桌面导航碰撞：${layout.navGap}px`);
if (!mobile.menuVisible || mobile.menuOpen !== "true") failures.push("移动端菜单不可用");
if (home.releaseCards !== 12 || !home.firstRelease.includes("原生多模态")) failures.push("首页 Transformer 新章入口异常");
if (exceptions.length) failures.push(`浏览器脚本异常：${exceptions.join("; ")}`);

socket.close();
if (failures.length) {
  failures.forEach((failure) => console.error(`- ${failure}`));
  process.exit(1);
}