check_compatibility
Check CSS and JavaScript features against multiple browser targets to identify compatibility issues and get remediation steps.
Instructions
Check specific features or files against multiple browser targets with detailed analysis
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| features | No | Specific caniuse feature names to check (e.g., 'flexbox', 'css-grid') | |
| files | No | Specific file paths to analyze for features | |
| targets | No | Browser targets (chrome-37, firefox-esr, safari-12, ie-11, edge-legacy) |
Implementation Reference
- src/enhanced-tools.js:57-94 (handler)Core implementation of the check_compatibility tool handler. Processes input arguments (features, files, targets), scans specified files for features if provided, performs compatibility checks via EnhancedCompatibilityChecker, and returns structured results with summary, recommendations, and detailed compatibility data.export async function handleCheckCompatibility(args) { const { features, files, targets = ['chrome-37'] } = args; let featuresToCheck = features || []; // If files are provided, scan them for features if (files && files.length > 0) { const scanResults = await projectScanner.scanSpecificFiles(files); const detectedFeatures = [...new Set(scanResults.flatMap(r => r.features))]; featuresToCheck = [...new Set([...featuresToCheck, ...detectedFeatures])]; } if (featuresToCheck.length === 0) { return { status: 'no-features', message: 'No features specified or detected in files', suggestion: 'Either provide specific features to check, or use scan_project to auto-detect features', availableTargets: compatibilityChecker.getSupportedBrowserTargets() }; } const result = await compatibilityChecker.checkSpecificFeatures(featuresToCheck, { targets }); return { features: featuresToCheck, targets, compatibility: result.compatibility, summary: { overallScore: result.summary.overallScore, byTarget: result.summary.targets, unsupportedFeatures: result.summary.commonUnsupported }, recommendations: result.summary.commonUnsupported.length > 0 ? [`Use get_fixes tool with features: ${result.summary.commonUnsupported.slice(0, 5).join(', ')}`] : ['All features are supported in the specified targets'], detailedResults: result }; }
- index.js:53-87 (registration)MCP server registration of the check_compatibility tool, including Zod-based input schema for features, files, and targets, and wrapper that calls the handler function with error handling.server.registerTool( "check_compatibility", { title: "Compatibility Checker", description: "Check specific features or files against multiple browser targets with detailed analysis", inputSchema: { features: z.array(z.string()).optional().describe("Specific caniuse feature names to check (e.g., 'flexbox', 'css-grid')"), files: z.array(z.string()).optional().describe("Specific file paths to analyze for features"), targets: z.array(z.string()).optional().default(["chrome-37"]).describe("Browser targets (chrome-37, firefox-esr, safari-12, ie-11, edge-legacy)") } }, async (args) => { try { const result = await handleCheckCompatibility(args); return { content: [{ type: "text", text: JSON.stringify(result, null, 2) }] }; } catch (error) { return { content: [{ type: "text", text: JSON.stringify({ error: true, message: error.message, suggestion: "Check the input parameters and try again. Use 'scan_project' first to detect features automatically." }, null, 2) }], isError: true }; } } );
- index.js:58-63 (schema)Zod input schema defining parameters for the check_compatibility tool: optional arrays of features and files to check, and browser targets with default.inputSchema: { features: z.array(z.string()).optional().describe("Specific caniuse feature names to check (e.g., 'flexbox', 'css-grid')"), files: z.array(z.string()).optional().describe("Specific file paths to analyze for features"), targets: z.array(z.string()).optional().default(["chrome-37"]).describe("Browser targets (chrome-37, firefox-esr, safari-12, ie-11, edge-legacy)") } },