feat: publish native multimodal chapter

2026-07-29 07:51:42 +08:00
parent 8e5f08ac21
commit 9f5673213d
24 changed files with 4867 additions and 41 deletions
@@ -0,0 +1,262 @@
+import { writeFileSync } from "node:fs";
+
+const cdpPort = process.env.CDP_PORT ?? "9225";
+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.exception?.description ?? 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.exception?.description ?? result.exceptionDetails.text);
+  return result.result.value;
+};
+const navigate = async (path) => {
+  await command("Page.navigate", { url: `${baseUrl}${path}` });
+  for (let attempt = 0; attempt < 70; attempt += 1) {
+    await pause(100);
+    if (await evaluate("document.readyState === 'complete'")) return;
+  }
+  throw new Error(`${path} 加载超时`);
+};
+const screenshot = async (path) => {
+  const result = await command("Page.captureScreenshot", {
+    format: "png",
+    captureBeyondViewport: false,
+  });
+  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("/multimodal/");
+await screenshot("/tmp/llm-atlas-multimodal-desktop.png");
+
+const overview = await evaluate(`(() => ({
+  title: document.querySelector("h1")?.textContent.trim(),
+  sections: document.querySelectorAll(".article-section").length,
+  tocLinks: document.querySelectorAll(".side-rail a").length,
+  paperLinks: document.querySelectorAll(".paper-chain a").length,
+  labTabs: document.querySelectorAll("[data-mm-tab]").length,
+  labPanels: document.querySelectorAll("[data-mm-panel]").length,
+  navLinks: document.querySelectorAll(".top-nav a").length,
+  documentOverflow: document.documentElement.scrollWidth - document.documentElement.clientWidth,
+}))()`);
+
+const tokens = await evaluate(`(() => {
+  const root = document.querySelector("[data-mm-lab]");
+  const read = () => ({
+    patches: root.querySelector("[data-token-patches]").textContent.trim(),
+    visual: root.querySelector("[data-token-visual]").textContent.trim(),
+    share: root.querySelector("[data-token-share]").textContent.trim(),
+    status: root.querySelector("[data-token-status]").textContent.trim(),
+    visiblePanel: root.querySelector("[data-mm-panel]:not([hidden])").dataset.mmPanel,
+  });
+  const initial = read();
+  const resolution = root.querySelector("[data-token-resolution]");
+  const frames = root.querySelector("[data-token-frames]");
+  const context = root.querySelector("[data-token-context]");
+  resolution.value = "7";
+  resolution.dispatchEvent(new Event("input", { bubbles: true }));
+  frames.value = "32";
+  frames.dispatchEvent(new Event("input", { bubbles: true }));
+  context.value = "8192";
+  context.dispatchEvent(new Event("input", { bubbles: true }));
+  root.querySelector('[data-spatial="1"]').click();
+  const overloaded = read();
+  return { initial, overloaded };
+})()`);
+
+const connector = await evaluate(`(() => {
+  const root = document.querySelector("[data-mm-lab]");
+  root.querySelector('[data-mm-tab="connector"]').click();
+  const read = () => ({
+    visual: root.querySelector("[data-connector-visual]").textContent.trim(),
+    alignment: root.querySelector("[data-connector-alignment]").textContent.trim(),
+    score: root.querySelector("[data-native-score]").textContent.trim(),
+    activeNative: root.querySelectorAll("[data-native-item].active").length,
+    visiblePanel: root.querySelector("[data-mm-panel]:not([hidden])").dataset.mmPanel,
+  });
+  root.querySelector('[data-connector="k3"]').click();
+  const k3 = read();
+  root.querySelector('[data-connector="kimivl"]').click();
+  const kimiVl = read();
+  return { k3, kimiVl };
+})()`);
+
+const ocr = await evaluate(`(() => {
+  const root = document.querySelector("[data-mm-lab]");
+  root.querySelector('[data-mm-tab="ocr"]').click();
+  const curve = root.querySelector("[data-ocr-curve]");
+  const read = () => ({
+    ratio: root.querySelector("[data-ocr-ratio]").textContent.trim(),
+    accuracy: root.querySelector("[data-ocr-accuracy]").textContent.trim(),
+    evidence: root.querySelector("[data-ocr-evidence]").textContent.trim(),
+    status: root.querySelector("[data-ocr-status]").textContent.trim(),
+  });
+  const boundary = read();
+  curve.value = "15";
+  curve.dispatchEvent(new Event("input", { bubbles: true }));
+  const interpolated = read();
+  curve.value = "23";
+  curve.dispatchEvent(new Event("input", { bubbles: true }));
+  const unreported = read();
+  return { boundary, interpolated, unreported };
+})()`);
+
+const loop = await evaluate(`(() => {
+  const root = document.querySelector("[data-mm-lab]");
+  root.querySelector('[data-mm-tab="loop"]').click();
+  const read = () => ({
+    evidence: root.querySelector("[data-loop-evidence]").textContent.trim(),
+    tools: root.querySelector("[data-loop-tools]").textContent.trim(),
+    state: root.querySelector("[data-loop-state]").textContent.trim(),
+    type: root.querySelector("[data-loop-type]").textContent.trim(),
+    takeaway: root.querySelector("[data-loop-takeaway]").textContent.trim(),
+  });
+  const toolsStart = read();
+  const next = root.querySelector("[data-loop-next]");
+  for (let index = 0; index < 4; index += 1) next.click();
+  const toolsEnd = read();
+  root.querySelector('[data-loop-mode="cot"]').click();
+  next.click();
+  next.click();
+  const cotEnd = read();
+  const firstTab = root.querySelector('[data-mm-tab="tokens"]');
+  firstTab.focus();
+  firstTab.dispatchEvent(new KeyboardEvent("keydown", { key: "ArrowRight", bubbles: true }));
+  return {
+    toolsStart,
+    toolsEnd,
+    cotEnd,
+    keyboardSelected: root.querySelector('[data-mm-tab][aria-selected="true"]').dataset.mmTab,
+    keyboardVisible: root.querySelector("[data-mm-panel]:not([hidden])").dataset.mmPanel,
+  };
+})()`);
+
+await evaluate(`document.querySelector("[data-mm-lab]").scrollIntoView({ block: "start", behavior: "instant" })`);
+await pause(180);
+await screenshot("/tmp/llm-atlas-multimodal-lab-desktop.png");
+
+await navigate("/");
+const home = await evaluate(`(() => ({
+  releaseCards: document.querySelectorAll(".release-card").length,
+  firstRelease: document.querySelector(".release-card h2").textContent.trim(),
+  firstHref: document.querySelector(".release-card").getAttribute("href"),
+  paperCount: document.querySelector(".hero-stats div:nth-child(3) b").textContent.trim(),
+  navLinks: document.querySelectorAll(".top-nav a").length,
+}))()`);
+
+await navigate("/papers/");
+const papers = await evaluate(`(() => {
+  const button = [...document.querySelectorAll("[data-filter]")].find((node) => node.textContent.trim() === "多模态");
+  button?.click();
+  return {
+    total: document.querySelectorAll("[data-paper]").length,
+    multimodalVisible: document.querySelectorAll("[data-paper]:not([hidden])").length,
+    hasFilter: Boolean(button),
+  };
+})()`);
+
+await command("Emulation.setDeviceMetricsOverride", {
+  width: 390,
+  height: 844,
+  deviceScaleFactor: 1,
+  mobile: true,
+});
+await navigate("/multimodal/");
+const mobile = await evaluate(`(() => {
+  const root = document.querySelector("[data-mm-lab]");
+  root.scrollIntoView({ block: "start", behavior: "instant" });
+  const toggle = document.querySelector("#menu-toggle");
+  toggle?.click();
+  return {
+    documentOverflow: document.documentElement.scrollWidth - document.documentElement.clientWidth,
+    menuVisible: getComputedStyle(toggle).display !== "none",
+    menuOpen: toggle.getAttribute("aria-expanded"),
+    mobileLinks: document.querySelectorAll("#mobile-nav a").length,
+    tabs: root.querySelectorAll("[data-mm-tab]").length,
+    offenders: [...document.querySelectorAll("body *")]
+      .filter((node) => !node.closest(".eval-matrix"))
+      .filter((node) => node.getBoundingClientRect().right > document.documentElement.clientWidth + 1)
+      .slice(0, 12)
+      .map((node) => ({
+        tag: node.tagName,
+        className: typeof node.className === "string" ? node.className : "",
+        right: Math.round(node.getBoundingClientRect().right),
+        width: Math.round(node.getBoundingClientRect().width),
+      })),
+  };
+})()`);
+await pause(180);
+await screenshot("/tmp/llm-atlas-multimodal-mobile.png");
+
+const report = { overview, tokens, connector, ocr, loop, home, papers, mobile, exceptions };
+console.log(JSON.stringify(report, null, 2));
+
+const numeric = (value) => Number.parseFloat(value.replaceAll(",", ""));
+const failures = [];
+if (!overview.title.includes("第一类输入")) failures.push("章节标题异常");
+if (overview.sections !== 30 || overview.tocLinks !== 30) failures.push("章节/目录数量异常");
+if (overview.paperLinks !== 55) failures.push("正式论文链不是 55 个节点");
+if (overview.labTabs !== 4 || overview.labPanels !== 4) failures.push("四联实验结构异常");
+if (overview.navLinks !== 17 || home.navLinks !== 17 || mobile.mobileLinks !== 17) failures.push("全站导航未同步多模态专题");
+if (overview.documentOverflow > 1 || mobile.documentOverflow > 1) failures.push("桌面或移动端存在横向溢出");
+if (numeric(tokens.initial.patches) !== 5476 || numeric(tokens.initial.visual) !== 1369 || tokens.initial.visiblePanel !== "tokens") failures.push("视觉 Token 初始计算异常");
+if (!tokens.overloaded.status.includes("超预算") || numeric(tokens.overloaded.share) <= 100) failures.push("超大视频没有触发上下文超预算");
+if (!connector.k3.visual.includes("从头") || !connector.k3.alignment.includes("无 post-hoc") || connector.k3.score !== "5 / 5" || connector.k3.activeNative !== 5) failures.push("K3 训练制度预设异常");
+if (connector.kimiVl.score !== "4 / 5" || connector.kimiVl.activeNative !== 4 || connector.k3.visiblePanel !== "connector") failures.push("Kimi-VL 原生五维预设异常");
+if (ocr.boundary.status !== "BOUNDARY" || Math.abs(numeric(ocr.boundary.ratio) - 7.81) > 0.01) failures.push("OCR 初始压缩边界异常");
+if (ocr.interpolated.status !== "TEACHING INTERPOLATION" || !ocr.interpolated.evidence.includes("教学插值")) failures.push("OCR 教学插值没有显式标记");
+if (ocr.unreported.status !== "OUT OF EVIDENCE" || ocr.unreported.accuracy !== "未报告") failures.push("OCR 超证据区仍在外推");
+if (loop.toolsStart.state !== "OPEN" || loop.toolsEnd.state !== "VERIFIED" || loop.toolsEnd.evidence !== "97%" || loop.toolsEnd.tools !== "3") failures.push("vision-in-the-loop 终局异常");
+if (loop.cotEnd.state !== "FAILED" || !loop.cotEnd.takeaway.includes("不能凭空增加")) failures.push("文字 CoT 与新观察没有分开");
+if (loop.keyboardSelected !== "connector" || loop.keyboardVisible !== "connector") failures.push("实验键盘 tab 导航异常");
+if (home.releaseCards !== 12 || !home.firstRelease.includes("原生多模态") || home.firstHref !== "/multimodal/") failures.push("首页多模态首发入口异常");
+if (home.paperCount !== "355" || papers.total !== 355 || !papers.hasFilter || papers.multimodalVisible < 59) failures.push("论文库多模态标签或总数异常");
+if (!mobile.menuVisible || mobile.menuOpen !== "true" || mobile.tabs !== 4) failures.push("移动端导航或实验异常");
+if (mobile.offenders.length) failures.push(`移动端越界元素：${JSON.stringify(mobile.offenders)}`);
+if (exceptions.length) failures.push(`浏览器异常：${exceptions.join(" | ")}`);
+
+if (failures.length) {
+  console.error(`\nFAIL\n- ${failures.join("\n- ")}`);
+  process.exitCode = 1;
+} else {
+  console.log("\nPASS multimodal browser regression");
+}
+
+socket.close();