Skip to main content
Glama

Component Library MCP Server

test.ts5.11 kB
#!/usr/bin/env node import { McpClient } from '@modelcontextprotocol/sdk/client/mcp.js'; import { StdioClientTransport } from '@modelcontextprotocol/sdk/client/stdio.js'; import { spawn } from 'child_process'; import path from 'path'; import { fileURLToPath } from 'url'; const __dirname = path.dirname(fileURLToPath(import.meta.url)); /** * Test script for the Component Library MCP Server * Run this to verify your server is working correctly */ interface TestResult { passed: boolean; message: string; } async function runTest(name: string, testFn: () => Promise<void>): Promise<TestResult> { try { await testFn(); return { passed: true, message: `✅ ${name}` }; } catch (error) { return { passed: false, message: `❌ ${name}: ${error}` }; } } async function testServer(): Promise<void> { console.log('🧪 Testing Component Library MCP Server (TypeScript version)...\n'); const transport = new StdioClientTransport({ command: 'tsx', args: [path.join(__dirname, 'index.ts')], env: { ...process.env, COMPONENTS_PATH: path.join(__dirname, '../example-docs/components'), DOCS_PATH: path.join(__dirname, '../example-docs'), EXAMPLES_PATH: path.join(__dirname, '../example-docs/examples') } }); const client = new McpClient({ name: 'test-client', version: '1.0.0' }); const results: TestResult[] = []; try { await client.connect(transport); console.log('✅ Connected to server\n'); // Test 1: List tools results.push(await runTest('List tools', async () => { const tools = await client.listTools(); if (tools.tools.length !== 3) { throw new Error(`Expected 3 tools, got ${tools.tools.length}`); } console.log('📋 Available tools:'); tools.tools.forEach(tool => { console.log(` - ${tool.name}: ${tool.description}`); }); })); // Test 2: List components results.push(await runTest('list_components', async () => { const result = await client.callTool('list_components', {}); const data = JSON.parse(result.content[0].text); if (data.count === 0) { throw new Error('No components found'); } console.log(` Found ${data.count} components`); })); // Test 3: Get component with category filter results.push(await runTest('list_components with category', async () => { const result = await client.callTool('list_components', { category: 'forms' }); const data = JSON.parse(result.content[0].text); console.log(` Found ${data.count} form components`); })); // Test 4: Get component details results.push(await runTest('get_component (Panel)', async () => { const result = await client.callTool('get_component', { componentName: 'Panel' }); const componentInfo = JSON.parse(result.content[0].text); if (!componentInfo.name) { throw new Error('Component info missing name'); } console.log(` Component: ${componentInfo.name}`); console.log(` Category: ${componentInfo.category}`); console.log(` Status: ${componentInfo.status}`); })); // Test 5: Get non-existent component results.push(await runTest('get_component (NonExistent)', async () => { const result = await client.callTool('get_component', { componentName: 'NonExistentComponent' }); if (!result.content[0].text.includes('not found')) { throw new Error('Should return not found message'); } console.log(' Correctly handled missing component'); })); // Test 6: Get example results.push(await runTest('get_example (Panel)', async () => { const result = await client.callTool('get_example', { componentName: 'Panel' }); if (!result.content[0].text.includes('Panel')) { throw new Error('Example should include component name'); } console.log(' Example retrieved successfully'); })); // Test 7: Get example for component with only inline examples results.push(await runTest('get_example from documentation', async () => { const result = await client.callTool('get_example', { componentName: 'Form' }); if (!result.content[0].text) { throw new Error('Should extract examples from documentation'); } console.log(' Extracted inline examples from documentation'); })); } catch (error) { console.error('❌ Test suite failed:', error); } finally { await client.close(); // Print results summary console.log('\n📊 Test Results:'); console.log('================'); results.forEach(r => console.log(r.message)); const passed = results.filter(r => r.passed).length; const total = results.length; console.log(`\n${passed}/${total} tests passed`); if (passed === total) { console.log('\n🎉 All tests passed!'); } else { console.log('\n⚠️ Some tests failed. Please check the output above.'); process.exit(1); } } } // Run tests testServer().catch(console.error);

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/alex-abrams711/component-library-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server