chrome-cdp-cli 1.1.0 → 1.2.1

package/README.md

@@ -12,6 +12,7 @@ A powerful command-line tool for controlling Chrome browser instances via the Ch
 - 📊 **Console Monitoring**: Real-time console message capture with filtering and storage
 - 🌐 **Network Monitoring**: Real-time network request/response monitoring with comprehensive filtering
 - 🔧 **CLI Interface**: Full command-line interface with argument parsing and routing
+- 🛠️ **IDE Integration**: Install Cursor commands and Claude skills with directory validation and --force option
 - 📦 **Build System**: Complete TypeScript build pipeline with testing framework
 
 ### 🚧 Eval Workaround Available
@@ -127,6 +128,10 @@ chrome-cdp-cli get_console_message
 # Monitor network requests
 chrome-cdp-cli get_network_request
 
+# Install IDE integrations
+chrome-cdp-cli install-cursor-command
+chrome-cdp-cli install-claude-skill --skill-type personal
+
 # Get help for all commands
 chrome-cdp-cli --help
 
@@ -223,6 +228,32 @@ chrome-cdp-cli list_network_requests
 chrome-cdp-cli list_network_requests --filter '{"methods":["POST"],"statusCodes":[200,201]}'
 ```
 
+#### IDE Integration
+```bash
+# Install Cursor command (creates .cursor/commands/cdp-cli.md)
+chrome-cdp-cli install-cursor-command
+
+# Install Cursor command with --force (bypasses directory validation)
+chrome-cdp-cli install-cursor-command --force
+
+# Install Claude skill for project (creates .claude/skills/cdp-cli/SKILL.md)
+chrome-cdp-cli install-claude-skill
+
+# Install Claude skill for personal use (creates ~/.claude/skills/cdp-cli/SKILL.md)
+chrome-cdp-cli install-claude-skill --skill-type personal
+
+# Install Claude skill with examples and references
+chrome-cdp-cli install-claude-skill --include-examples --include-references
+
+# Install with custom directory
+chrome-cdp-cli install-cursor-command --target-directory /custom/path/.cursor/commands
+chrome-cdp-cli install-claude-skill --target-directory /custom/path/.claude/skills
+
+# Force install (bypasses directory validation)
+chrome-cdp-cli install-cursor-command --force
+chrome-cdp-cli install-claude-skill --force
+```
+
 ### 🚧 Available via Eval Workarounds
 
 #### Page Management

package/dist/cli/CLIApplication.js

@@ -19,6 +19,10 @@ class CLIApplication {
         this.cli.registerHandler(new handlers_1.TakeSnapshotHandler());
         this.cli.registerHandler(new handlers_1.GetConsoleMessageHandler());
         this.cli.registerHandler(new handlers_1.ListConsoleMessagesHandler());
+        this.cli.registerHandler(new handlers_1.GetNetworkRequestHandler());
+        this.cli.registerHandler(new handlers_1.ListNetworkRequestsHandler());
+        this.cli.registerHandler(new handlers_1.InstallCursorCommandHandler());
+        this.cli.registerHandler(new handlers_1.InstallClaudeSkillHandler());
     }
     async run(argv) {
         try {
@@ -37,7 +41,13 @@ class CLIApplication {
         }
     }
     needsConnection(commandName) {
-        const noConnectionCommands = ['help', 'connect', 'disconnect'];
+        const noConnectionCommands = [
+            'help',
+            'connect',
+            'disconnect',
+            'install_cursor_command',
+            'install_claude_skill'
+        ];
         return !noConnectionCommands.includes(commandName);
     }
     async ensureConnection(command) {

package/dist/cli/CLIInterface.js

@@ -291,6 +291,26 @@ class CLIInterface {
                 if (args[0])
                     commandArgs.command = args[0];
                 break;
+            case 'install_cursor_command':
+                if (options['target-directory'])
+                    commandArgs.targetDirectory = options['target-directory'];
+                if (options['include-examples'] !== undefined)
+                    commandArgs.includeExamples = options['include-examples'] !== 'false';
+                if (options['force'])
+                    commandArgs.force = true;
+                break;
+            case 'install_claude_skill':
+                if (options['skill-type'])
+                    commandArgs.skillType = options['skill-type'];
+                if (options['target-directory'])
+                    commandArgs.targetDirectory = options['target-directory'];
+                if (options['include-examples'] !== undefined)
+                    commandArgs.includeExamples = options['include-examples'] !== 'false';
+                if (options['include-references'] !== undefined)
+                    commandArgs.includeReferences = options['include-references'] !== 'false';
+                if (options['force'])
+                    commandArgs.force = true;
+                break;
             default:
                 args.forEach((arg, index) => {
                     commandArgs[`arg${index}`] = arg;

package/dist/cli/CommandRouter.js

@@ -69,7 +69,13 @@ class CommandRouter {
         }
     }
     isSpecialCommand(commandName) {
-        const specialCommands = ['help', 'connect', 'disconnect'];
+        const specialCommands = [
+            'help',
+            'connect',
+            'disconnect',
+            'install_cursor_command',
+            'install_claude_skill'
+        ];
         return specialCommands.includes(commandName);
     }
     async executeSpecialCommand(command) {
@@ -80,6 +86,17 @@ class CommandRouter {
                 return this.executeConnectCommand(command);
             case 'disconnect':
                 return this.executeDisconnectCommand();
+            case 'install_cursor_command':
+            case 'install_claude_skill':
+                const handler = this.registry.get(command.name);
+                if (!handler) {
+                    return {
+                        success: false,
+                        error: `Handler not found for command: ${command.name}`,
+                        exitCode: ExitCode.INVALID_COMMAND
+                    };
+                }
+                return await handler.execute(null, command.args);
             default:
                 return {
                     success: false,
@@ -229,6 +246,8 @@ For more information about a specific command, use:
             'snapshot': 'Capture DOM snapshot with structure and styles',
             'console-messages': 'Get console messages',
             'network-requests': 'Get network requests',
+            'install_cursor_command': 'Install Cursor IDE commands for Chrome automation',
+            'install_claude_skill': 'Install Claude Code skill for Chrome automation',
             'help': 'Show help information'
         };
         return descriptions[commandName] || 'No description available';

package/dist/handlers/InstallClaudeSkillHandler.js

@@ -0,0 +1,423 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InstallClaudeSkillHandler = void 0;
+const fs = __importStar(require("fs/promises"));
+const path = __importStar(require("path"));
+const os = __importStar(require("os"));
+const logger_1 = require("../utils/logger");
+class InstallClaudeSkillHandler {
+    constructor() {
+        this.name = 'install_claude_skill';
+    }
+    async execute(_client, args) {
+        try {
+            const skillType = args.skillType || 'project';
+            const targetDir = args.targetDirectory || this.getDefaultSkillDirectory(skillType);
+            const skillDir = path.join(targetDir, 'cdp-cli');
+            if (!args.targetDirectory && !args.force) {
+                if (skillType === 'project') {
+                    const claudeDirExists = await this.checkDirectoryExists('.claude');
+                    if (!claudeDirExists) {
+                        return {
+                            success: false,
+                            error: `Warning: No .claude directory found in current directory. This may not be a project root directory.
+
+To install Claude skills:
+1. Navigate to your project root directory (where .claude folder should be), or
+2. Use --skill-type personal to install to your home directory, or  
+3. Use --target-directory to specify a custom location, or
+4. Use --force to install anyway
+
+Examples:
+  chrome-cdp-cli install-claude-skill --skill-type personal
+  chrome-cdp-cli install-claude-skill --target-directory /path/to/.claude/skills
+  chrome-cdp-cli install-claude-skill --force`
+                        };
+                    }
+                }
+            }
+            await this.ensureDirectory(skillDir);
+            const skillConfig = this.generateClaudeSkill();
+            const skillPath = path.join(skillDir, 'SKILL.md');
+            await fs.writeFile(skillPath, this.generateSkillMarkdown(skillConfig), 'utf8');
+            logger_1.logger.info(`Created Claude skill: ${skillPath}`);
+            const createdFiles = ['SKILL.md'];
+            if (args.includeExamples) {
+                const examplesPath = path.join(skillDir, 'examples.md');
+                await fs.writeFile(examplesPath, this.generateExamplesMarkdown(), 'utf8');
+                createdFiles.push('examples.md');
+                logger_1.logger.info(`Created examples file: ${examplesPath}`);
+            }
+            if (args.includeReferences) {
+                const referencePath = path.join(skillDir, 'reference.md');
+                await fs.writeFile(referencePath, this.generateReferenceMarkdown(), 'utf8');
+                createdFiles.push('reference.md');
+                logger_1.logger.info(`Created reference file: ${referencePath}`);
+            }
+            return {
+                success: true,
+                data: {
+                    skillType,
+                    directory: skillDir,
+                    files: createdFiles,
+                    skillName: skillConfig.name
+                }
+            };
+        }
+        catch (error) {
+            logger_1.logger.error('Failed to install Claude skill:', error);
+            return {
+                success: false,
+                error: error instanceof Error ? error.message : 'Unknown error occurred'
+            };
+        }
+    }
+    async checkDirectoryExists(dirPath) {
+        try {
+            await fs.access(dirPath);
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }
+    async ensureDirectory(dirPath) {
+        try {
+            await fs.access(dirPath);
+        }
+        catch {
+            await fs.mkdir(dirPath, { recursive: true });
+            logger_1.logger.info(`Created directory: ${dirPath}`);
+        }
+    }
+    getDefaultSkillDirectory(skillType) {
+        return skillType === 'personal'
+            ? path.join(os.homedir(), '.claude', 'skills')
+            : '.claude/skills';
+    }
+    generateClaudeSkill() {
+        return {
+            name: 'cdp-cli',
+            description: 'Chrome browser automation and testing using DevTools Protocol. Use when user needs to control Chrome browser, execute JavaScript, take screenshots, monitor console/network, or perform web automation tasks.',
+            instructions: `# Chrome Browser Automation
+
+## Instructions
+Use this skill when the user needs to:
+- Execute JavaScript code in Chrome browser
+- Take screenshots of web pages
+- Capture DOM snapshots with layout information
+- Monitor console messages and network requests
+- Perform web automation and testing
+
+## Available Commands
+1. **eval**: Execute JavaScript code in browser context
+2. **screenshot**: Capture page screenshots
+3. **snapshot**: Capture complete DOM snapshots
+4. **get_console_message**: Get latest console message
+5. **list_console_messages**: List all console messages
+6. **get_network_request**: Get latest network request
+7. **list_network_requests**: List all network requests
+
+## Usage Examples
+- Execute: chrome-cdp-cli eval "document.title"
+- Screenshot: chrome-cdp-cli screenshot --filename page.png
+- Console: chrome-cdp-cli get_console_message
+- Network: chrome-cdp-cli list_network_requests
+
+## Prerequisites
+Chrome browser must be running with DevTools enabled:
+chrome --remote-debugging-port=9222`,
+            allowedTools: ['Execute', 'Read', 'Write']
+        };
+    }
+    generateSkillMarkdown(skill) {
+        const frontmatter = `---
+name: ${skill.name}
+description: ${skill.description}
+${skill.allowedTools ? `allowedTools: [${skill.allowedTools.map(t => `"${t}"`).join(', ')}]` : ''}
+---
+
+`;
+        return frontmatter + skill.instructions;
+    }
+    generateExamplesMarkdown() {
+        return `# Chrome Automation Examples
+
+## Basic JavaScript Execution
+
+### Get Page Information
+\`\`\`bash
+chrome-cdp-cli eval "document.title"
+chrome-cdp-cli eval "window.location.href"
+chrome-cdp-cli eval "document.querySelectorAll('a').length"
+\`\`\`
+
+### Interact with Elements
+\`\`\`bash
+chrome-cdp-cli eval "document.querySelector('#button').click()"
+chrome-cdp-cli eval "document.querySelector('#input').value = 'Hello World'"
+chrome-cdp-cli eval "document.querySelector('#form').submit()"
+\`\`\`
+
+### Async Operations
+\`\`\`bash
+chrome-cdp-cli eval "fetch('/api/data').then(r => r.json())"
+chrome-cdp-cli eval "new Promise(resolve => setTimeout(() => resolve('Done'), 1000))"
+\`\`\`
+
+## Visual Capture
+
+### Screenshots
+\`\`\`bash
+chrome-cdp-cli screenshot --filename homepage.png
+chrome-cdp-cli screenshot --filename fullpage.png --fullpage
+\`\`\`
+
+### DOM Snapshots
+\`\`\`bash
+chrome-cdp-cli snapshot --filename page-structure.json
+\`\`\`
+
+## Monitoring
+
+### Console Messages
+\`\`\`bash
+chrome-cdp-cli get_console_message
+chrome-cdp-cli list_console_messages --type error
+\`\`\`
+
+### Network Requests
+\`\`\`bash
+chrome-cdp-cli get_network_request
+chrome-cdp-cli list_network_requests --method POST
+\`\`\`
+
+## Common Workflows
+
+### Testing Form Submission
+\`\`\`bash
+# Fill form
+chrome-cdp-cli eval "document.querySelector('#email').value = 'test@example.com'"
+chrome-cdp-cli eval "document.querySelector('#password').value = 'password123'"
+
+# Submit and capture
+chrome-cdp-cli eval "document.querySelector('#submit').click()"
+chrome-cdp-cli screenshot --filename after-submit.png
+
+# Check for errors
+chrome-cdp-cli list_console_messages --type error
+\`\`\`
+
+### API Testing
+\`\`\`bash
+# Make API call
+chrome-cdp-cli eval "fetch('/api/users', {method: 'POST', body: JSON.stringify({name: 'John'}), headers: {'Content-Type': 'application/json'}})"
+
+# Monitor network
+chrome-cdp-cli list_network_requests --method POST
+
+# Check response
+chrome-cdp-cli get_network_request
+\`\`\`
+`;
+    }
+    generateReferenceMarkdown() {
+        return `# Chrome DevTools CLI Reference
+
+## Command Reference
+
+### eval
+Execute JavaScript code in the browser context.
+
+**Syntax:** \`chrome-cdp-cli eval <expression>\`
+
+**Options:**
+- \`--timeout <ms>\`: Execution timeout in milliseconds
+- \`--await-promise\`: Wait for Promise resolution (default: true)
+
+**Examples:**
+- \`chrome-cdp-cli eval "document.title"\`
+- \`chrome-cdp-cli eval "fetch('/api').then(r => r.text())"\`
+
+### screenshot
+Capture a screenshot of the current page.
+
+**Syntax:** \`chrome-cdp-cli screenshot [options]\`
+
+**Options:**
+- \`--filename <path>\`: Output filename (default: screenshot.png)
+- \`--fullpage\`: Capture full page instead of viewport
+- \`--quality <0-100>\`: JPEG quality (default: 90)
+
+### snapshot
+Capture a complete DOM snapshot with layout information.
+
+**Syntax:** \`chrome-cdp-cli snapshot [options]\`
+
+**Options:**
+- \`--filename <path>\`: Output filename (default: snapshot.json)
+- \`--include-styles\`: Include computed styles (default: true)
+- \`--include-layout\`: Include layout information (default: true)
+
+### get_console_message
+Get the latest console message.
+
+**Syntax:** \`chrome-cdp-cli get_console_message [options]\`
+
+**Options:**
+- \`--type <log|info|warn|error>\`: Filter by message type
+
+### list_console_messages
+List all console messages.
+
+**Syntax:** \`chrome-cdp-cli list_console_messages [options]\`
+
+**Options:**
+- \`--type <log|info|warn|error>\`: Filter by message type
+- \`--limit <number>\`: Maximum number of messages to return
+
+### get_network_request
+Get the latest network request.
+
+**Syntax:** \`chrome-cdp-cli get_network_request [options]\`
+
+**Options:**
+- \`--method <GET|POST|PUT|DELETE>\`: Filter by HTTP method
+
+### list_network_requests
+List all network requests.
+
+**Syntax:** \`chrome-cdp-cli list_network_requests [options]\`
+
+**Options:**
+- \`--method <GET|POST|PUT|DELETE>\`: Filter by HTTP method
+- \`--limit <number>\`: Maximum number of requests to return
+
+## Global Options
+
+- \`--host <hostname>\`: Chrome DevTools host (default: localhost)
+- \`--port <number>\`: Chrome DevTools port (default: 9222)
+- \`--output-format <json|text>\`: Output format (default: json)
+- \`--verbose\`: Enable verbose logging
+- \`--quiet\`: Suppress non-error output
+- \`--timeout <ms>\`: Global timeout for operations
+
+## Chrome Setup
+
+### Starting Chrome with DevTools
+\`\`\`bash
+# Linux/Windows
+chrome --remote-debugging-port=9222
+
+# macOS
+/Applications/Google\\ Chrome.app/Contents/MacOS/Google\\ Chrome --remote-debugging-port=9222
+
+# With additional options
+chrome --remote-debugging-port=9222 --disable-web-security --user-data-dir=/tmp/chrome-debug
+\`\`\`
+
+### Headless Mode
+\`\`\`bash
+chrome --headless --remote-debugging-port=9222
+\`\`\`
+
+## Error Handling
+
+### Common Errors
+- **Connection refused**: Chrome is not running or DevTools port is incorrect
+- **Target not found**: No active tab or page available
+- **JavaScript error**: Syntax error or runtime exception in eval expression
+- **Timeout**: Operation took longer than specified timeout
+
+### Debugging Tips
+- Use \`--verbose\` flag for detailed logging
+- Check Chrome DevTools at \`http://localhost:9222\` for available targets
+- Verify JavaScript syntax before executing with eval
+- Use shorter timeouts for testing, longer for complex operations
+
+## Integration Examples
+
+### CI/CD Pipeline
+\`\`\`yaml
+# GitHub Actions example
+- name: Test web application
+  run: |
+    # Start Chrome
+    google-chrome --headless --remote-debugging-port=9222 &
+    
+    # Wait for Chrome to start
+    sleep 2
+    
+    # Navigate to application
+    chrome-cdp-cli eval "window.location.href = 'http://localhost:3000'"
+    
+    # Run tests
+    chrome-cdp-cli eval "document.querySelector('#test-button').click()"
+    chrome-cdp-cli screenshot --filename test-result.png
+    
+    # Check for errors
+    chrome-cdp-cli list_console_messages --type error
+\`\`\`
+
+### Automated Testing
+\`\`\`bash
+#!/bin/bash
+# test-script.sh
+
+# Start Chrome in background
+chrome --headless --remote-debugging-port=9222 &
+CHROME_PID=$!
+
+# Wait for Chrome to start
+sleep 2
+
+# Run tests
+chrome-cdp-cli eval "window.location.href = 'http://localhost:3000'"
+chrome-cdp-cli eval "document.querySelector('#login-form input[name=username]').value = 'testuser'"
+chrome-cdp-cli eval "document.querySelector('#login-form input[name=password]').value = 'testpass'"
+chrome-cdp-cli eval "document.querySelector('#login-form').submit()"
+
+# Capture results
+chrome-cdp-cli screenshot --filename login-test.png
+chrome-cdp-cli list_console_messages --type error > errors.log
+
+# Cleanup
+kill $CHROME_PID
+\`\`\`
+`;
+    }
+}
+exports.InstallClaudeSkillHandler = InstallClaudeSkillHandler;

