@sudu-cli/fronted-preview-mcp 1.0.0-beta.0 → 1.0.0-beta.2

package/dist/handlers/typescriptDiagnostics.js

@@ -0,0 +1,151 @@
+import * as path from 'node:path';
+import { Project } from 'ts-morph';
+function getSeverity(diagnostic) {
+    const category = diagnostic.getCategory();
+    if (category === 1)
+        return 'error'; // DiagnosticCategory.Error
+    if (category === 0)
+        return 'warning'; // DiagnosticCategory.Warning
+    if (category === 2)
+        return 'suggestion'; // DiagnosticCategory.Suggestion
+    return 'message'; // DiagnosticCategory.Message
+}
+function getCategory(diagnostic) {
+    const code = diagnostic.getCode();
+    // TypeScript diagnostic codes:
+    // 1000-1999: syntactic (parser)
+    // 2000-2999: semantic (binder/checker)
+    // 3000-3999: declaration
+    // 4000-4999: config
+    // 5000-5999: project references
+    // 6000-6999: deprecated
+    // 7000-7999: strict null checks
+    // 8000-8999: watch
+    if (code >= 1000 && code < 2000)
+        return 'syntactic';
+    if (code >= 2000 && code < 3000)
+        return 'semantic';
+    if (code >= 3000 && code < 4000)
+        return 'declaration';
+    if (code >= 4000 && code < 5000)
+        return 'config';
+    if (code >= 5000 && code < 6000)
+        return 'typescript'; // project references
+    return 'typescript';
+}
+function formatDiagnostic(diagnostic, projectDir) {
+    const sourceFile = diagnostic.getSourceFile();
+    const filePath = sourceFile ? path.relative(projectDir, sourceFile.getFilePath()) : 'unknown';
+    let line = 0;
+    let column = 0;
+    const start = diagnostic.getStart();
+    if (start !== undefined && sourceFile) {
+        const pos = sourceFile.getLineAndColumnAtPos(start);
+        // ts-morph returns { line, character } or { line, column } depending on version
+        line = pos.line;
+        const col = 'character' in pos ? pos.character : 'column' in pos ? pos.column : 0;
+        column = typeof col === 'number' ? col : 0;
+    }
+    // getMessageText() can return string or DiagnosticMessageChain
+    const messageText = diagnostic.getMessageText();
+    const message = typeof messageText === 'string' ? messageText : JSON.stringify(messageText);
+    return {
+        file: filePath,
+        line: line + 1, // Convert to 1-based
+        column: column + 1, // Convert to 1-based
+        code: diagnostic.getCode(),
+        message,
+        severity: getSeverity(diagnostic),
+        category: getCategory(diagnostic),
+    };
+}
+async function handleGetTypeScriptDiagnostics(args) {
+    const startTime = Date.now();
+    const projectDir = args.projectDir || process.cwd();
+    const tsConfigPath = args.tsConfigPath || 'tsconfig.json';
+    const fullTsConfigPath = path.resolve(projectDir, tsConfigPath);
+    const includeWarnings = args.includeWarnings ?? true;
+    try {
+        // Check if tsconfig exists
+        const fs = await import('node:fs/promises');
+        try {
+            await fs.access(fullTsConfigPath);
+        }
+        catch {
+            return {
+                content: [
+                    {
+                        type: 'text',
+                        text: JSON.stringify({
+                            error: `tsconfig.json not found at ${fullTsConfigPath}`,
+                            projectDir,
+                            suggestion: 'Ensure the project has a tsconfig.json file',
+                        }, null, 2),
+                    },
+                ],
+                isError: true,
+            };
+        }
+        // Create ts-morph project
+        const project = new Project({
+            tsConfigFilePath: fullTsConfigPath,
+            skipAddingFilesFromTsConfig: false,
+            skipFileDependencyResolution: true, // Faster for diagnostics only
+            skipLoadingLibFiles: true, // Don't load lib.d.ts
+        });
+        let diagnostics = [];
+        if (args.files && args.files.length > 0) {
+            // Check specific files
+            for (const file of args.files) {
+                const fullPath = path.resolve(projectDir, file);
+                const sourceFile = project.getSourceFile(fullPath);
+                if (sourceFile) {
+                    const fileDiagnostics = sourceFile.getPreEmitDiagnostics();
+                    diagnostics.push(...fileDiagnostics);
+                }
+            }
+        }
+        else {
+            // Check entire project
+            diagnostics = project.getPreEmitDiagnostics();
+        }
+        // Filter and format
+        const formattedDiagnostics = diagnostics
+            .filter((d) => includeWarnings || d.getCategory() === 1) // Include errors always, warnings if requested
+            .map((d) => formatDiagnostic(d, projectDir));
+        // Count by severity
+        const errorCount = formattedDiagnostics.filter((d) => d.severity === 'error').length;
+        const warningCount = formattedDiagnostics.filter((d) => d.severity === 'warning').length;
+        const suggestionCount = formattedDiagnostics.filter((d) => d.severity === 'suggestion').length;
+        // Count unique files
+        const fileCount = new Set(formattedDiagnostics.map((d) => d.file)).size;
+        const report = {
+            projectDir,
+            tsConfigPath: path.relative(projectDir, fullTsConfigPath),
+            diagnostics: formattedDiagnostics,
+            errorCount,
+            warningCount,
+            suggestionCount,
+            fileCount,
+            durationMs: Date.now() - startTime,
+            timestamp: new Date().toISOString(),
+        };
+        return {
+            content: [
+                {
+                    type: 'text',
+                    text: JSON.stringify(report, null, 2),
+                },
+            ],
+        };
+    }
+    catch (err) {
+        const errorMessage = err instanceof Error ? err.message : String(err);
+        return {
+            content: [{ type: 'text', text: JSON.stringify({ error: errorMessage }, null, 2) }],
+            isError: true,
+        };
+    }
+}
+export { handleGetTypeScriptDiagnostics };
+//# sourceMappingURL=typescriptDiagnostics.js.map

