@taole/dd-playwright 0.1.1 → 0.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@taole/dd-playwright",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Standalone stdio MCP & CLI: Playwright browser automation + isolated whistle proxy + diandian account storageState injection",
   "type": "module",
   "license": "ISC",

package/src/auth/diandian-auth.mjs

@@ -1,4 +1,5 @@
 import { chromium } from "playwright";
+import { ensureChromiumInstalled } from "../browser-check.mjs";
 
 export const DIANDIAN_HOME_URL = "https://y.tuwan.com";
 export const DIANDIAN_USER_INFO_URL =
@@ -43,10 +44,9 @@ export class DiandianAuthManager {
 
     this.startupPromise = (async () => {
       await this.close();
-
+      await ensureChromiumInstalled();
       const instance = await this.chromium.launch({ headless });
       const ctx = await instance.newContext({
-        viewport: { width: 1100, height: 850 },
         userAgent:
           "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0.0.0 Safari/537.36",
       });

package/src/browser-check.mjs

@@ -0,0 +1,103 @@
+import { chromium } from "playwright";
+import { existsSync } from "node:fs";
+import { execSync } from "node:child_process";
+
+let cachedChromiumMeta = null;
+
+/**
+ * 获取当前 Chromium 内核安装状态与元数据
+ * @returns {Promise<{ installed: boolean, executablePath: string, version: string|null, error: string|null }>}
+ */
+export async function getChromiumMetadata() {
+  let executablePath = "";
+  try {
+    executablePath = chromium.executablePath();
+  } catch (err) {
+    return {
+      installed: false,
+      executablePath: "",
+      version: null,
+      error: err.message,
+    };
+  }
+
+  const installed = Boolean(executablePath && existsSync(executablePath));
+  if (!installed) {
+    return {
+      installed: false,
+      executablePath: executablePath || "",
+      version: null,
+      error: "未在系统默认目录中发现对应版本的 Chromium 二进制文件",
+    };
+  }
+
+  if (cachedChromiumMeta && cachedChromiumMeta.installed) {
+    return cachedChromiumMeta;
+  }
+
+  let version = null;
+  try {
+    const browser = await chromium.launch({ headless: true });
+    version = browser.version();
+    await browser.close();
+  } catch (err) {
+    // 无法正常启动时可能是缺少依赖库或路径损坏
+    return {
+      installed: true,
+      executablePath,
+      version: null,
+      error: `启动检查异常: ${err.message}`,
+    };
+  }
+
+  cachedChromiumMeta = {
+    installed: true,
+    executablePath,
+    version,
+    error: null,
+  };
+  return cachedChromiumMeta;
+}
+
+/**
+ * 确保 Chromium 内核已就绪，若缺失则自动执行下载补齐
+ * @param {object} [options]
+ * @param {boolean} [options.silent] 是否静默输出
+ * @returns {Promise<boolean>} 是否成功就绪
+ */
+export async function ensureChromiumInstalled({ silent = false } = {}) {
+  const meta = await getChromiumMetadata();
+  if (meta.installed && meta.version) {
+    return true;
+  }
+
+  if (!silent) {
+    console.log(
+      "\n[dd-playwright] 检测到当前系统尚未安装 Chromium 浏览器内核，正在为您自动下载 (~150MB)，请稍候...",
+    );
+  }
+
+  try {
+    // 调用 playwright 内置命令安装 chromium
+    execSync("npx playwright install chromium", {
+      stdio: silent ? "ignore" : "inherit",
+      windowsHide: true,
+    });
+    cachedChromiumMeta = null; // 清理缓存
+    const verify = await getChromiumMetadata();
+    if (!silent) {
+      if (verify.installed) {
+        console.log(`[dd-playwright] Chromium 内核自动安装成功！版本: ${verify.version}\n`);
+      } else {
+        console.warn(`[dd-playwright] Chromium 安装流程已结束，但未能在路径检测到执行文件: ${verify.executablePath}\n`);
+      }
+    }
+    return verify.installed;
+  } catch (err) {
+    if (!silent) {
+      console.error(`[dd-playwright] 自动安装 Chromium 失败: ${err.message}`);
+      console.error(`可手动在终端执行: npx playwright install chromium\n`);
+    }
+    return false;
+  }
+}

package/src/browser-manager.mjs

@@ -5,6 +5,7 @@ import { existsSync, mkdirSync, readFileSync } from "node:fs";
 import { DatabaseSync } from "node:sqlite";
 import { join } from "node:path";
 import { chromium } from "playwright";
+import { ensureChromiumInstalled } from "./browser-check.mjs";
 import { WhistleProxyManager } from "./whistle-proxy.mjs";
 
 /**
@@ -164,6 +165,7 @@ export class PlaywrightBrowserManager {
     }
 
     if (!this.browser) {
+      await ensureChromiumInstalled();
       const launchArgs = this.whistle.started ? this.whistle.getBrowserArgs() : [];
       this.browser = await chromium.launch({
         headless: this.headless,

package/src/server/web-server.mjs

@@ -1,7 +1,8 @@
 import { createServer } from "node:http";
+import { readFileSync } from "node:fs";
 import { fileURLToPath } from "node:url";
-import { AccountStore } from "../account-store.mjs";
 import { DiandianAuthManager } from "../auth/diandian-auth.mjs";
+import { getChromiumMetadata } from "../browser-check.mjs";
 
 function sendJson(res, statusCode, payload) {
   res.writeHead(statusCode, {
@@ -300,7 +301,7 @@ const DASHBOARD_HTML = `<!DOCTYPE html>
         <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M9 3v18"/><path d="M15 9h6"/></svg>
         dd-playwright 账号管理控制台
       </h1>
-      <span style="font-size: 13px; color: var(--muted);">v0.1.1</span>
+      <span style="font-size: 13px; color: var(--muted);">v{{VERSION}}</span>
     </header>
 
     <div class="nav-tabs">
@@ -407,11 +408,25 @@ const DASHBOARD_HTML = `<!DOCTYPE html>
             <span id="headlessKnob" style="position: absolute; height: 20px; width: 20px; left: 3px; bottom: 3px; background-color: white; transition: .2s; border-radius: 50%;"></span>
           </label>
         </div>
-
         <div style="margin-top: 16px; font-size: 12px; color: var(--muted); line-height: 1.6; padding: 12px; background: #090d16; border-radius: 6px; border: 1px solid var(--border);">
           📁 <b>数据存储说明：</b><br>
           本服务所有数据与账号库已默认固化在用户主目录下的 <code>~/.dd-browser-mcp/runtime.db</code>，无需配置任何复杂环境变量，开箱即用。
         </div>
+
+        <!-- Chromium 浏览器内核状态展示卡片 -->
+        <div style="margin-top: 20px; padding: 16px; background: #0f172a; border-radius: 8px; border: 1px solid var(--border);">
+          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
+            <div style="font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 8px;">
+              <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="4"/><line x1="21.17" y1="8" x2="12" y2="8"/><line x1="3.95" y1="6.06" x2="8.54" y2="14"/><line x1="10.88" y1="21.94" x2="15.46" y2="14"/></svg>
+              Chromium 浏览器内核
+            </div>
+            <span id="chromiumStatusBadge" style="font-size: 11px; padding: 2px 8px; border-radius: 4px; background: #334155; color: var(--muted);">检测中...</span>
+          </div>
+          <div id="chromiumDetails" style="font-size: 12px; color: var(--muted); line-height: 1.8;">
+            <div>版本号：<span id="chromiumVersion" style="color: #cbd5e1; font-family: monospace;">加载中...</span></div>
+            <div>执行路径：<span id="chromiumPath" style="color: #cbd5e1; font-family: monospace; word-break: break-all;">加载中...</span></div>
+          </div>
+        </div>
       </div>
     </div>
 
@@ -668,9 +683,35 @@ const DASHBOARD_HTML = `<!DOCTYPE html>
       }
     }
 
-    // 初次加载账号与配置
+    async function loadChromiumMeta() {
+      try {
+        const res = await fetch('/api/chromium');
+        const data = await res.json();
+        const badge = document.getElementById('chromiumStatusBadge');
+        const versionEl = document.getElementById('chromiumVersion');
+        const pathEl = document.getElementById('chromiumPath');
+        if (!badge || !versionEl || !pathEl) return;
+        
+        if (data.ok && data.meta && data.meta.installed) {
+          badge.innerText = '已安装就绪';
+          badge.style.background = 'rgba(16, 185, 129, 0.15)';
+          badge.style.color = 'var(--success)';
+          versionEl.innerText = data.meta.version || '已安装 (Playwright 托管)';
+          pathEl.innerText = data.meta.executablePath || '-';
+        } else {
+          badge.innerText = '未就绪 (首次调用将自动安装)';
+          badge.style.background = 'rgba(239, 68, 68, 0.15)';
+          badge.style.color = 'var(--danger)';
+          versionEl.innerText = '未检测到内核';
+          pathEl.innerText = data.meta?.executablePath || '-';
+        }
+      } catch {}
+    }
+
+    // 初次加载账号、配置与内核状态
     loadAccounts();
     loadSettings();
+    loadChromiumMeta();
   </script>
 </body>
 </html>`;
@@ -734,11 +775,18 @@ export function createWebServer({ accountStore, authManager }) {
         <div id="code-mcp-local" class="code-block">${localConfigStr}</div>
       `;
 
+      const pkgPath = fileURLToPath(new URL("../../package.json", import.meta.url));
+      let pkgVersion = "0.1.0";
+      try {
+        const pkg = JSON.parse(readFileSync(pkgPath, "utf8"));
+        pkgVersion = pkg.version || "0.1.0";
+      } catch {}
+
       const renderedHtml = DASHBOARD_HTML
+        .replace("{{VERSION}}", pkgVersion)
         .replace("{{BANNER_STYLE}}", bannerStyle)
         .replace("{{BANNER_CONTENT}}", bannerContent)
         .replace("{{CONFIG_SECTIONS}}", configSections);
-
       sendHtml(res, renderedHtml);
       return;
     }
@@ -784,6 +832,17 @@ export function createWebServer({ accountStore, authManager }) {
       }
       return;
     }
+    // 2.3 获取 Chromium 内核元数据
+    if (pathname === "/api/chromium" && req.method === "GET") {
+      try {
+        const meta = await getChromiumMetadata();
+        sendJson(res, 200, { ok: true, meta });
+      } catch (err) {
+        sendJson(res, 500, { ok: false, error: err.message });
+      }
+      return;
+    }
+
 
 
     // 3. 切换激活账号