Implementation:Langgenius Dify Analyze Component
| Knowledge Sources | |
|---|---|
| Domains | Frontend, Build_Tools |
| Last Updated | 2026-02-12 07:00 GMT |
Overview
CLI script that analyzes React component complexity and generates AI-assistant prompts for test generation or test review.
Description
analyze-component.js is a Node.js CLI tool that leverages the shared ComponentAnalyzer engine to inspect a React component file and produce a detailed test-generation prompt or a test-review prompt suitable for pasting into an AI coding assistant. It computes cognitive complexity (via SonarJS), detects React features (state, effects, routing, API calls, React Query, ahooks, refs, Suspense, portals), counts codebase usage references, and calculates a weighted test priority score. When the component exceeds complexity or line-count thresholds, the script recommends refactoring before testing. The generated prompt is automatically copied to the macOS clipboard when pbcopy is available.
The script contains two prompt-builder classes:
- TestPromptBuilder -- produces a comprehensive test-generation prompt with focus points tailored to detected features and domain-specific guidelines (workflow, dataset, configuration components).
- TestReviewPromptBuilder -- produces a review checklist prompt for an existing test file, embedding the original generation requirements so the reviewer can verify coverage.
Usage
Use this script when you need to generate a structured, context-rich prompt that an AI assistant can consume to write or review a component test file. It is especially useful for onboarding contributors who are unfamiliar with the Dify testing conventions.
Code Reference
Source Location
- Repository: Langgenius_Dify
- File: web/scripts/analyze-component.js
- Lines: 1-583
Signature
class TestPromptBuilder {
build(analysis)
buildFocusPoints(analysis)
getSpecificGuidelines(analysis)
}
class TestReviewPromptBuilder {
build({ analysis, testPath, testCode, originalPromptSection })
}
function main()
function showHelp()
function inferTestPath(componentPath)
Import
// CLI script - run directly
node web/scripts/analyze-component.js <component-path> [options]
// Or via pnpm
pnpm analyze-component <component-path> [options]
I/O Contract
Inputs
| Name | Type | Required | Description |
|---|---|---|---|
| component-path | string (positional arg) | Yes | Relative path to the React component file or directory to analyze |
| --json | flag | No | Output the raw analysis object as JSON instead of a formatted prompt |
| --review | flag | No | Generate a test-review prompt for an existing test file instead of a test-generation prompt |
| --help / -h | flag | No | Display usage instructions and exit |
Outputs
| Name | Type | Description |
|---|---|---|
| stdout (prompt) | string | Formatted ASCII prompt with component metrics, feature detection, and AI instructions |
| stdout (JSON) | JSON | Raw analysis object when --json is specified |
| clipboard | string | The copyable prompt section is automatically placed on the macOS clipboard via pbcopy |
| exit code 0 | number | Success or component-too-complex advisory |
| exit code 1 | number | Missing arguments or file not found |
Usage Examples
Generate a test prompt for a component
pnpm analyze-component app/components/base/button/index.tsx
Output analysis as JSON for programmatic use
pnpm analyze-component app/components/base/button/index.tsx --json
Review an existing test file
pnpm analyze-component app/components/base/button/index.tsx --review
Analyze a directory (auto-resolves entry file)
pnpm analyze-component app/components/base/button