@crownpeak/dqm-react-component-dev-mcp 1.2.0

package/data/probe/npm/tests/fixtures/sampleDiagrams.js

@@ -0,0 +1,267 @@
+/**
+ * Test fixtures for Mermaid diagrams and JSON responses
+ * Used across multiple test files for consistency
+ */
+
+export const validMermaidDiagrams = {
+  flowchart: {
+    simple: `graph TD
+    A[Start] --> B[Process]
+    B --> C[End]`,
+    
+    complex: `graph TD
+    A[Start] --> B{Decision}
+    B -->|Yes| C[Process A]
+    B -->|No| D[Process B]
+    C --> E[End]
+    D --> E`,
+    
+    withStyling: `graph TD
+    A[Start] --> B[Process]
+    B --> C[End]
+    style A fill:#f9f,stroke:#333,stroke-width:4px`
+  },
+
+  sequence: {
+    simple: `sequenceDiagram
+    Alice->>Bob: Hello Bob, how are you?
+    Bob-->>Alice: Great!`,
+    
+    complex: `sequenceDiagram
+    participant Alice
+    participant Bob
+    participant Carol
+    
+    Alice->>Bob: Hello Bob
+    Bob->>Carol: Hello Carol
+    Carol-->>Bob: Hi Bob
+    Bob-->>Alice: Hi Alice`,
+    
+    withActivation: `sequenceDiagram
+    Alice->>+Bob: Request
+    Bob-->>-Alice: Response`
+  },
+
+  gantt: `gantt
+    title A Gantt Diagram
+    dateFormat  YYYY-MM-DD
+    section Section
+    A task           :a1, 2014-01-01, 30d
+    Another task     :after a1, 20d`,
+
+  pie: `pie title Pets adopted by volunteers
+    "Dogs" : 386
+    "Cats" : 85.9
+    "Rats" : 15`,
+
+  state: `stateDiagram-v2
+    [*] --> Still
+    Still --> [*]
+    Still --> Moving
+    Moving --> Still
+    Moving --> Crash
+    Crash --> [*]`,
+
+  class: `classDiagram
+    Animal <|-- Duck
+    Animal <|-- Fish
+    Animal <|-- Zebra
+    Animal : +int age
+    Animal : +String gender
+    Animal: +isMammal()
+    Animal: +mate()
+    class Duck{
+        +String beakColor
+        +swim()
+        +quack()
+    }`
+};
+
+export const invalidMermaidDiagrams = {
+  unknownType: 'unknownDiagram\n    some content',
+  
+  missingBracket: `graph TD
+    A[Start --> B[Process]
+    B --> C[End]`,
+    
+  missingColon: `sequenceDiagram
+    Alice->>Bob Hello world
+    Bob-->>Alice: Response`,
+    
+  malformedSyntax: 'this is not a valid mermaid diagram',
+  
+  withCodeBlocks: `\`\`\`mermaid
+graph TD
+    A --> B
+\`\`\``,
+  
+  empty: '',
+  whitespaceOnly: '   \n\t   '
+};
+
+export const validJsonResponses = {
+  simple: '{"test": "value"}',
+  
+  complex: `{
+    "users": [
+      {"id": 1, "name": "Alice", "active": true},
+      {"id": 2, "name": "Bob", "active": false}
+    ],
+    "total": 2,
+    "metadata": {
+      "timestamp": "2023-01-01T00:00:00Z",
+      "version": "1.0"
+    }
+  }`,
+  
+  array: '[1, 2, 3, {"nested": true}]',
+  primitives: {
+    null: 'null',
+    boolean: 'true',
+    number: '42',
+    string: '"hello world"'
+  }
+};
+
+export const invalidJsonResponses = {
+  missingQuotes: '{"test": value}',
+  trailingComma: '{"test": "value",}',
+  unquotedKeys: '{test: "value"}',
+  incomplete: '{"test":',
+  malformed: '{"test":: "value"}',
+  empty: '',
+  whitespace: '   \n\t   '
+};
+
+export const mixedResponses = {
+  validBoth: `Here's the analysis:
+
+\`\`\`json
+{
+  "status": "completed",
+  "diagram_count": 1
+}
+\`\`\`
+
+\`\`\`mermaid
+graph TD
+    A[Analysis] --> B[Results]
+    B --> C[Complete]
+\`\`\``,
+
+  validJsonInvalidMermaid: `Here's the analysis:
+
+\`\`\`json
+{
+  "status": "completed",
+  "errors": []
+}
+\`\`\`
+
+\`\`\`mermaid
+invalid diagram syntax
+\`\`\``,
+
+  invalidJsonValidMermaid: `Here's the analysis:
+
+\`\`\`json
+{
+  "status": completed,
+  "errors": []
+}
+\`\`\`
+
+\`\`\`mermaid
+graph TD
+    A[Start] --> B[End]
+\`\`\``,
+
+  invalidBoth: `Here's the analysis:
+
+\`\`\`json
+{
+  "status": completed
+  "errors": []
+}
+\`\`\`
+
+\`\`\`mermaid
+unknown diagram type
+    invalid syntax
+\`\`\``,
+
+  multipleDiagrams: `Multiple diagrams:
+
+\`\`\`mermaid
+graph TD
+    A --> B
+\`\`\`
+
+\`\`\`mermaid
+sequenceDiagram
+    Alice->>Bob: Hello
+\`\`\`
+
+\`\`\`mermaid
+pie title Test
+    "A" : 50
+    "B" : 50
+\`\`\``
+};
+
+export const schemas = {
+  jsonOnly: '{"type": "object", "properties": {"name": {"type": "string"}}}',
+  mermaidOnly: 'Create a mermaid flowchart showing the process',
+  mixed: 'Return JSON response with embedded mermaid diagram',
+  neither: 'Return plain text response',
+  
+  specific: {
+    flowchart: 'Generate a mermaid flowchart diagram',
+    sequence: 'Create a sequence diagram using mermaid',
+    gantt: 'Show a gantt chart in mermaid format',
+    pie: 'Create a pie chart diagram',
+    json: 'Response must be valid JSON format'
+  }
+};
+
+export const errorScenarios = {
+  json: {
+    unexpectedToken: {
+      response: '{"test": value}',
+      error: 'Unexpected token v in JSON at position 9',
+      detailedError: 'Unexpected token v in JSON at position 9'
+    },
+    
+    unexpectedEnd: {
+      response: '{"test":',
+      error: 'Unexpected end of JSON input',
+      detailedError: 'Unexpected end of JSON input'
+    },
+    
+    duplicateKeys: {
+      response: '{"test": 1, "test": 2}',
+      error: 'Duplicate key "test"',
+      detailedError: 'JSON contains duplicate key "test"'
+    }
+  },
+  
+  mermaid: {
+    unclosedBracket: {
+      diagram: 'graph TD\n    A[Start --> B[Process]',
+      error: 'Unclosed bracket on line 2',
+      detailedError: 'Line "A[Start --> B[Process]" contains an unclosed bracket'
+    },
+    
+    missingColon: {
+      diagram: 'sequenceDiagram\n    Alice->>Bob Hello',
+      error: 'Missing colon in sequence message on line 2',
+      detailedError: 'Line "Alice->>Bob Hello" appears to be a sequence message but is missing a colon'
+    },
+    
+    unknownType: {
+      diagram: 'invalidDiagram\n    content',
+      error: 'Diagram does not match any known Mermaid diagram pattern',
+      detailedError: 'The diagram must start with a valid Mermaid diagram type (graph, sequenceDiagram, gantt, pie, etc.)'
+    }
+  }
+};