package/dist/handlers/typescriptDiagnostics.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"typescriptDiagnostics.js","sourceRoot":"","sources":["../../src/handlers/typescriptDiagnostics.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -7,6 +7,11 @@ import { handleGetProjectInfo } from './handlers/getProjectInfo.js';
 import { handleStartDevServer } from './handlers/startDevServer.js';
 import { handleStopDevServer } from './handlers/stopDevServer.js';
 import { handleQuickPreview } from './handlers/quickPreview.js';
+import { handleCheckPageErrors } from './handlers/checkPageErrors.js';
+import { handleGetTypeScriptDiagnostics } from './handlers/typescriptDiagnostics.js';
+import { handlePickElement } from './handlers/pickElement.js';
+import { handleTakeScreenshot } from './handlers/takeScreenshot.js';
+import { handleAutoFixLoop } from './handlers/autoFixLoop.js';
 const server = new McpServer({
     name: 'frontend-preview',
     version: '1.0.0',
@@ -117,6 +122,277 @@ server.tool('quick_preview', 'ONE-STEP: detect frontend framework + start dev se
     return await handleQuickPreview(args);
 });
 // ============================================================
+// Tool: check_page_errors
+// ============================================================
+server.tool('check_page_errors', 'Check frontend page for console errors and network failures. ' +
+    'Starts dev server (if needed), connects to Chrome via CDP (port 9222), ' +
+    'navigates to the page, and returns structured error report.\n\n' +
+    'Returns { pageUrl, framework, port, consoleMessages[], networkErrors[], hasErrors, errorCount, warningCount }.\n\n' +
+    'WHEN TO USE:\n' +
+    '- User wants to check if page has any JavaScript errors\n' +
+    '- User wants to verify page loads without console errors\n' +
+    '- Automated CI/CD error checking\n\n' +
+    'PREREQUISITE:\n' +
+    '- Chrome must be running with --remote-debugging-port=9222\n' +
+    '- Start Chrome: chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-debug\n\n' +
+    'AFTER THIS TOOL:\n' +
+    '- If errors found, use the error details to fix the code\n' +
+    '- Re-run check_page_errors to verify fixes\n' +
+    '- For visual inspection, use chrome-devtools take_screenshot', {
+    projectDir: z
+        .string()
+        .optional()
+        .describe('Absolute path to the frontend project directory. Defaults to current working directory.'),
+    customPort: z
+        .number()
+        .optional()
+        .describe('Override the auto-detected dev server port number.'),
+    cdpPort: z
+        .number()
+        .optional()
+        .describe('Chrome DevTools Protocol port. Defaults to 9222.'),
+    waitForLoadMs: z
+        .number()
+        .optional()
+        .describe('Milliseconds to wait for page load before checking console. Defaults to 3000.'),
+}, async (args) => {
+    return await handleCheckPageErrors(args);
+});
+// ============================================================
+// Tool: get_typescript_diagnostics
+// ============================================================
+server.tool('get_typescript_diagnostics', 'Get TypeScript compiler diagnostics (type errors, warnings) for a project. ' +
+    'Uses ts-morph to run incremental type checking without emitting files.\n\n' +
+    'Returns { projectDir, tsConfigPath, diagnostics[], errorCount, warningCount, fileCount, durationMs }.\n\n' +
+    'WHEN TO USE:\n' +
+    '- User wants to check for TypeScript type errors\n' +
+    '- After code changes to verify no regressions\n' +
+    '- CI/CD pre-check before build\n' +
+    '- AI needs context for type-safe fixes\n\n' +
+    'PREREQUISITE:\n' +
+    '- Project must have a valid tsconfig.json\n' +
+    '- Dependencies should be installed (node_modules)\n\n' +
+    'AFTER THIS TOOL:\n' +
+    '- Fix reported type errors in the listed files\n' +
+    '- Re-run to verify fixes\n' +
+    '- Combine with check_page_errors for full error coverage', {
+    projectDir: z
+        .string()
+        .optional()
+        .describe('Absolute path to the frontend project directory. Defaults to current working directory.'),
+    tsConfigPath: z
+        .string()
+        .optional()
+        .describe('Relative path to tsconfig.json from projectDir. Defaults to "tsconfig.json".'),
+    files: z
+        .array(z.string())
+        .optional()
+        .describe('Optional: specific files to check (relative to projectDir). If omitted, checks entire project.'),
+    includeWarnings: z
+        .boolean()
+        .optional()
+        .describe('Include warnings and suggestions. Defaults to true.'),
+}, async (args) => {
+    return await handleGetTypeScriptDiagnostics(args);
+});
+// ============================================================
+// Tool: pick_element
+// ============================================================
+server.tool('pick_element', 'Pick an element from the frontend page to get its selector, styles, and structure. ' +
+    'Starts dev server (if needed), connects to Chrome via CDP (port 9222), ' +
+    'and either uses a provided CSS selector or enters inspection mode for user to click an element.\n\n' +
+    'Returns { pageUrl, framework, port, element: { selector, xpath, tagName, id, className, attributes, computedStyles, boundingBox, outerHTML, innerText, componentName, componentProps } }.\n\n' +
+    'WHEN TO USE:\n' +
+    '- User wants to inspect a specific element on the page\n' +
+    '- User says "pick this element" or "what is this button\'s selector"\n' +
+    '- Need exact CSS selector, computed styles, or component info for AI fixing\n\n' +
+    'PREREQUISITE:\n' +
+    '- Chrome must be running with --remote-debugging-port=9222\n' +
+    '- Start Chrome: chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-debug\n\n' +
+    'AFTER THIS TOOL:\n' +
+    '- Use the selector/xpath to target the element in fixes\n' +
+    '- Use computedStyles to understand layout issues\n' +
+    '- Use componentName/componentProps for React/Vue component debugging\n' +
+    '- Combine with check_page_errors for full debugging context', {
+    projectDir: z
+        .string()
+        .optional()
+        .describe('Absolute path to the frontend project directory. Defaults to current working directory.'),
+    customPort: z
+        .number()
+        .optional()
+        .describe('Override the auto-detected dev server port number.'),
+    cdpPort: z
+        .number()
+        .optional()
+        .describe('Chrome DevTools Protocol port. Defaults to 9222.'),
+    selector: z
+        .string()
+        .optional()
+        .describe('Optional: CSS selector to pick directly. If omitted, enters inspection mode for user to click element.'),
+    waitForLoadMs: z
+        .number()
+        .optional()
+        .describe('Milliseconds to wait for page load before picking. Defaults to 3000.'),
+}, async (args) => {
+    return await handlePickElement(args);
+});
+// ============================================================
+// Tool: take_screenshot
+// ============================================================
+server.tool('take_screenshot', 'Take a screenshot of the frontend page or specific element. ' +
+    'Starts dev server (if needed), connects to Chrome via CDP (port 9222), ' +
+    'and captures the current page view or a specific element.\n\n' +
+    'Returns { success, message, dataUrl, filePath, error }.\n\n' +
+    'WHEN TO USE:\n' +
+    '- User wants to capture the current page state\n' +
+    '- User says "take a screenshot" or "show me the page"\n' +
+    '- Need visual confirmation of page layout or styling\n' +
+    '- Documenting bugs or sharing UI state\n\n' +
+    'PREREQUISITE:\n' +
+    '- Chrome must be running with --remote-debugging-port=9222\n' +
+    '- Start Chrome: chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-debug\n\n' +
+    'AFTER THIS TOOL:\n' +
+    '- Use dataUrl for inline display or save to file for sharing\n' +
+    '- Combine with pick_element for element-specific screenshots\n' +
+    '- Use in error reporting to show visual context', {
+    projectDir: z
+        .string()
+        .optional()
+        .describe('Absolute path to the frontend project directory. Defaults to current working directory.'),
+    customPort: z
+        .number()
+        .optional()
+        .describe('Override the auto-detected dev server port number.'),
+    cdpPort: z
+        .number()
+        .optional()
+        .describe('Chrome DevTools Protocol port. Defaults to 9222.'),
+    format: z
+        .enum(['png', 'jpeg', 'webp'])
+        .optional()
+        .describe('Image format. Defaults to "png".'),
+    quality: z
+        .number()
+        .min(0)
+        .max(100)
+        .optional()
+        .describe('Image quality for JPEG/WebP (0-100). Defaults to 80.'),
+    fullPage: z
+        .boolean()
+        .optional()
+        .describe('Capture entire page instead of viewport. Defaults to false.'),
+    selector: z
+        .string()
+        .optional()
+        .describe('Optional: CSS selector to screenshot specific element. If omitted, captures entire viewport.'),
+    waitForLoadMs: z
+        .number()
+        .optional()
+        .describe('Milliseconds to wait for page load before screenshot. Defaults to 3000.'),
+}, async (args) => {
+    const result = await handleTakeScreenshot(args);
+    return {
+        content: [
+            {
+                type: 'text',
+                text: result.success
+                    ? `Screenshot captured successfully!\nFormat: ${result.dataUrl ? 'data URL' : 'File saved'}\n` +
+                        (result.dataUrl ? `Data URL: ${result.dataUrl.substring(0, 100)}...` : '')
+                    : `Failed to capture screenshot: ${result.error}`
+            }
+        ]
+    };
+});
+// ============================================================
+// Tool: auto_fix_loop
+// ============================================================
+server.tool('auto_fix_loop', 'Automatically detect and fix frontend errors in an iterative loop. ' +
+    'Combines console error checking, TypeScript diagnostics, and screenshot capture ' +
+    'to identify and fix issues automatically.\n\n' +
+    'Returns { success, iterations, errorsFixed, errorsRemaining, screenshots, messages, errors }.\n\n' +
+    'WHEN TO USE:\n' +
+    '- User wants to automatically fix all detected errors\n' +
+    '- User says "fix all errors" or "auto-fix this project"\n' +
+    '- Need iterative error detection and fixing\n' +
+    '- CI/CD automated error cleanup\n\n' +
+    'PREREQUISITE:\n' +
+    '- Chrome must be running with --remote-debugging-port=9222\n' +
+    '- Project must have TypeScript configuration for type checking\n' +
+    '- Start Chrome: chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-debug\n\n' +
+    'AFTER THIS TOOL:\n' +
+    '- Check the result for errorsFixed vs errorsRemaining\n' +
+    '- Review screenshots for visual context\n' +
+    '- If errors remain, run again with more iterations\n' +
+    '- Manual review may be needed for complex issues', {
+    projectDir: z
+        .string()
+        .optional()
+        .describe('Absolute path to the frontend project directory. Defaults to current working directory.'),
+    customPort: z
+        .number()
+        .optional()
+        .describe('Override the auto-detected dev server port number.'),
+    cdpPort: z
+        .number()
+        .optional()
+        .describe('Chrome DevTools Protocol port. Defaults to 9222.'),
+    maxIterations: z
+        .number()
+        .min(1)
+        .max(10)
+        .optional()
+        .describe('Maximum number of fix iterations. Defaults to 3.'),
+    timeoutPerIteration: z
+        .number()
+        .min(1000)
+        .max(120000)
+        .optional()
+        .describe('Timeout per iteration in milliseconds. Defaults to 30000.'),
+    stopOnSuccess: z
+        .boolean()
+        .optional()
+        .describe('Stop when no errors remain. Defaults to true.'),
+    screenshotOnError: z
+        .boolean()
+        .optional()
+        .describe('Take screenshot when errors detected. Defaults to true.'),
+    screenshotOnSuccess: z
+        .boolean()
+        .optional()
+        .describe('Take screenshot when all errors fixed. Defaults to false.'),
+    targetErrors: z
+        .array(z.string())
+        .optional()
+        .describe('Optional: filter to specific error messages. If omitted, fixes all errors.'),
+}, async (args) => {
+    const result = await handleAutoFixLoop(args);
+    const content = [
+        {
+            type: 'text',
+            text: `Auto-fix loop completed:\n` +
+                `Iterations: ${result.iterations}\n` +
+                `Errors fixed: ${result.errorsFixed}\n` +
+                `Errors remaining: ${result.errorsRemaining}\n` +
+                `Success: ${result.success ? '✅' : '❌'}\n\n` +
+                `Messages:\n${result.messages.join('\n')}`
+        }
+    ];
+    if (result.screenshots.length > 0) {
+        content.push({
+            type: 'text',
+            text: `\nScreenshots captured: ${result.screenshots.length}`
+        });
+    }
+    if (result.errors.length > 0) {
+        content.push({
+            type: 'text',
+            text: `\nErrors:\n${result.errors.join('\n')}`
+        });
+    }
+    return { content };
+});
+// ============================================================
 // Server startup
 // ============================================================
 export async function main() {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/types.d.ts

@@ -22,3 +22,9 @@ export interface MCPToolResponse {
     isError?: boolean;
     [key: string]: unknown;
 }
+export interface ToolContext {
+    chromeClient?: any;
+    projectDir?: string;
+    port?: number;
+    cdpPort?: number;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sudu-cli/fronted-preview-mcp",
-  "version": "1.0.0-beta.0",
+  "version": "1.0.0-beta.2",
   "description": "MCP server for frontend project detection, dev server management, and preview workflow. Pairs with chrome-devtools-mcp for automated frontend checking.",
   "type": "module",
   "main": "dist/index.js",
@@ -22,11 +22,14 @@
     "node": ">=18"
   },
   "dependencies": {
-    "@modelcontextprotocol/sdk": "^1.27.1"
+    "@modelcontextprotocol/sdk": "^1.27.1",
+    "chrome-remote-interface": "^0.34.0",
+    "ts-morph": "^28.0.0"
   },
   "devDependencies": {
-    "typescript": "^5.7.0",
-    "@types/node": "^22.0.0"
+    "@types/chrome-remote-interface": "^0.34.0",
+    "@types/node": "^22.0.0",
+    "typescript": "^5.7.0"
   },
   "publishConfig": {
     "access": "public"

package/templates/init/agent.md

@@ -1,26 +1,40 @@
 ---
-description: 前端页面预览检查专家，自动检测 console 错误和渲染问题
+description: 前端页面预览检查专家，自动检测 console 错误、TypeScript 类型错误和渲染问题
 mode: subagent
 permission:
   edit: deny
   bash: deny
 ---
 
-你是一个前端页面检查专家，专注于自动预览前端页面并报告问题。
+你是一个前端页面检查专家，专注于自动预览前端页面并报告问题，包括错误检测和自动修复。
 
 ## 工作流程
 
+### 页面预览检查工作流
 1. 调用 `quick_preview` 检测框架并启动 dev server
 2. 用 chrome-devtools `navigate_page` 打开返回的 URL
 3. 用 `list_console_messages` 检查 console 错误
 4. 用 `take_snapshot` 获取页面结构分析
 5. 汇总结果给用户
 
+### 错误检测与修复工作流
+1. 调用 `check_page_errors` 检测页面 console 错误和网络失败
+2. 调用 `get_typescript_diagnostics` 检测 TypeScript 类型错误
+3. 调用 `auto_fix_loop` 自动修复错误（可选）
+4. 汇总结果给用户
+
+### 元素分析与截图工作流
+1. 调用 `pick_element` 拾取页面元素获取详细信息
+2. 调用 `take_screenshot` 截图页面或特定元素
+3. 汇总结果给用户
+
 ## 工具路由
 
 | 场景 | 工具序列 |
 |------|---------|
 | "检查页面效果" | quick_preview → navigate_page → list_console_messages → take_snapshot |
+| "检查错误" | check_page_errors → get_typescript_diagnostics → auto_fix_loop（可选） |
+| "分析元素" | pick_element → take_screenshot（可选） |
 | "只看项目信息" | get_project_info（不启动服务） |
 | "停止 dev server" | stop_dev_server |
 
@@ -29,3 +43,5 @@ permission:
 - 不需要截图，take_snapshot 就够了
 - quick_preview 已包含检测，不要再调 get_project_info
 - 报告结果时说明：是否正常运行、是否有错误、页面结构
+- 使用 `auto_fix_loop` 时需要 Chrome 运行在调试模式（--remote-debugging-port=9222）
+- `pick_element` 支持直接传入 CSS 选择器，或进入交互式拾取模式

package/templates/init/instructions.md

@@ -13,21 +13,48 @@
 4. **chrome-devtools `take_snapshot`** — 获取页面无障碍结构树，分析渲染
 5. **汇总结果** — 告诉用户：页面运行状态、有无 console 错误、页面结构概况
 
+## 自动错误检测与修复工作流
+
+当用户想"检查错误"、"修复错误"、"自动修复"时，按照以下步骤：
+
+1. **`check_page_errors`** — 检测页面 console 错误和网络失败
+2. **`get_typescript_diagnostics`** — 检测 TypeScript 类型错误
+3. **`auto_fix_loop`** — 自动检测和修复错误（可选）
+4. **汇总结果** — 告诉用户：错误类型、数量、修复建议
+
+## 元素分析与截图工作流
+
+当用户想"分析元素"、"截图"、"查看样式"时，按照以下步骤：
+
+1. **`pick_element`** — 拾取页面元素获取详细信息
+2. **`take_screenshot`** — 截图页面或特定元素
+3. **汇总结果** — 告诉用户：元素信息、样式、截图结果
+
 ## 工具快速参考
 
 | 工具 | 用途 | 优先使用场景 |
 |------|------|------------|
+| **核心预览工具** |  |  |
 | `quick_preview` | 检测框架 + 启动 dev server | 大多数场景——一步到位 |
 | `get_project_info` | 仅检测框架信息 | 用户只问"这是什么项目" |
 | `start_dev_server` | 仅启动 dev server | 已知道框架时单独使用 |
 | `stop_dev_server` | 停止 dev server | 用户明确要求停止 |
-| chrome-devtools `navigate_page` | 打开 URL | 拿到 URL 后立即使用 |
-| chrome-devtools `list_console_messages` | 检查 console 错误 | 页面加载完成后 |
-| chrome-devtools `take_snapshot` | 获取页面结构 | 需要分析渲染结果时 |
-| chrome-devtools `take_screenshot` | 页面截图 | 用户明确要求视觉确认时 |
+| **错误检测工具** |  |  |
+| `check_page_errors` | 检测页面 console 错误和网络失败 | 检查页面是否有 JavaScript 错误 |
+| `get_typescript_diagnostics` | 检测 TypeScript 类型错误 | 检查代码类型错误和警告 |
+| `auto_fix_loop` | 自动检测和修复错误 | 自动修复所有检测到的错误 |
+| **元素分析工具** |  |  |
+| `pick_element` | 拾取页面元素获取详细信息 | 分析特定元素的信息和样式 |
+| **chrome-devtools** |  |  |
+| `chrome-devtools `navigate_page` | 打开 URL | 拿到 URL 后立即使用 |
+| `chrome-devtools `list_console_messages` | 检查 console 错误 | 页面加载完成后 |
+| `chrome-devtools `take_snapshot` | 获取页面结构 | 需要分析渲染结果时 |
+| `chrome-devtools `take_screenshot` | 页面截图 | 用户明确要求视觉确认时 |
 
 ## 注意
 
 - 默认不需要截图，`take_snapshot` 的无障碍树对 AI 已足够
 - `quick_preview` 已包含 framework 检测，不要再重复调 `get_project_info`
 - dev server 可以保持运行，不需要每次用完就关闭
+- 使用 `auto_fix_loop` 时需要 Chrome 运行在调试模式（--remote-debugging-port=9222）
+- `pick_element` 支持直接传入 CSS 选择器，或进入交互式拾取模式