ai-debug-local-mcp
Version:
🎯 ENHANCED AI GUIDANCE v4.1.2: Dramatically improved tool descriptions help AI users choose the right tools instead of 'close enough' options. Ultra-fast keyboard automation (10x speed), universal recording, multi-ecosystem debugging support, and compreh
473 lines • 16.2 kB
JavaScript
/**
* Enhanced Tool Examples
* Shows how existing ai-debug tools can be upgraded with rich metadata
*/
/**
* Example: Enhanced inject_debugging tool with rich metadata
*/
export const enhancedInjectDebugging = {
name: 'inject_debugging',
description: '🤖 REVOLUTIONARY SUB-AGENT: Auto-delegates to specialized Claude Code agents, saves up to 7500 tokens through context preservation, optimizes 4-8MB memory via project-aware framework detection. Supports 19+ frameworks with intelligent tool selection and zero workflow delay.',
inputSchema: {
type: 'object',
properties: {
url: {
type: 'string',
description: 'URL of the application to debug (e.g., http://localhost:3000)'
},
framework: {
type: 'string',
enum: ['auto', 'react', 'vue', 'angular', 'nextjs', 'nuxt', 'svelte', 'phoenix', 'rails', 'django', 'flutter-web'],
default: 'auto',
description: 'Web framework to optimize for (auto-detect if not specified)'
},
headless: {
type: 'boolean',
default: false,
description: 'Run browser in headless mode (default: false)'
}
},
required: ['url']
},
metadata: {
requiredContext: [
{
type: 'network_access',
description: 'Browser needs to access the specified URL',
critical: true
},
{
type: 'user_consent',
description: 'User should authorize browser automation',
critical: false
}
],
authority: 'user_interaction',
feedback: {
errorHandling: 'retry_with_context',
maxRetries: 3,
selfValidating: true,
successIndicators: ['session_id_returned', 'browser_connected', 'page_loaded']
},
bestUsedWhen: [
'Starting a new debugging session',
'Need to establish baseline application state',
'Want to enable real-time monitoring',
'Beginning systematic debugging workflow'
],
trainingDataRich: true,
costLevel: 'medium',
frameworkCompatibility: [
{ framework: 'react', compatibility: 'high' },
{ framework: 'vue', compatibility: 'high' },
{ framework: 'angular', compatibility: 'high' },
{ framework: 'nextjs', compatibility: 'high' },
{ framework: 'flutter', compatibility: 'medium', notes: 'Requires special handling for canvas elements' },
{ framework: 'phoenix', compatibility: 'high' },
{ framework: 'general', compatibility: 'high' }
],
category: 'core',
prerequisites: [
{
type: 'system_requirement',
description: 'Chrome browser available',
checkFunction: 'checkChromeAvailable'
},
{
type: 'state_condition',
description: 'No conflicting debug sessions active'
}
],
expectedOutcomes: [
{
type: 'data_collection',
description: 'Returns active session ID for subsequent operations',
measurable: true,
timeframe: 'immediate'
},
{
type: 'state_change',
description: 'Browser instance launched and connected to application',
measurable: true,
timeframe: 'immediate'
}
]
},
backgroundAgent: {
supportsBackground: false, // inject_debugging is a one-time setup tool
triggers: [],
resourceLimits: {
maxMemoryMB: 200,
maxCpuPercent: 20,
maxNetworkRequests: 10
}
}
};
/**
* Example: Enhanced take_screenshot tool with background monitoring capability
*/
export const enhancedTakeScreenshot = {
name: 'take_screenshot',
description: 'Capture screenshots of your local application for visual debugging and regression detection.',
inputSchema: {
type: 'object',
properties: {
sessionId: {
type: 'string',
description: 'Debug session ID'
},
fullPage: {
type: 'boolean',
default: true,
description: 'Capture full page (default: true)'
},
annotations: {
type: 'array',
items: {
type: 'object',
properties: {
type: { type: 'string', enum: ['arrow', 'highlight', 'text'] },
x: { type: 'number' },
y: { type: 'number' },
text: { type: 'string' }
}
},
description: 'Visual annotations to add to screenshot'
}
},
required: ['sessionId']
},
metadata: {
requiredContext: [
{
type: 'active_session',
description: 'Valid debug session must be active',
critical: true
}
],
authority: 'read_only',
feedback: {
errorHandling: 'retry_with_context',
maxRetries: 2,
selfValidating: true,
successIndicators: ['screenshot_path_returned', 'file_size_reasonable']
},
bestUsedWhen: [
'Documenting visual changes',
'Creating visual regression baselines',
'Capturing error states for analysis',
'Recording user interface states'
],
trainingDataRich: true,
costLevel: 'low',
frameworkCompatibility: [
{ framework: 'general', compatibility: 'high' }
],
category: 'interaction',
prerequisites: [
{
type: 'tool_execution',
description: 'inject_debugging must be called first',
checkFunction: 'checkActiveSession'
}
],
expectedOutcomes: [
{
type: 'data_collection',
description: 'Screenshot file saved with metadata',
measurable: true,
timeframe: 'immediate'
}
]
},
backgroundAgent: {
supportsBackground: true,
pollingInterval: 600000, // 10 minutes
triggers: [
{
type: 'file_change',
config: {
patterns: ['**/*.css', '**/*.scss', '**/*.tsx', '**/*.jsx', '**/*.vue'],
debounce: 30000
},
description: 'Take screenshot when visual files change'
},
{
type: 'user_activity',
config: { inactivityThreshold: 300000 }, // 5 minutes of inactivity
description: 'Capture state after user finishes making changes'
}
],
maxRuntime: 24 * 60 * 60 * 1000, // 24 hours
resourceLimits: {
maxMemoryMB: 100,
maxCpuPercent: 5,
maxNetworkRequests: 2
}
}
};
/**
* Example: Enhanced run_audit tool with comprehensive metadata
*/
export const enhancedRunAudit = {
name: 'run_audit',
description: 'Run comprehensive audits on the web page for accessibility, performance, SEO, security, and best practices. Returns detailed scores and actionable recommendations.',
inputSchema: {
type: 'object',
properties: {
sessionId: {
type: 'string',
description: 'Debug session ID'
},
categories: {
type: 'array',
items: {
type: 'string',
enum: ['all', 'accessibility', 'performance', 'seo', 'security', 'bestPractices']
},
default: ['all'],
description: 'Audit categories to run (default: all)'
},
professionalStandards: {
type: 'object',
properties: {
minimumAccessibilityScore: {
type: 'number',
default: 90,
description: 'Minimum accessibility score required (default: 90)'
}
},
description: 'Professional quality standards configuration'
}
},
required: ['sessionId']
},
metadata: {
requiredContext: [
{
type: 'active_session',
description: 'Valid debug session must be active',
critical: true
}
],
authority: 'read_only',
feedback: {
errorHandling: 'retry_with_context',
maxRetries: 2,
selfValidating: true,
successIndicators: ['audit_scores_returned', 'recommendations_provided']
},
bestUsedWhen: [
'Initial application assessment',
'Pre-deployment quality checks',
'Identifying accessibility violations',
'Performance optimization planning',
'Compliance verification'
],
trainingDataRich: true,
costLevel: 'high', // Comprehensive audits are resource-intensive
frameworkCompatibility: [
{ framework: 'general', compatibility: 'high' }
],
category: 'analysis',
prerequisites: [
{
type: 'tool_execution',
description: 'inject_debugging must be called first'
},
{
type: 'state_condition',
description: 'Page must be fully loaded'
}
],
expectedOutcomes: [
{
type: 'data_collection',
description: 'Comprehensive audit scores and recommendations',
measurable: true,
timeframe: 'short_term'
}
]
},
backgroundAgent: {
supportsBackground: true,
pollingInterval: 1800000, // 30 minutes
triggers: [
{
type: 'file_change',
config: {
patterns: ['**/*.tsx', '**/*.jsx', '**/*.vue', '**/*.html', '**/*.css'],
debounce: 120000 // 2 minutes
},
description: 'Run audit when significant UI changes detected'
},
{
type: 'performance_threshold',
config: {
lcp: 2500,
fcp: 1800,
cls: 0.1
},
description: 'Trigger audit when performance thresholds are exceeded'
}
],
maxRuntime: 8 * 60 * 60 * 1000, // 8 hours (don't run audits all day)
resourceLimits: {
maxMemoryMB: 300,
maxCpuPercent: 30,
maxNetworkRequests: 50
}
}
};
/**
* Example: Enhanced simulate_user_action tool with smart interaction patterns
*/
export const enhancedSimulateUserAction = {
name: 'simulate_user_action',
description: 'Simulate user interactions in the local browser. FREE: Basic actions. PREMIUM: AI-optimized interaction patterns.',
inputSchema: {
type: 'object',
properties: {
sessionId: {
type: 'string',
description: 'Debug session ID'
},
action: {
type: 'string',
enum: ['click', 'type', 'submit', 'scroll', 'hover', 'drag', 'select'],
description: 'Type of user action'
},
selector: {
type: 'string',
description: 'CSS selector for target element'
},
value: {
type: 'string',
description: 'Value for type actions'
},
coordinates: {
type: 'object',
properties: {
x: { type: 'number' },
y: { type: 'number' }
},
description: 'Coordinates for click actions (e.g., for Flutter canvas)'
},
waitForStability: {
type: 'boolean',
default: true,
description: 'Wait for DOM stability before action'
}
},
required: ['sessionId', 'action', 'selector']
},
metadata: {
requiredContext: [
{
type: 'active_session',
description: 'Valid debug session must be active',
critical: true
}
],
authority: 'user_interaction',
feedback: {
errorHandling: 'retry_with_context',
maxRetries: 3,
selfValidating: true,
successIndicators: ['action_completed', 'no_errors_thrown', 'expected_state_change']
},
bestUsedWhen: [
'Testing user workflows',
'Reproducing user-reported issues',
'Automated UI testing',
'Form submission testing',
'Navigation testing'
],
trainingDataRich: true,
costLevel: 'low',
frameworkCompatibility: [
{ framework: 'react', compatibility: 'high' },
{ framework: 'vue', compatibility: 'high' },
{ framework: 'angular', compatibility: 'high' },
{ framework: 'flutter', compatibility: 'medium', notes: 'May require coordinate-based interaction' },
{ framework: 'general', compatibility: 'high' }
],
category: 'interaction',
prerequisites: [
{
type: 'tool_execution',
description: 'inject_debugging must be called first'
},
{
type: 'state_condition',
description: 'Target element must be visible and interactable'
}
],
expectedOutcomes: [
{
type: 'state_change',
description: 'Application state changes according to user action',
measurable: true,
timeframe: 'immediate'
}
]
},
backgroundAgent: {
supportsBackground: false, // User actions are typically one-time operations
triggers: [],
resourceLimits: {
maxMemoryMB: 50,
maxCpuPercent: 10,
maxNetworkRequests: 5
}
}
};
/**
* Collection of enhanced tool examples
*/
export const enhancedToolExamples = [
enhancedInjectDebugging,
enhancedTakeScreenshot,
enhancedRunAudit,
enhancedSimulateUserAction
];
/**
* Utility function to convert existing tools to enhanced format
*/
export function enhanceExistingTool(existingTool, metadata) {
const defaultMetadata = {
requiredContext: [],
authority: 'read_only',
feedback: {
errorHandling: 'immediate_fail',
maxRetries: 1,
selfValidating: false,
successIndicators: []
},
bestUsedWhen: [],
trainingDataRich: false,
costLevel: 'medium',
frameworkCompatibility: [
{ framework: 'general', compatibility: 'medium' }
],
category: 'core',
prerequisites: [],
expectedOutcomes: []
};
return {
name: existingTool.name,
description: existingTool.description,
inputSchema: existingTool.inputSchema,
metadata: { ...defaultMetadata, ...metadata },
backgroundAgent: {
supportsBackground: false,
triggers: [],
resourceLimits: {
maxMemoryMB: 50,
maxCpuPercent: 5,
maxNetworkRequests: 10
}
}
};
}
//# sourceMappingURL=enhanced-tool-examples.js.map