package/data/probe/npm/tests/integration/claude-code-auto-fallback.spec.js

@@ -0,0 +1,148 @@
+#!/usr/bin/env node
+
+/**
+ * Test that ProbeAgent auto-detects and falls back to claude-code provider
+ * when no API keys are present but claude command is available
+ */
+
+import { ProbeAgent } from '../../src/agent/ProbeAgent.js';
+
+async function testAutoFallback() {
+  console.log('🧪 Testing Auto-Fallback to Claude Code Provider\n');
+  console.log('='*60 + '\n');
+
+  // Temporarily remove all API key env vars
+  const savedEnv = {
+    ANTHROPIC_API_KEY: process.env.ANTHROPIC_API_KEY,
+    ANTHROPIC_AUTH_TOKEN: process.env.ANTHROPIC_AUTH_TOKEN,
+    OPENAI_API_KEY: process.env.OPENAI_API_KEY,
+    GOOGLE_GENERATIVE_AI_API_KEY: process.env.GOOGLE_GENERATIVE_AI_API_KEY,
+    GOOGLE_API_KEY: process.env.GOOGLE_API_KEY,
+    AWS_ACCESS_KEY_ID: process.env.AWS_ACCESS_KEY_ID,
+    AWS_SECRET_ACCESS_KEY: process.env.AWS_SECRET_ACCESS_KEY,
+    AWS_REGION: process.env.AWS_REGION,
+    AWS_BEDROCK_API_KEY: process.env.AWS_BEDROCK_API_KEY
+  };
+
+  // Remove all API keys
+  delete process.env.ANTHROPIC_API_KEY;
+  delete process.env.ANTHROPIC_AUTH_TOKEN;
+  delete process.env.OPENAI_API_KEY;
+  delete process.env.GOOGLE_GENERATIVE_AI_API_KEY;
+  delete process.env.GOOGLE_API_KEY;
+  delete process.env.AWS_ACCESS_KEY_ID;
+  delete process.env.AWS_SECRET_ACCESS_KEY;
+  delete process.env.AWS_REGION;
+  delete process.env.AWS_BEDROCK_API_KEY;
+
+  try {
+    console.log('Creating ProbeAgent with NO API keys...\n');
+
+    const agent = new ProbeAgent({
+      allowedFolders: [process.cwd()],
+      debug: true
+    });
+
+    console.log('\nInitializing agent...\n');
+    await agent.initialize();
+
+    // Check if it auto-switched to claude-code
+    if (agent.clientApiProvider === 'claude-code' && agent.apiType === 'claude-code') {
+      console.log('\n✅ SUCCESS: Auto-detected and switched to claude-code provider!');
+      console.log(`   Provider: ${agent.clientApiProvider}`);
+      console.log(`   API Type: ${agent.apiType}`);
+      console.log(`   Model: ${agent.model}`);
+
+      // Try a simple query
+      console.log('\n📝 Testing query: "What is 5 + 3?"\n');
+      const response = await agent.answer('What is 5 + 3?');
+
+      if (response && response.length > 0) {
+        console.log('✅ Query successful!');
+        console.log('Response:', response.substring(0, 100) + (response.length > 100 ? '...' : ''));
+      } else {
+        console.log('⚠️  Query returned empty response');
+      }
+
+      // Clean up
+      if (agent.engine && agent.engine.close) {
+        await agent.engine.close();
+      }
+
+    } else {
+      console.log('❌ FAIL: Did not auto-switch to claude-code provider');
+      console.log(`   Provider: ${agent.clientApiProvider}`);
+      console.log(`   API Type: ${agent.apiType}`);
+    }
+
+  } catch (error) {
+    if (error.message.includes('claude command not found')) {
+      console.log('\n⚠️  Test could not run: claude command not found on system');
+      console.log('This is expected if Claude Code is not installed');
+      console.log('\nTo install Claude Code:');
+      console.log('  https://docs.claude.com/en/docs/claude-code');
+    } else {
+      console.error('\n❌ Test failed:', error.message);
+    }
+  } finally {
+    // Restore environment variables
+    Object.entries(savedEnv).forEach(([key, value]) => {
+      if (value !== undefined) {
+        process.env[key] = value;
+      }
+    });
+
+    console.log('\n' + '='*60);
+    console.log('🏁 Auto-Fallback Test Complete\n');
+  }
+}
+
+async function testWithAPIKey() {
+  console.log('\n' + '='*60);
+  console.log('🧪 Testing Normal Behavior with API Key\n');
+
+  // Set a mock env var
+  const hadKey = !!process.env.ANTHROPIC_API_KEY;
+  if (!hadKey) {
+    process.env.ANTHROPIC_API_KEY = 'test-key';
+  }
+
+  try {
+    const agent = new ProbeAgent({
+      allowedFolders: [process.cwd()],
+      debug: false
+    });
+
+    await agent.initialize();
+
+    if (agent.apiType !== 'claude-code') {
+      console.log('✅ With API key, did NOT auto-switch to claude-code');
+      console.log(`   API Type: ${agent.apiType}`);
+    } else {
+      console.log('⚠️  With API key, unexpectedly switched to claude-code');
+    }
+
+  } catch (error) {
+    console.log('ℹ️  Expected error with test API key:', error.message.substring(0, 80));
+  } finally {
+    if (!hadKey) {
+      delete process.env.ANTHROPIC_API_KEY;
+    }
+  }
+}
+
+async function main() {
+  console.log('🔬 ProbeAgent Auto-Fallback to Claude Code Test\n');
+  console.log('This test verifies that ProbeAgent automatically uses claude-code');
+  console.log('provider when no API keys are found but claude command is available.\n');
+
+  await testAutoFallback();
+  await testWithAPIKey();
+
+  console.log('\n📋 Summary:');
+  console.log('- Auto-fallback activates when: No API keys + claude command available');
+  console.log('- Falls back to: provider="claude-code"');
+  console.log('- User benefit: Zero-config usage in Claude Code environment');
+}
+
+main().catch(console.error);

