@tng-sh/js 0.1.1 → 0.1.2

package/bin/tng.js

@@ -28,7 +28,7 @@ process.on('uncaughtException', (err) => {
 program
     .name('tng')
     .description('TNG - Automated Test Generation, and audit generation for JavaScript')
-    .version('0.1.1');
+    .version('0.1.2');
 
 /**
  * @command init
@@ -143,6 +143,65 @@ program
         launchInteractive();
     });
 
+/**
+ * @command xray
+ * Generate X-Ray (Mermaid Visualization)
+ */
+program
+    .command('xray')
+    .alias('x')
+    .description('Generate X-Ray visualization')
+    .option('-f, --file <path>', 'Input file path')
+    .option('-m, --method <name>', 'Method name to visualize')
+    .action(async (options) => {
+        if (!options.file || !options.method) {
+            console.log(chalk.red('Error: Both --file and --method are required for X-Ray.'));
+            console.log(chalk.yellow('Usage: tng xray -f <file> -m <method>'));
+            process.exit(1);
+        }
+
+        console.log(chalk.blue(`🔍 Generating X-Ray for ${options.method} in ${options.file}...`));
+
+        try {
+            const config = loadConfig();
+
+            // Re-use logic similar to _handleXrayFlow but tailored for CLI non-interactive output
+            const { generateTest } = require('../index');
+
+            // We use a custom callback to show progress
+            const callback = (msg, percent) => {
+                if (percent % 20 === 0) console.log(chalk.dim(`[${percent}%] ${msg}`));
+            };
+
+            // We pass 'visualize' as the test type
+            const resultJson = generateTest(
+                path.resolve(options.file),
+                options.method,
+                null,
+                'visualize',
+                JSON.stringify(config),
+                callback
+            );
+
+            let mermaidCode = "";
+            try {
+                const parsed = JSON.parse(resultJson);
+                mermaidCode = parsed.mermaid_code || resultJson;
+            } catch (e) {
+                mermaidCode = resultJson;
+            }
+
+            console.log(chalk.bold('\n--- X-Ray Result (Mermaid.js) ---\n'));
+            console.log(chalk.blue(mermaidCode));
+            console.log(chalk.bold('\n---------------------------------\n'));
+            console.log(chalk.green('✓ Copy the code above and paste into https://mermaid.live'));
+
+        } catch (e) {
+            console.log(chalk.red(`Error: ${e.message}`));
+            process.exit(1);
+        }
+    });
+
 /**
  * Main command handler (handles -f and -m)
  */

package/lib/generateTestsUi.js

@@ -34,6 +34,9 @@ class GenerateTestsUI {
             } else if (choice === 'audit') {
                 const result = await this._showFileSelection(true);
                 if (result === 'exit') return 'exit';
+            } else if (choice === 'xray') {
+                const result = await this._showFileSelection(false, true);
+                if (result === 'exit') return 'exit';
             } else if (choice === 'stats') {
                 await this._showStats();
             } else if (choice === 'about') {
@@ -95,7 +98,7 @@ class GenerateTestsUI {
         });
     }
 
-    async _showFileSelection(isAudit = false) {
+    async _showFileSelection(isAudit = false, isXray = false) {
         const files = await this._getUserFiles();
 
         if (files.length === 0) {
@@ -109,19 +112,19 @@ class GenerateTestsUI {
             path: path.dirname(file)
         }));
 
-        const title = isAudit ? 'Select JavaScript File to Audit' : 'Select JavaScript File';
+        const title = isXray ? 'Select File for X-Ray' : (isAudit ? 'Select JavaScript File to Audit' : 'Select JavaScript File');
         const selectedName = this.goUiSession.showListView(title, items);
 
         if (selectedName === 'back') return 'back';
         if (!selectedName || selectedName === 'exit') return 'exit';
 
         const selectedFile = path.resolve(cwd, selectedName);
-        const result = await this._showMethodsForFile(selectedFile, isAudit);
+        const result = await this._showMethodsForFile(selectedFile, isAudit, isXray);
         if (result === 'main_menu') return 'main_menu';
         return result;
     }
 
-    async _showMethodsForFile(filePath, isAudit = false) {
+    async _showMethodsForFile(filePath, isAudit = false, isXray = false) {
         let outline;
         try {
             const result = getFileOutline(filePath);
@@ -144,33 +147,39 @@ class GenerateTestsUI {
             methodData: m
         }));
 
-        const title = isAudit ? `Select Method to Audit for ${fileName}` : `Select Method for ${fileName}`;
+        const title = isXray ? `Select Method to X-Ray for ${fileName}` : (isAudit ? `Select Method to Audit for ${fileName}` : `Select Method for ${fileName}`);
         const selectedDisplay = this.goUiSession.showListView(title, items);
 
-        if (selectedDisplay === 'back' || !selectedDisplay) return this._showFileSelection(isAudit);
+        if (selectedDisplay === 'back' || !selectedDisplay) return this._showFileSelection(isAudit, isXray);
 
         const selectedMethod = items.find(i => i.name === selectedDisplay)?.methodData;
 
         if (selectedMethod) {
+            if (isXray) {
+                const choice = await this._generateTestsForMethod(filePath, selectedMethod, 'visualize', false, true);
+                if (choice === 'main_menu') return 'main_menu';
+                return this._showFileSelection(isAudit, isXray);
+            }
+
             const testType = this.goUiSession.showJsTestMenu();
-            if (testType === 'back') return this._showFileSelection(isAudit);
+            if (testType === 'back') return this._showFileSelection(isAudit, isXray);
 
             const finalType = testType === 'auto' ? null : testType;
             const choice = await this._generateTestsForMethod(filePath, selectedMethod, finalType, isAudit);
 
             if (isAudit) {
                 if (choice === 'main_menu') return 'main_menu';
-                return this._showFileSelection(isAudit);
+                return this._showFileSelection(isAudit, isXray);
             }
 
             if (choice && choice.file_path && !choice.error) {
                 this._showPostGenerationMenu(choice);
             }
         }
-        return this._showFileSelection(isAudit);
+        return this._showFileSelection(isAudit, isXray);
     }
 
-    async _generateTestsForMethod(filePath, method, testType, isAudit = false) {
+    async _generateTestsForMethod(filePath, method, testType, isAudit = false, isXray = false) {
         if (!this._hasApiKey()) {
             return { error: 'No API key' };
         }
@@ -179,6 +188,10 @@ class GenerateTestsUI {
             return this._handleAuditFlow(filePath, method, testType);
         }
 
+        if (isXray) {
+            return this._handleXrayFlow(filePath, method);
+        }
+
         const fileName = path.basename(filePath);
         const displayName = method.class_name ? `${method.class_name}#${method.name}` : `${fileName}#${method.name}`;
         return this._handleTestGenerationFlow(filePath, method, testType, displayName);
@@ -395,6 +408,78 @@ class GenerateTestsUI {
         return uiResult || null;
     }
 
+    async _handleXrayFlow(filePath, method) {
+        const actionName = 'Generating X-Ray for';
+        const displayName = method.name;
+
+        const progressHandler = async (progress) => {
+            progress.update('Analyzing method structure...');
+
+            try {
+                const config = loadConfig();
+                // Override test_type to 'visualize' which behaves like test generation but returns Mermaid code
+                const resultJson = generateTest(
+                    filePath,
+                    method.name,
+                    method.class_name || null,
+                    'visualize',
+                    JSON.stringify(config),
+                    (msg, percent) => {
+                        // Simple progress updates
+                        progress.update(msg, { percent });
+                    }
+                );
+
+                // The result is expected to be a JSON string containing the mermaid definition
+                // But generateTest returns the full file content usually.
+                // We need to clarify if Backend returns just Mermaid or a file.
+                // Assuming Backend returns JSON with { "visualize_result": "mermaid code..." } or similar
+                // or if it returns raw text, we handle it.
+
+                // For 'visualize' type, existing backend generates a file or JSON.
+                // We should parse it.
+                let mermaidCode = "";
+                try {
+                    const parsed = JSON.parse(resultJson);
+                    if (parsed.mermaid_code) mermaidCode = parsed.mermaid_code;
+                    else mermaidCode = resultJson; // Fallback
+                } catch (e) {
+                    mermaidCode = resultJson;
+                }
+
+                return {
+                    success: true,
+                    mermaidCode: mermaidCode
+                };
+            } catch (e) {
+                progress.error(`Failed to generate X-Ray: ${e.message}`);
+                return { error: e.message };
+            }
+        };
+
+        const result = await this.goUiSession.showProgress(`${actionName} ${displayName}`, progressHandler);
+
+        if (result && result.mermaidCode) {
+            console.log(chalk.bold('\n--- X-Ray Result (Mermaid.js) ---\n'));
+            // Simple highlighting for terminal
+            console.log(chalk.blue(result.mermaidCode));
+            console.log(chalk.bold('\n---------------------------------\n'));
+
+            // Prompt user action
+            this._copyToClipboard(result.mermaidCode);
+            console.log(chalk.green('✓ Copied to clipboard! Paste into https://mermaid.live'));
+
+            // Wait for user confirmation to return
+            const { execSync } = require('child_process');
+            try {
+                // Just a pause hack if we want, but showListView might be better.
+                // For now, let's just return.
+            } catch (e) { }
+        }
+
+        return result;
+    }
+
     _updateProgress(progress, msg, percent) {
         const agentMap = {
             'context_agent_status': { label: 'Context Builder', step: 1 },

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@tng-sh/js",
-    "version": "0.1.1",
+    "version": "0.1.2",
     "description": "TNG JavaScript CLI",
     "repository": {
         "type": "git",