package/dist/handlers/InstallCursorCommandHandler.js

@@ -0,0 +1,280 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InstallCursorCommandHandler = void 0;
+const fs = __importStar(require("fs/promises"));
+const path = __importStar(require("path"));
+const logger_1 = require("../utils/logger");
+class InstallCursorCommandHandler {
+    constructor() {
+        this.name = 'install_cursor_command';
+    }
+    async execute(_client, args) {
+        try {
+            const targetDir = args.targetDirectory || '.cursor/commands';
+            if (!args.targetDirectory && targetDir === '.cursor/commands' && !args.force) {
+                const cursorDirExists = await this.checkDirectoryExists('.cursor');
+                if (!cursorDirExists) {
+                    return {
+                        success: false,
+                        error: `Warning: No .cursor directory found in current directory. This may not be a Cursor project root directory.
+
+To install Cursor commands:
+1. Navigate to your Cursor project root directory (where .cursor folder should be)
+2. Run the command again, or
+3. Use --target-directory to specify a custom location, or
+4. Use --force to install anyway
+
+Examples:
+  chrome-cdp-cli install-cursor-command --target-directory /path/to/.cursor/commands
+  chrome-cdp-cli install-cursor-command --force`
+                    };
+                }
+            }
+            await this.ensureDirectory(targetDir);
+            const commands = this.generateCursorCommands();
+            const createdFiles = [];
+            for (const command of commands) {
+                const filePath = path.join(targetDir, `${command.name}.md`);
+                const content = this.generateCommandMarkdown(command);
+                await fs.writeFile(filePath, content, 'utf8');
+                createdFiles.push(filePath);
+                logger_1.logger.info(`Created Cursor command: ${filePath}`);
+            }
+            return {
+                success: true,
+                data: {
+                    installed: commands.length,
+                    directory: targetDir,
+                    commands: commands.map(c => c.name),
+                    files: createdFiles
+                }
+            };
+        }
+        catch (error) {
+            logger_1.logger.error('Failed to install Cursor commands:', error);
+            return {
+                success: false,
+                error: error instanceof Error ? error.message : 'Unknown error occurred'
+            };
+        }
+    }
+    async checkDirectoryExists(dirPath) {
+        try {
+            await fs.access(dirPath);
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }
+    async ensureDirectory(dirPath) {
+        try {
+            await fs.access(dirPath);
+        }
+        catch {
+            await fs.mkdir(dirPath, { recursive: true });
+            logger_1.logger.info(`Created directory: ${dirPath}`);
+        }
+    }
+    generateCursorCommands() {
+        return [
+            {
+                name: 'cdp-cli',
+                description: 'Chrome DevTools Protocol CLI 工具',
+                instructions: `通过 Chrome DevTools Protocol 控制 Chrome 浏览器，支持多种自动化操作。
+
+## 功能列表
+
+### 1. JavaScript 执行 (eval)
+执行 JavaScript 代码并返回结果，支持异步代码和 Promise。
+
+**用途：**
+- 获取页面信息（标题、URL、元素等）
+- 修改页面内容和样式
+- 执行复杂的 JavaScript 逻辑
+- 与页面元素交互
+
+**示例：**
+- \`chrome-cdp-cli eval "document.title"\`
+- \`chrome-cdp-cli eval "window.location.href"\`
+- \`chrome-cdp-cli eval "document.querySelector('#button').click()"\`
+- \`chrome-cdp-cli eval "fetch('/api/data').then(r => r.json())"\`
+
+### 2. 页面截图 (screenshot)
+捕获当前页面的截图并保存到指定文件。
+
+**功能：**
+- 指定文件名和路径
+- 全页面截图或视口截图
+- 自定义图片质量和格式
+- 输出 PNG 格式文件
+
+**示例：**
+- \`chrome-cdp-cli screenshot --filename screenshot.png\`
+- \`chrome-cdp-cli screenshot --filename fullpage.png --full-page\`
+- \`chrome-cdp-cli screenshot --filename reports/page-capture.png\`
+
+### 3. DOM 快照 (snapshot)
+捕获包含 DOM 结构、样式和布局信息的完整快照。
+
+**包含内容：**
+- 完整的 DOM 树结构
+- 计算后的 CSS 样式
+- 元素布局信息
+- 元素属性和文本内容
+
+**示例：**
+- \`chrome-cdp-cli snapshot --filename dom-snapshot.json\`
+- \`chrome-cdp-cli snapshot --filename page-structure.json\`
+
+### 4. 控制台监控 (console)
+获取浏览器控制台的消息，包括日志、警告和错误。
+
+**功能：**
+- 获取最新的控制台消息
+- 列出所有控制台消息
+- 按类型过滤消息（log、warn、error）
+- 调试和监控页面运行状态
+
+**示例：**
+- \`chrome-cdp-cli get_console_message\`
+- \`chrome-cdp-cli list_console_messages --type error\`
+
+### 5. 网络请求监控 (network)
+监控和获取页面的网络请求信息。
+
+**功能：**
+- 获取最新的网络请求
+- 列出所有网络请求
+- 按方法过滤请求（GET、POST 等）
+- 查看请求和响应详情
+- 分析页面的网络行为和 API 调用
+
+**示例：**
+- \`chrome-cdp-cli get_network_request\`
+- \`chrome-cdp-cli list_network_requests --method POST\`
+
+命令会自动连接到运行在 localhost:9222 的 Chrome 实例。`,
+                examples: [
+                    'chrome-cdp-cli eval "document.title"',
+                    'chrome-cdp-cli screenshot --filename page.png',
+                    'chrome-cdp-cli snapshot --filename dom.json',
+                    'chrome-cdp-cli get_console_message',
+                    'chrome-cdp-cli list_network_requests'
+                ]
+            }
+        ];
+    }
+    generateCommandMarkdown(command) {
+        const examples = command.examples.map(example => `- ${example}`).join('\n');
+        return `# ${command.description}
+
+${command.instructions}
+
+## 使用示例
+
+${examples}
+
+## 前置条件
+
+确保 Chrome 浏览器已启动并开启了远程调试：
+
+\`\`\`bash
+chrome --remote-debugging-port=9222
+\`\`\`
+
+或者在 macOS 上：
+
+\`\`\`bash
+/Applications/Google\\ Chrome.app/Contents/MacOS/Google\\ Chrome --remote-debugging-port=9222
+\`\`\`
+
+## 全局选项
+
+所有命令都支持以下全局选项：
+
+- \`--host <hostname>\`: Chrome DevTools 主机地址 (默认: localhost)
+- \`--port <number>\`: Chrome DevTools 端口 (默认: 9222)
+- \`--format <json|text>\`: 输出格式 (默认: json)
+- \`--verbose\`: 启用详细日志
+- \`--quiet\`: 静默模式
+- \`--timeout <ms>\`: 命令超时时间
+
+## 常用工作流程
+
+### 网页自动化测试
+\`\`\`bash
+# 1. 导航到页面并截图
+chrome-cdp-cli eval "window.location.href = 'https://example.com'"
+chrome-cdp-cli screenshot --filename before.png
+
+# 2. 填写表单
+chrome-cdp-cli eval "document.querySelector('#email').value = 'test@example.com'"
+chrome-cdp-cli eval "document.querySelector('#password').value = 'password123'"
+
+# 3. 提交并检查结果
+chrome-cdp-cli eval "document.querySelector('#submit').click()"
+chrome-cdp-cli screenshot --filename after.png
+chrome-cdp-cli list_console_messages --type error
+\`\`\`
+
+### API 调用监控
+\`\`\`bash
+# 1. 开始监控网络请求
+chrome-cdp-cli eval "fetch('/api/users').then(r => r.json())"
+
+# 2. 查看网络请求
+chrome-cdp-cli list_network_requests --method POST
+
+# 3. 获取最新请求详情
+chrome-cdp-cli get_network_request
+\`\`\`
+
+### 页面分析
+\`\`\`bash
+# 1. 获取页面基本信息
+chrome-cdp-cli eval "({title: document.title, url: location.href, links: document.querySelectorAll('a').length})"
+
+# 2. 捕获完整页面结构
+chrome-cdp-cli snapshot --filename page-analysis.json
+
+# 3. 检查控制台错误
+chrome-cdp-cli list_console_messages --type error
+\`\`\`
+`;
+    }
+}
+exports.InstallCursorCommandHandler = InstallCursorCommandHandler;

package/dist/handlers/index.js

@@ -21,3 +21,5 @@ __exportStar(require("./GetConsoleMessageHandler"), exports);
 __exportStar(require("./ListConsoleMessagesHandler"), exports);
 __exportStar(require("./GetNetworkRequestHandler"), exports);
 __exportStar(require("./ListNetworkRequestsHandler"), exports);
+__exportStar(require("./InstallCursorCommandHandler"), exports);
+__exportStar(require("./InstallClaudeSkillHandler"), exports);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "chrome-cdp-cli",
-  "version": "1.1.0",
-  "description": "Command-line tool for controlling Chrome browser instances via the Chrome DevTools Protocol. Core features: JavaScript execution, screenshot capture, DOM snapshots, console/network monitoring. Additional features available via eval workarounds.",
+  "version": "1.2.1",
+  "description": "Command-line tool for controlling Chrome browser via Chrome DevTools Protocol. Features: JavaScript execution, screenshots, DOM snapshots, console/network monitoring, IDE integration (Cursor commands & Claude skills). Install IDE tools with --force option for directory validation bypass.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "bin": {