package/data/probe/npm/tests/integration/claude-code-multi-step.spec.js

@@ -0,0 +1,127 @@
+#!/usr/bin/env node
+
+/**
+ * Integration test for multi-step Claude Code responses
+ * Tests that we properly handle responses when Claude Code uses internal agents/tools
+ */
+
+import { ProbeAgent } from '../../src/agent/ProbeAgent.js';
+
+async function testMultiStepQuery() {
+  console.log('Testing Multi-Step Claude Code Query (with internal tool use)\n');
+  console.log('='*60 + '\n');
+
+  const agent = new ProbeAgent({
+    allowedFolders: [process.cwd()],
+    debug: false,  // Clean output
+    provider: 'claude-code'
+  });
+
+  try {
+    await agent.initialize();
+
+    // Query that might trigger internal tool use (like Task agent)
+    console.log('📝 Query: "Explain how this npm package works"\n');
+    console.log('Note: This query may trigger internal tool usage in Claude Code\n');
+
+    let streamedContent = '';
+    const result = await agent.answer(
+      'Explain how this npm package (ProbeAgent) works - give a brief overview',
+      [],
+      {
+        onStream: (chunk) => {
+          streamedContent += chunk;
+        }
+      }
+    );
+
+    console.log('='*60 + '\n');
+    console.log('🔍 Response Analysis:\n');
+
+    if (result && result.length > 0) {
+      console.log('✅ Got final response from Claude Code');
+      console.log('Response length:', result.length, 'characters');
+      console.log('\nFirst 300 characters of response:');
+      console.log(result.substring(0, 300) + '...\n');
+
+      // Check if response seems complete
+      if (result.includes('ProbeAgent') || result.includes('agent') || result.includes('AI')) {
+        console.log('✅ Response contains relevant content about ProbeAgent');
+      } else {
+        console.log('⚠️  Response may not contain expected content');
+      }
+    } else {
+      console.log('❌ FAIL: Empty response received');
+      console.log('This indicates the multi-step fix may not be working');
+    }
+
+    // Check streaming
+    if (streamedContent.length > 0) {
+      console.log('\n✅ Streaming also worked');
+      console.log('Streamed content length:', streamedContent.length);
+    } else {
+      console.log('\n⚠️  No streamed content received');
+    }
+
+    // Clean up
+    if (agent.engine && agent.engine.close) {
+      await agent.engine.close();
+    }
+
+  } catch (error) {
+    console.error('Test failed:', error.message);
+  }
+}
+
+async function testSimpleQuery() {
+  console.log('\n' + '='*60);
+  console.log('Testing Simple Claude Code Query (baseline)\n');
+
+  const agent = new ProbeAgent({
+    allowedFolders: [process.cwd()],
+    debug: false,
+    provider: 'claude-code'
+  });
+
+  try {
+    await agent.initialize();
+
+    console.log('📝 Query: "Say hello"\n');
+
+    const result = await agent.answer('Say hello');
+
+    if (result && result.length > 0) {
+      console.log('✅ Simple query works');
+      console.log('Response:', result.substring(0, 100));
+    } else {
+      console.log('❌ Even simple query returned empty');
+    }
+
+    if (agent.engine && agent.engine.close) {
+      await agent.engine.close();
+    }
+
+  } catch (error) {
+    console.error('Simple test failed:', error.message);
+  }
+}
+
+async function main() {
+  console.log('🧪 Claude Code Multi-Step Response Integration Test\n');
+
+  // Test simple query first (baseline)
+  await testSimpleQuery();
+
+  // Test complex query that may trigger internal tools
+  await testMultiStepQuery();
+
+  console.log('\n' + '='*60);
+  console.log('🏁 Integration Test Complete\n');
+  console.log('Key Points:');
+  console.log('- Claude Code may use internal agents/tools (Task, etc.)');
+  console.log('- These emit "assistant" type messages');
+  console.log('- Without handling "assistant" type, responses appear empty');
+  console.log('- The fix adds support for extracting text from "assistant" messages');
+}
+
+main().catch(console.error);

