luxlabs 1.0.0

package/commands/webview.js

@@ -0,0 +1,393 @@
+/**
+ * Test Command - Control webview for AI self-testing
+ *
+ * This command allows CLI/AI to interact with running dev servers:
+ * - Take screenshots
+ * - Click elements
+ * - Type text
+ * - Execute JavaScript
+ * - Navigate pages
+ */
+
+const net = require('net');
+const fs = require('fs');
+const path = require('path');
+const chalk = require('chalk');
+const { LUX_STUDIO_DIR } = require('../lib/config');
+
+// Socket path for webview control
+const SOCKET_PATH = path.join(LUX_STUDIO_DIR, 'webview-control.sock');
+
+/**
+ * Send a command to Lux Studio via Unix socket
+ */
+function sendCommand(command) {
+  return new Promise((resolve, reject) => {
+    if (!fs.existsSync(SOCKET_PATH)) {
+      reject(new Error('Lux Studio is not running or webview control is not available'));
+      return;
+    }
+
+    const client = net.createConnection(SOCKET_PATH);
+    let buffer = '';
+
+    client.on('connect', () => {
+      client.write(JSON.stringify(command) + '\n');
+    });
+
+    client.on('data', (data) => {
+      buffer += data.toString();
+      const lines = buffer.split('\n');
+      buffer = lines.pop() || '';
+
+      for (const line of lines) {
+        if (line.trim()) {
+          try {
+            const result = JSON.parse(line);
+            client.end();
+            resolve(result);
+          } catch (err) {
+            reject(new Error(`Failed to parse response: ${err.message}`));
+          }
+        }
+      }
+    });
+
+    client.on('error', (err) => {
+      reject(new Error(`Socket error: ${err.message}`));
+    });
+
+    client.on('close', () => {
+      if (buffer.trim()) {
+        try {
+          resolve(JSON.parse(buffer));
+        } catch {
+          // No response
+        }
+      }
+    });
+
+    // Timeout after 10 seconds (screenshots can take longer)
+    setTimeout(() => {
+      client.destroy();
+      reject(new Error('Command timed out'));
+    }, 10000);
+  });
+}
+
+/**
+ * Generate a unique command ID
+ */
+function generateId() {
+  return `cmd_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+}
+
+/**
+ * Take a screenshot of the webview
+ */
+async function screenshot(interfaceId, outputPath) {
+  const id = generateId();
+  const result = await sendCommand({
+    id,
+    type: 'screenshot',
+    appId: interfaceId, // Keep appId for backwards compatibility with Lux Studio
+    payload: { outputPath },
+  });
+
+  if (result.success) {
+    console.log(chalk.green('Screenshot captured!'));
+    if (result.screenshotPath) {
+      console.log(chalk.cyan('  Path:'), result.screenshotPath);
+    } else if (result.data?.path) {
+      console.log(chalk.cyan('  Path:'), result.data.path);
+    }
+  } else {
+    console.log(chalk.red('Screenshot failed:'), result.error);
+  }
+
+  return result;
+}
+
+/**
+ * Click an element in the webview
+ */
+async function click(interfaceId, selector) {
+  const id = generateId();
+  const result = await sendCommand({
+    id,
+    type: 'click',
+    appId: interfaceId,
+    payload: { selector },
+  });
+
+  if (result.success) {
+    console.log(chalk.green('Clicked:'), selector);
+  } else {
+    console.log(chalk.red('Click failed:'), result.error);
+  }
+
+  return result;
+}
+
+/**
+ * Type text into an element
+ */
+async function type(interfaceId, selector, text) {
+  const id = generateId();
+  const result = await sendCommand({
+    id,
+    type: 'type',
+    appId: interfaceId,
+    payload: { selector, text },
+  });
+
+  if (result.success) {
+    console.log(chalk.green('Typed text into:'), selector);
+  } else {
+    console.log(chalk.red('Type failed:'), result.error);
+  }
+
+  return result;
+}
+
+/**
+ * Execute JavaScript in the webview
+ */
+async function evaluate(interfaceId, code) {
+  const id = generateId();
+  const result = await sendCommand({
+    id,
+    type: 'eval',
+    appId: interfaceId,
+    payload: { code },
+  });
+
+  if (result.success) {
+    console.log(chalk.green('Eval result:'), JSON.stringify(result.data, null, 2));
+  } else {
+    console.log(chalk.red('Eval failed:'), result.error);
+  }
+
+  return result;
+}
+
+/**
+ * Get current URL of the webview
+ */
+async function getUrl(interfaceId) {
+  const id = generateId();
+  const result = await sendCommand({
+    id,
+    type: 'get-url',
+    appId: interfaceId,
+  });
+
+  if (result.success) {
+    console.log(chalk.green('Current URL:'), result.data?.url);
+  } else {
+    console.log(chalk.red('Get URL failed:'), result.error);
+  }
+
+  return result;
+}
+
+/**
+ * Navigate to a URL
+ */
+async function navigate(interfaceId, url) {
+  const id = generateId();
+  const result = await sendCommand({
+    id,
+    type: 'navigate',
+    appId: interfaceId,
+    payload: { url },
+  });
+
+  if (result.success) {
+    console.log(chalk.green('Navigated to:'), url);
+  } else {
+    console.log(chalk.red('Navigate failed:'), result.error);
+  }
+
+  return result;
+}
+
+/**
+ * Wait for a duration
+ */
+async function wait(interfaceId, ms) {
+  const id = generateId();
+  const result = await sendCommand({
+    id,
+    type: 'wait',
+    appId: interfaceId,
+    payload: { ms: parseInt(ms, 10) },
+  });
+
+  if (result.success) {
+    console.log(chalk.green('Waited:'), ms, 'ms');
+  } else {
+    console.log(chalk.red('Wait failed:'), result.error);
+  }
+
+  return result;
+}
+
+/**
+ * Start the interface preview in Lux Studio
+ */
+async function startPreview(interfaceId) {
+  const id = generateId();
+  const result = await sendCommand({
+    id,
+    type: 'start-preview',
+    appId: interfaceId,
+  });
+
+  if (result.success) {
+    console.log(chalk.green('Preview started for:'), interfaceId);
+  } else {
+    console.log(chalk.red('Start preview failed:'), result.error);
+  }
+
+  return result;
+}
+
+/**
+ * Show help for test commands
+ */
+function showHelp() {
+  console.log(chalk.cyan('\nUsage:'));
+  console.log('  lux test screenshot <interface-id> [output-path]   Take a screenshot');
+  console.log('  lux test click <interface-id> <selector>          Click an element');
+  console.log('  lux test type <interface-id> <selector> <text>    Type into an element');
+  console.log('  lux test eval <interface-id> <code>               Execute JavaScript');
+  console.log('  lux test url <interface-id>                       Get current URL');
+  console.log('  lux test navigate <interface-id> <url>            Navigate to URL');
+  console.log('  lux test wait <interface-id> <ms>                 Wait for duration');
+  console.log('');
+  console.log(chalk.cyan('Examples:'));
+  console.log('  lux test screenshot my-interface ./screenshot.png');
+  console.log('  lux test click my-interface "button.submit"');
+  console.log('  lux test type my-interface "#email" "user@example.com"');
+  console.log('  lux test eval my-interface "document.title"');
+  console.log('  lux test navigate my-interface "http://localhost:3000/login"');
+  console.log('');
+  console.log(chalk.dim('Note: <interface-id> is the interface ID or name from "lux servers"'));
+  console.log('');
+}
+
+/**
+ * Handle test command
+ */
+async function handleTest(args = []) {
+  const [subcommand, ...rest] = args;
+
+  if (!subcommand || subcommand === 'help') {
+    showHelp();
+    return;
+  }
+
+  try {
+    switch (subcommand) {
+      case 'screenshot': {
+        const [interfaceId, outputPath] = rest;
+        if (!interfaceId) {
+          console.log(chalk.red('Error: interface-id is required'));
+          showHelp();
+          return;
+        }
+        await screenshot(interfaceId, outputPath);
+        break;
+      }
+
+      case 'click': {
+        const [interfaceId, selector] = rest;
+        if (!interfaceId || !selector) {
+          console.log(chalk.red('Error: interface-id and selector are required'));
+          showHelp();
+          return;
+        }
+        await click(interfaceId, selector);
+        break;
+      }
+
+      case 'type': {
+        const [interfaceId, selector, ...textParts] = rest;
+        const text = textParts.join(' ');
+        if (!interfaceId || !selector || !text) {
+          console.log(chalk.red('Error: interface-id, selector, and text are required'));
+          showHelp();
+          return;
+        }
+        await type(interfaceId, selector, text);
+        break;
+      }
+
+      case 'eval': {
+        const [interfaceId, ...codeParts] = rest;
+        const code = codeParts.join(' ');
+        if (!interfaceId || !code) {
+          console.log(chalk.red('Error: interface-id and code are required'));
+          showHelp();
+          return;
+        }
+        await evaluate(interfaceId, code);
+        break;
+      }
+
+      case 'url': {
+        const [interfaceId] = rest;
+        if (!interfaceId) {
+          console.log(chalk.red('Error: interface-id is required'));
+          showHelp();
+          return;
+        }
+        await getUrl(interfaceId);
+        break;
+      }
+
+      case 'navigate':
+      case 'nav': {
+        const [interfaceId, url] = rest;
+        if (!interfaceId || !url) {
+          console.log(chalk.red('Error: interface-id and url are required'));
+          showHelp();
+          return;
+        }
+        await navigate(interfaceId, url);
+        break;
+      }
+
+      case 'wait': {
+        const [interfaceId, ms] = rest;
+        if (!interfaceId || !ms) {
+          console.log(chalk.red('Error: interface-id and duration (ms) are required'));
+          showHelp();
+          return;
+        }
+        await wait(interfaceId, ms);
+        break;
+      }
+
+      default:
+        console.log(chalk.red(`Unknown test command: ${subcommand}`));
+        showHelp();
+    }
+  } catch (err) {
+    console.log(chalk.red('Error:'), err.message);
+  }
+}
+
+module.exports = {
+  handleTest,
+  screenshot,
+  click,
+  type,
+  evaluate,
+  getUrl,
+  navigate,
+  wait,
+  startPreview,
+  sendCommand,
+};