package/data/probe/npm/tests/integration/claude-code-tool-events.spec.js

@@ -0,0 +1,163 @@
+#!/usr/bin/env node
+
+/**
+ * Test that Claude Code tool events are properly extracted and emitted
+ */
+
+import { ProbeAgent } from '../../src/agent/ProbeAgent.js';
+
+async function testToolEvents() {
+  console.log('Testing Tool Event Extraction from Claude Code\n');
+  console.log('='*60 + '\n');
+
+  const agent = new ProbeAgent({
+    allowedFolders: [process.cwd()],
+    debug: true,  // Enable debug to see tool event emissions
+    provider: 'claude-code'
+  });
+
+  // Track tool events
+  const toolEvents = [];
+
+  try {
+    await agent.initialize();
+
+    // Listen for tool events
+    if (agent.events) {
+      agent.events.on('toolCall', (event) => {
+        toolEvents.push(event);
+        console.log('\n📊 Tool Event Captured:');
+        console.log('  - Name:', event.name);
+        console.log('  - Status:', event.status);
+        console.log('  - Timestamp:', event.timestamp);
+        if (event.args) {
+          console.log('  - Args:', JSON.stringify(event.args).substring(0, 100));
+        }
+        if (event.resultPreview) {
+          console.log('  - Result:', event.resultPreview.substring(0, 100));
+        }
+      });
+    }
+
+    // Query that should trigger tool use
+    console.log('📝 Query: "List the main JavaScript files in this directory"\n');
+    console.log('This query should trigger tool use (listFiles or similar)\n');
+
+    const result = await agent.answer(
+      'List the main JavaScript files in this directory',
+      [],
+      {
+        onStream: (chunk) => {
+          // Silent streaming to focus on events
+        }
+      }
+    );
+
+    console.log('\n' + '='*60 + '\n');
+    console.log('📋 Response Summary:');
+    console.log('Response length:', result.length, 'characters');
+    console.log('First 300 chars:', result.substring(0, 300) + '...\n');
+
+    console.log('='*60 + '\n');
+    console.log('🔍 Tool Event Analysis:\n');
+
+    if (toolEvents.length > 0) {
+      console.log(`✅ Captured ${toolEvents.length} tool events`);
+
+      // Group by status
+      const started = toolEvents.filter(e => e.status === 'started');
+      const completed = toolEvents.filter(e => e.status === 'completed');
+      const errors = toolEvents.filter(e => e.status === 'error');
+
+      console.log(`  - Started: ${started.length}`);
+      console.log(`  - Completed: ${completed.length}`);
+      console.log(`  - Errors: ${errors.length}`);
+
+      // List unique tool names
+      const toolNames = [...new Set(toolEvents.map(e => e.name))];
+      console.log('\n📦 Tools used:');
+      toolNames.forEach(name => {
+        const count = toolEvents.filter(e => e.name === name).length;
+        console.log(`  - ${name} (${count} events)`);
+      });
+
+      // Check if MCP tools were used
+      const mcpTools = toolEvents.filter(e => e.name && e.name.startsWith('mcp__'));
+      if (mcpTools.length > 0) {
+        console.log('\n✅ MCP tools detected:', mcpTools.map(e => e.name).join(', '));
+      }
+
+    } else {
+      console.log('⚠️  No tool events captured');
+      console.log('This could mean:');
+      console.log('  1. Claude Code didn\'t use any tools for this query');
+      console.log('  2. Tool event extraction needs adjustment');
+    }
+
+    // Clean up
+    if (agent.engine && agent.engine.close) {
+      await agent.engine.close();
+    }
+
+  } catch (error) {
+    console.error('Test failed:', error.message);
+  }
+}
+
+async function testSimpleQuery() {
+  console.log('\n' + '='*60);
+  console.log('Testing Simple Query (no tools expected)\n');
+
+  const agent = new ProbeAgent({
+    allowedFolders: [process.cwd()],
+    debug: false,
+    provider: 'claude-code'
+  });
+
+  const toolEvents = [];
+
+  try {
+    await agent.initialize();
+
+    if (agent.events) {
+      agent.events.on('toolCall', (event) => {
+        toolEvents.push(event);
+      });
+    }
+
+    console.log('📝 Query: "What is 2+2?"\n');
+    const result = await agent.answer('What is 2+2?');
+
+    if (toolEvents.length === 0) {
+      console.log('✅ No tool events for simple query (expected)');
+    } else {
+      console.log(`⚠️  ${toolEvents.length} tool events for simple query (unexpected)`);
+    }
+
+    if (agent.engine && agent.engine.close) {
+      await agent.engine.close();
+    }
+
+  } catch (error) {
+    console.error('Simple test failed:', error.message);
+  }
+}
+
+async function main() {
+  console.log('🧪 Claude Code Tool Event Extraction Test\n');
+
+  // Test with query that should trigger tools
+  await testToolEvents();
+
+  // Test with simple query (no tools expected)
+  await testSimpleQuery();
+
+  console.log('\n' + '='*60);
+  console.log('🏁 Tool Event Test Complete\n');
+  console.log('Key Points:');
+  console.log('- Tool events are extracted from Claude Code\'s internal operations');
+  console.log('- Events are emitted as a batch after response completes');
+  console.log('- This maintains event compatibility with regular ProbeAgent');
+}
+
+main().catch(console.error);