ai-extension-preview 0.1.13 → 0.1.15

package/dist/index.js

@@ -2,19 +2,18 @@
 import 'dotenv/config'; // Load .env
 import { Command } from 'commander';
 import path from 'path';
-import { fileURLToPath } from 'url';
-import fs from 'fs-extra';
 import os from 'os';
 import { Runtime } from 'skeleton-crew-runtime';
+import { ConfigPlugin } from './plugins/ConfigPlugin.js';
 import { CorePlugin } from './plugins/CorePlugin.js';
 import { DownloaderPlugin } from './plugins/DownloaderPlugin.js';
 import { BrowserManagerPlugin } from './plugins/browser/BrowserManagerPlugin.js';
 import { WSLLauncherPlugin } from './plugins/browser/WSLLauncherPlugin.js';
 import { NativeLauncherPlugin } from './plugins/browser/NativeLauncherPlugin.js';
 import { ServerPlugin } from './plugins/ServerPlugin.js';
-import axios from 'axios';
+import { AuthPlugin } from './plugins/AuthPlugin.js'; // [NEW]
+import { AppPlugin } from './plugins/AppPlugin.js'; // [NEW]
 import chalk from 'chalk';
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
 const DEFAULT_HOST = process.env.API_HOST || 'https://ai-extension-builder.01kb6018z1t9tpaza4y5f1c56w.lmapp.run/api';
 const program = new Command();
 program
@@ -26,138 +25,53 @@ program
     .option('--user <user>', 'User ID (if required)')
     .parse(process.argv);
 const options = program.opts();
-async function authenticate(host, port) {
-    try {
-        // 1. Init Session with port
-        console.log('[DEBUG] Sending port to backend:', port);
-        const initRes = await axios({
-            method: 'post',
-            url: `${host}/preview/init`,
-            data: { port },
-            headers: {
-                'Content-Type': 'application/json'
-            }
-        });
-        console.log('[DEBUG] Init response:', initRes.data);
-        const { code, sessionId } = initRes.data;
-        console.log('\n' + chalk.bgBlue.bold(' DETACHED PREVIEW MODE ') + '\n');
-        console.log('To connect, please go to your Extension Dashboard and click "Connect Preview".');
-        console.log('Enter the following code:');
-        console.log('\n' + chalk.green.bold(`  ${code}  `) + '\n');
-        console.log('Waiting for connection...');
-        // 2. Poll for Status
-        while (true) {
-            await new Promise(resolve => setTimeout(resolve, 2000));
-            try {
-                const statusRes = await axios.get(`${host}/preview/status/${sessionId}`);
-                const data = statusRes.data;
-                if (data.status === 'linked') {
-                    console.log(chalk.green('✔ Connected!'));
-                    if (!data.jobId) {
-                        console.error('Error: No Job ID associated with this connection.');
-                        process.exit(1);
-                    }
-                    console.log('[DEBUG] Received userId:', data.userId);
-                    console.log('[DEBUG] Received jobId:', data.jobId);
-                    return {
-                        jobId: data.jobId,
-                        userId: data.userId,
-                        token: data.token || ''
-                    };
-                }
-                if (data.status === 'expired') {
-                    console.error(chalk.red('Code expired. Please restart.'));
-                    process.exit(1);
-                }
-            }
-            catch (err) {
-                // Ignore poll errors, keep trying
-            }
-        }
-    }
-    catch (error) {
-        console.error('Authentication failed:', error);
-        throw error;
-    }
-}
 // Use os.homedir() to ensure we have write permissions
-// Git Bash sometimes defaults cwd to C:\Program Files\Git which causes EPERM
 const HOME_DIR = os.homedir();
-const WORK_DIR = path.join(HOME_DIR, '.ai-extension-preview', options.job || 'default'); // Use default if job not provided yet
+// Initial workdir based on options, or specific 'default' if not yet known.
+// AuthPlugin will update this if job changes.
+const WORK_DIR = path.join(HOME_DIR, '.ai-extension-preview', options.job || 'default');
 (async () => {
-    const { job: jobId, host, token, user: userId } = options;
-    // 1. Initialize Runtime first to allocate port
+    const { job: initialJobId, host, token, user: userId } = options;
+    // 1. Initialize Runtime with Config
     const runtime = new Runtime({
-        hostContext: {
-            config: {
-                host,
-                token: token || '',
-                user: userId || '',
-                jobId: jobId || '',
-                workDir: WORK_DIR
-            }
-        }
+        config: {
+            host,
+            token: token || '',
+            user: userId || '',
+            jobId: initialJobId || '',
+            workDir: WORK_DIR
+        },
+        hostContext: {} // Clear hostContext config wrapping
     });
+    // Register Plugins
     runtime.logger.info('Registering plugins...');
     runtime.registerPlugin(CorePlugin);
+    runtime.registerPlugin(ConfigPlugin);
     runtime.registerPlugin(DownloaderPlugin);
     runtime.registerPlugin(BrowserManagerPlugin);
     runtime.registerPlugin(WSLLauncherPlugin);
     runtime.registerPlugin(NativeLauncherPlugin);
     runtime.registerPlugin(ServerPlugin);
+    runtime.registerPlugin(AuthPlugin); // [NEW]
+    runtime.registerPlugin(AppPlugin); // [NEW]
     runtime.logger.info('Initializing runtime...');
     await runtime.initialize();
     const ctx = runtime.getContext();
-    // Get allocated port from ServerPlugin
-    const allocatedPort = ctx.hotReloadPort;
-    if (!allocatedPort) {
-        console.error('Failed to allocate server port');
-        process.exit(1);
-    }
-    // 2. Now authenticate with the allocated port
-    let finalJobId = jobId;
-    let finalUserId = userId;
-    let finalToken = token;
-    if (!jobId || !userId) {
-        const authData = await authenticate(host, allocatedPort);
-        finalJobId = authData.jobId;
-        finalUserId = authData.userId;
-        finalToken = authData.token;
-        // Update runtime config with auth data
-        ctx.host.config.jobId = finalJobId;
-        ctx.host.config.user = finalUserId;
-        ctx.host.config.token = finalToken;
-    }
-    // 3. Start LifeCycle
-    await ctx.actions.runAction('core:log', { level: 'info', message: 'Initializing Local Satellite...' });
-    // Ensure work dir exists
-    await fs.ensureDir(WORK_DIR);
-    // Initial Check - Must succeed to continue
-    const success = await ctx.actions.runAction('downloader:check', null);
-    if (!success) {
-        await ctx.actions.runAction('core:log', { level: 'error', message: 'Initial check failed. Could not verify job or download extension.' });
-        process.exit(1);
-    }
-    // Wait for Extension files (Manifest)
-    const manifestPath = path.join(WORK_DIR, 'dist', 'manifest.json');
-    let attempts = 0;
-    const maxAttempts = 60; // 2 minutes
-    console.log('[DEBUG] Waiting for extension files...');
-    while (!fs.existsSync(manifestPath) && attempts < maxAttempts) {
-        await new Promise(r => setTimeout(r, 2000));
-        attempts++;
-        if (attempts % 5 === 0)
-            console.log(`Waiting for extension generation... (${attempts * 2}s)`);
+    // 2. Start App Flow
+    try {
+        await ctx.actions.runAction('app:start', null);
     }
-    if (!fs.existsSync(manifestPath)) {
-        await ctx.actions.runAction('core:log', { level: 'error', message: 'Timed out waiting for extension files. Status check succeeded but files are missing.' });
+    catch (error) {
+        console.error(chalk.red('App Error:'), error.message);
+        await runtime.shutdown();
         process.exit(1);
     }
-    // Launch Browser
-    await ctx.actions.runAction('browser:start', {});
-    // Keep process alive
+    // Keep process alive handled by Node event loop because ServerPlugin has an open server
+    // and Browser processes might be attached. 
+    // Graceful Shutdown
     process.on('SIGINT', async () => {
         await ctx.actions.runAction('core:log', { level: 'info', message: 'Shutting down...' });
+        await runtime.shutdown();
         process.exit(0);
     });
     runtime.logger.info('Press Ctrl+C to exit.');
@@ -168,7 +82,6 @@ const WORK_DIR = path.join(HOME_DIR, '.ai-extension-preview', options.job || 'de
 // Handle global errors
 process.on('uncaughtException', (err) => {
     if (err.code === 'ECONNRESET' || err.message?.includes('ECONNRESET')) {
-        // Ignore pipe errors frequently caused by web-ext/chrome teardown
         return;
     }
     console.error('Uncaught Exception:', err);

package/dist/plugins/AppPlugin.js

@@ -0,0 +1,58 @@
+import fs from 'fs-extra';
+import path from 'path';
+export const AppPlugin = {
+    name: 'app',
+    version: '1.0.0',
+    dependencies: ['auth', 'config', 'downloader', 'browser-manager', 'server'],
+    setup(ctx) {
+        ctx.actions.registerAction({
+            id: 'app:start',
+            handler: async () => {
+                await ctx.actions.runAction('core:log', { level: 'info', message: 'Initializing Local Satellite...' });
+                // 1. Authenticate (if needed)
+                // AuthPlugin will automatically skip if already config'd, or prompt if needed
+                // It will also update config via config:set
+                await ctx.actions.runAction('auth:login');
+                // 2. Validate Configuration (Now that we have potential Auth data)
+                try {
+                    await ctx.actions.runAction('config:validate', null);
+                }
+                catch (e) {
+                    throw new Error(`Configuration Invalid: ${e.message}`);
+                }
+                // 3. Get Updated Config
+                const workDir = ctx.config.workDir;
+                // 3. Ensure Work Directory
+                await fs.ensureDir(workDir);
+                // 4. Initial Download/Check
+                const success = await ctx.actions.runAction('downloader:check', null);
+                if (!success) {
+                    await ctx.actions.runAction('core:log', { level: 'error', message: 'Initial check failed. Could not verify job or download extension.' });
+                    // We don't exit process here, but we might throw to stop flow
+                    throw new Error('Initial check failed');
+                }
+                // 5. Wait for Extension Manifest
+                const manifestPath = path.join(workDir, 'dist', 'manifest.json');
+                let attempts = 0;
+                const maxAttempts = 60; // 2 minutes
+                // This logic could be in a 'watcher' plugin but fits here for now as part of "Startup Sequence"
+                if (!fs.existsSync(manifestPath)) {
+                    await ctx.actions.runAction('core:log', { level: 'info', message: '[DEBUG] Waiting for extension files...' });
+                    while (!fs.existsSync(manifestPath) && attempts < maxAttempts) {
+                        await new Promise(r => setTimeout(r, 2000));
+                        attempts++;
+                        if (attempts % 5 === 0) {
+                            await ctx.actions.runAction('core:log', { level: 'info', message: `Waiting for extension generation... (${attempts * 2}s)` });
+                        }
+                    }
+                }
+                if (!fs.existsSync(manifestPath)) {
+                    await ctx.actions.runAction('core:log', { level: 'error', message: 'Timed out waiting for extension files. Status check succeeded but files are missing.' });
+                    throw new Error('Timeout waiting for files');
+                }
+                // 6. Launch Browser
+                await ctx.actions.runAction('browser:start', {});
+            }
+        });
+    }
+};

package/dist/plugins/AuthPlugin.js

@@ -0,0 +1,88 @@
+import axios from 'axios';
+import chalk from 'chalk';
+import path from 'path';
+import os from 'os';
+export const AuthPlugin = {
+    name: 'auth',
+    version: '1.0.0',
+    dependencies: ['config', 'server'],
+    setup(ctx) {
+        ctx.actions.registerAction({
+            id: 'auth:login',
+            handler: async () => {
+                const hostContext = ctx.config;
+                // If we already have JobID and UserID, we might skip, but let's assume we need to verify or start fresh if missing
+                if (hostContext.jobId && hostContext.user) {
+                    await ctx.actions.runAction('core:log', { level: 'info', message: 'Auth: Job ID and User ID present. Skipping login.' });
+                    return { jobId: hostContext.jobId, user: hostContext.user, token: hostContext.token };
+                }
+                // We need the port from ServerPlugin
+                // We need the port from ServerPlugin
+                const allocatedPort = ctx.config.hotReloadPort;
+                if (!allocatedPort) {
+                    throw new Error('Server port not found. Ensure ServerPlugin is loaded before AuthPlugin logic runs.');
+                }
+                const host = hostContext.host;
+                await ctx.actions.runAction('core:log', { level: 'info', message: `Auth: Initiating login flow on ${host} with port ${allocatedPort}` });
+                try {
+                    // 1. Init Session with port
+                    const initRes = await axios({
+                        method: 'post',
+                        url: `${host}/preview/init`,
+                        data: { port: allocatedPort },
+                        headers: { 'Content-Type': 'application/json' }
+                    });
+                    const { code, sessionId } = initRes.data;
+                    console.log('\n' + chalk.bgBlue.bold(' DETACHED PREVIEW MODE ') + '\n');
+                    console.log('To connect, please go to your Extension Dashboard and click "Connect Preview".');
+                    console.log('Enter the following code:');
+                    console.log('\n' + chalk.green.bold(`  ${code}  `) + '\n');
+                    console.log('Waiting for connection...');
+                    // 2. Poll for Status
+                    let attempts = 0;
+                    while (true) {
+                        await new Promise(resolve => setTimeout(resolve, 2000));
+                        attempts++;
+                        // Check if we should abort (e.g. from a cancel signal? unimplemented for now)
+                        try {
+                            const statusRes = await axios.get(`${host}/preview/status/${sessionId}`);
+                            const data = statusRes.data;
+                            if (data.status === 'linked') {
+                                console.log(chalk.green('✔ Connected!'));
+                                if (!data.jobId) {
+                                    throw new Error('No Job ID associated with this connection.');
+                                }
+                                const authData = {
+                                    jobId: data.jobId,
+                                    user: data.userId,
+                                    token: data.token || ''
+                                };
+                                // UPGRADE CONFIG
+                                await ctx.actions.runAction('config:set', {
+                                    jobId: authData.jobId,
+                                    user: authData.user,
+                                    token: authData.token,
+                                    workDir: path.join(os.homedir(), '.ai-extension-preview', authData.jobId)
+                                });
+                                return authData;
+                            }
+                            if (data.status === 'expired') {
+                                throw new Error('Code expired. Please restart.');
+                            }
+                        }
+                        catch (err) {
+                            if (err.message && (err.message.includes('expired') || err.message.includes('No Job ID'))) {
+                                throw err;
+                            }
+                            // Ignore poll errors
+                        }
+                    }
+                }
+                catch (error) {
+                    await ctx.actions.runAction('core:log', { level: 'error', message: `Authentication failed: ${error.message}` });
+                    throw error;
+                }
+            }
+        });
+    }
+};

package/dist/plugins/ConfigPlugin.js

@@ -0,0 +1,51 @@
+import { z } from 'zod';
+export const ConfigPlugin = {
+    name: 'config',
+    version: '1.0.0',
+    dependencies: [],
+    async setup(ctx) {
+        // 1. Define Schema
+        const configSchema = z.object({
+            host: z.string().url(),
+            jobId: z.string().min(1, "Job ID is required"),
+            token: z.string().optional(),
+            user: z.string().optional(),
+            workDir: z.string()
+        });
+        ctx.actions.registerAction({
+            id: 'config:validate',
+            handler: async () => {
+                const config = ctx.config;
+                try {
+                    configSchema.parse(config);
+                    return true;
+                }
+                catch (error) {
+                    if (error instanceof z.ZodError) {
+                        const issues = error.issues.map(i => `${i.path.join('.')}: ${i.message}`).join(', ');
+                        await ctx.actions.runAction('core:log', { level: 'error', message: `Config Validation Failed: ${issues}` });
+                    }
+                    throw error;
+                }
+            }
+        });
+        // [NEW] Allow runtime config updates
+        ctx.actions.registerAction({
+            id: 'config:set',
+            handler: async (payload) => {
+                ctx.getRuntime().updateConfig(payload);
+                const config = ctx.config;
+                // Validate after set? Optional, but good practice.
+                try {
+                    configSchema.parse(config);
+                }
+                catch (e) {
+                    // Log but don't revert for now, trust the caller or add rollback logic if needed.
+                    // Just warn for now
+                    await ctx.actions.runAction('core:log', { level: 'warn', message: 'Config updated but validation failed. Some features may not work.' });
+                }
+                return config;
+            }
+        });
+    }
+};

package/dist/plugins/CorePlugin.js

@@ -4,8 +4,7 @@ export const CorePlugin = {
     version: '1.0.0',
     setup(ctx) {
         console.log('CorePlugin: setup called');
-        // We assume config is passed in hostContext
-        const config = ctx.host.config;
+        const config = ctx.config;
         ctx.actions.registerAction({
             id: 'core:config',
             handler: async () => config
@@ -15,9 +14,7 @@ export const CorePlugin = {
             id: 'core:log',
             handler: async (payload) => {
                 // Access default logger from Runtime
-                const rt = typeof ctx.getRuntime === 'function' ? ctx.getRuntime() : ctx.runtime;
-                // Logger is now public
-                const logger = rt.logger || console;
+                const logger = ctx.logger;
                 const { level, message } = payload;
                 switch (level) {
                     case 'error':

package/dist/plugins/DownloaderPlugin.js

@@ -8,12 +8,20 @@ let checkInterval;
 export const DownloaderPlugin = {
     name: 'downloader',
     version: '1.0.0',
+    dependencies: ['config'],
     setup(ctx) {
-        const config = ctx.host.config;
-        const DIST_DIR = path.join(config.workDir, 'dist');
-        const DOWNLOAD_PATH = path.join(config.workDir, 'extension.zip');
+        // Helper to get paths dynamically
+        const getPaths = () => {
+            const workDir = ctx.config.workDir;
+            return {
+                DIST_DIR: path.join(workDir, 'dist'),
+                DOWNLOAD_PATH: path.join(workDir, 'extension.zip'),
+                VERSION_FILE: path.join(workDir, 'version')
+            };
+        };
         // Helper function to create axios client with current config
         const createClient = () => {
+            const config = ctx.config;
             const rawToken = config.token ? String(config.token) : '';
             const token = rawToken.replace(/^Bearer\s+/i, '').trim();
             // Auto-extract user ID from token if not provided
@@ -42,11 +50,16 @@ export const DownloaderPlugin = {
                 })
             });
         };
-        const VERSION_FILE = path.join(config.workDir, 'version');
         let lastModified = '';
-        if (fs.existsSync(VERSION_FILE)) {
-            lastModified = fs.readFileSync(VERSION_FILE, 'utf-8').trim();
+        let currentWorkDir = '';
+        // Check initial state if workDir exists
+        try {
+            const { VERSION_FILE } = getPaths();
+            if (fs.existsSync(VERSION_FILE)) {
+                lastModified = fs.readFileSync(VERSION_FILE, 'utf-8').trim();
+            }
         }
+        catch (e) { }
         let isChecking = false;
         // Action: Check Status
         ctx.actions.registerAction({
@@ -55,12 +68,23 @@ export const DownloaderPlugin = {
                 if (isChecking)
                     return true; // Skip if busy
                 isChecking = true;
+                const { jobId, workDir } = ctx.config;
+                const { DIST_DIR, VERSION_FILE } = getPaths();
+                // Reset lastModified if workDir changed
+                if (workDir !== currentWorkDir) {
+                    currentWorkDir = workDir;
+                    lastModified = '';
+                    if (fs.existsSync(VERSION_FILE)) {
+                        lastModified = fs.readFileSync(VERSION_FILE, 'utf-8').trim();
+                    }
+                }
+                await ctx.actions.runAction('core:log', { level: 'info', message: 'Checking for updates...' });
                 const MAX_RETRIES = 3;
                 let attempt = 0;
                 while (attempt < MAX_RETRIES) {
                     try {
                         const client = createClient(); // Create client with current config
-                        const res = await client.get(`/jobs/${config.jobId}`);
+                        const res = await client.get(`/jobs/${jobId}`);
                         const job = res.data;
                         const newVersion = job.version;
                         // If no version in job yet, fall back to timestamp or ignore
@@ -83,7 +107,7 @@ export const DownloaderPlugin = {
                                 if (success) {
                                     lastModified = newVersion;
                                     fs.writeFileSync(VERSION_FILE, newVersion);
-                                    ctx.events.emit('downloader:updated', { version: job.version, jobId: config.jobId });
+                                    ctx.events.emit('downloader:updated', { version: job.version, jobId: ctx.config.jobId });
                                 }
                             }
                         }
@@ -117,21 +141,22 @@ export const DownloaderPlugin = {
                 const spinner = ora('Downloading new version...').start();
                 try {
                     const client = createClient(); // Create client with current config
-                    const response = await client.get(`/download/${config.jobId}`, {
+                    const { DIST_DIR, DOWNLOAD_PATH, VERSION_FILE } = getPaths();
+                    const response = await client.get(`/download/${ctx.config.jobId}`, {
                         responseType: 'arraybuffer'
                     });
-                    await fs.ensureDir(config.workDir);
+                    await fs.ensureDir(ctx.config.workDir);
                     await fs.writeFile(DOWNLOAD_PATH, response.data);
                     await fs.emptyDir(DIST_DIR);
                     const zip = new AdmZip(DOWNLOAD_PATH);
                     zip.extractAllTo(DIST_DIR, true);
                     // --- HOT RELOAD INJECTION ---
                     try {
-                        // Get dynamically allocated port from ServerPlugin
-                        const hotReloadPort = ctx.hotReloadPort || 3500;
+                        // Get dynamically allocated port from ServerPlugin via config
+                        const hotReloadPort = ctx.config.hotReloadPort || 3500;
                         const HOT_RELOAD_CODE = `
 const EVENT_SOURCE_URL = 'http://localhost:${hotReloadPort}/status';
-const CURRENT_JOB_ID = '${config.jobId}';
+const CURRENT_JOB_ID = '${ctx.config.jobId}';
 let lastVersion = null;
 let lastJobId = null;
 

package/dist/plugins/ServerPlugin.js

@@ -2,7 +2,9 @@ import http from 'http';
 export const ServerPlugin = {
     name: 'server',
     version: '1.0.0',
+    dependencies: ['config'],
     async setup(ctx) {
+        // const context = ctx as PreviewContext; // No longer needed
         let currentVersion = '0.0.0';
         // Try to bind to a port, retrying with incremented ports on failure
         const startPort = 3500;
@@ -29,7 +31,7 @@ export const ServerPlugin = {
                 return;
             }
             if (req.url === '/status') {
-                const currentJobId = ctx.host.config.jobId;
+                const currentJobId = ctx.config.jobId;
                 res.writeHead(200, { 'Content-Type': 'application/json' });
                 res.end(JSON.stringify({
                     version: currentVersion,
@@ -38,15 +40,37 @@ export const ServerPlugin = {
                 }));
             }
             else if (req.url === '/refresh' && req.method === 'POST') {
-                // Trigger manual check
-                ctx.actions.runAction('core:log', { level: 'info', message: '[API] Refresh request received' });
-                ctx.actions.runAction('downloader:check', null).then((result) => {
-                    ctx.actions.runAction('core:log', { level: 'info', message: `[API] Check result: ${result}` });
-                }).catch((err) => {
-                    ctx.actions.runAction('core:log', { level: 'error', message: `[API] Check failed: ${err.message}` });
+                // Collect body
+                let body = '';
+                req.on('data', chunk => {
+                    body += chunk.toString();
                 });
-                res.writeHead(200, { 'Content-Type': 'application/json' });
-                res.end(JSON.stringify({ success: true }));
+                req.on('end', () => {
+                    let newJobId = null;
+                    try {
+                        if (body) {
+                            const data = JSON.parse(body);
+                            if (data.jobId) {
+                                newJobId = data.jobId;
+                                ctx.getRuntime().updateConfig({ jobId: newJobId });
+                                ctx.actions.runAction('core:log', { level: 'info', message: `[API] Switched to new Job ID: ${newJobId}` });
+                            }
+                        }
+                    }
+                    catch (e) {
+                        // Ignore parse error
+                    }
+                    // Trigger manual check
+                    ctx.actions.runAction('core:log', { level: 'info', message: '[API] Refresh request received' });
+                    ctx.actions.runAction('downloader:check', null).then((result) => {
+                        ctx.actions.runAction('core:log', { level: 'info', message: `[API] Check result: ${result}` });
+                    }).catch((err) => {
+                        ctx.actions.runAction('core:log', { level: 'error', message: `[API] Check failed: ${err.message}` });
+                    });
+                    res.writeHead(200, { 'Content-Type': 'application/json' });
+                    res.end(JSON.stringify({ success: true, jobId: ctx.config.jobId }));
+                });
+                return; // Return because we handle response in 'end' callback
             }
             else if (req.url === '/disconnect' && req.method === 'POST') {
                 // Trigger browser stop
@@ -110,7 +134,7 @@ export const ServerPlugin = {
             return;
         }
         // Store port in context for DownloaderPlugin to use
-        ctx.hotReloadPort = allocatedPort;
+        ctx.getRuntime().updateConfig({ hotReloadPort: allocatedPort });
         // Store server instance to close later
         ctx._serverInstance = server;
     },

package/dist/plugins/browser/BrowserManagerPlugin.js

@@ -4,18 +4,22 @@ import { findExtensionRoot, validateExtension } from '../../utils/browserUtils.j
 export const BrowserManagerPlugin = {
     name: 'browser-manager',
     version: '1.0.0',
+    dependencies: ['config', 'downloader'],
     setup(ctx) {
-        const config = ctx.host.config;
-        const DIST_DIR = path.join(config.workDir, 'dist');
-        // --- Centralized Path Strategy ---
-        const isWSL = fs.existsSync('/mnt/c');
-        const isWin = process.platform === 'win32';
-        // Unified Staging Path (C:\\Temp for Windows/WSL, local for others)
-        const STAGING_DIR = isWSL
-            ? '/mnt/c/Temp/ai-ext-preview'
-            : (isWin ? 'C:\\Temp\\ai-ext-preview' : path.join(config.workDir, '../staging'));
+        // Helper to get dynamic paths
+        const getPaths = () => {
+            const config = ctx.config;
+            const DIST_DIR = path.join(config.workDir, 'dist');
+            const isWSL = fs.existsSync('/mnt/c');
+            const isWin = process.platform === 'win32';
+            const STAGING_DIR = isWSL
+                ? '/mnt/c/Temp/ai-ext-preview'
+                : (isWin ? 'C:\\Temp\\ai-ext-preview' : path.join(config.workDir, '../staging'));
+            return { DIST_DIR, STAGING_DIR };
+        };
         // --- SYNC FUNCTION ---
         const syncToStaging = async () => {
+            const { DIST_DIR, STAGING_DIR } = getPaths();
             try {
                 if (fs.existsSync(STAGING_DIR)) {
                     fs.emptyDirSync(STAGING_DIR);
@@ -31,9 +35,10 @@ export const BrowserManagerPlugin = {
             }
         };
         const launchBrowser = async () => {
+            const { STAGING_DIR } = getPaths();
             // Resolve proper root AFTER sync
             const extensionRoot = findExtensionRoot(STAGING_DIR) || STAGING_DIR;
-            // Validate
+            // 1. Static Validation
             const validation = validateExtension(extensionRoot);
             if (!validation.valid) {
                 await ctx.actions.runAction('core:log', { level: 'error', message: `[CRITICAL] Extension validation failed: ${validation.error} in ${extensionRoot}` });
@@ -41,6 +46,19 @@ export const BrowserManagerPlugin = {
             else if (extensionRoot !== STAGING_DIR) {
                 await ctx.actions.runAction('core:log', { level: 'info', message: `Detected nested extension at: ${path.basename(extensionRoot)}` });
             }
+            // 2. Runtime Verification (Diagnostic) - SKIPPED FOR PERFORMANCE
+            // The SandboxRunner spins up a separate headless chrome which is slow and prone to WSL networking issues.
+            // Since we have static analysis in the backend, we skip this blocking step to give the user immediate feedback.
+            /*
+            await ctx.actions.runAction('core:log', { level: 'info', message: 'Running diagnostic verification...' });
+            const diagResult = await SandboxRunner.validateExtensionRuntime(extensionRoot);
+
+            if (diagResult.success) {
+                await ctx.actions.runAction('core:log', { level: 'info', message: '✅ Diagnostic Verification Passed.' });
+            } else {
+                await ctx.actions.runAction('core:log', { level: 'error', message: `❌ Diagnostic Verification Failed: ${diagResult.error}` });
+            }
+            */
             // Delegate Launch
             // We pass the filesystem path (STAGING_DIR or extensionRoot)
             // The specific Launcher plugin handles environment specific path verification/conversion
@@ -72,7 +90,15 @@ export const BrowserManagerPlugin = {
         // Event: Update detected
         ctx.events.on('downloader:updated', async () => {
             if (isInitialized) {
-                await ctx.actions.runAction('core:log', { level: 'info', message: 'Update detected. Syncing to staging...' });
+                await ctx.actions.runAction('core:log', { level: 'info', message: 'Update detected. Restarting browser...' });
+                try {
+                    await ctx.actions.runAction('browser:stop', {});
+                }
+                catch (e) {
+                    // Ignore if already stopped
+                }
+                // [Optimization] Wait for process cleanup to avoid "Open in new tab" race condition
+                await new Promise(r => setTimeout(r, 1000));
                 await ctx.actions.runAction('browser:start', {});
             }
         });

package/dist/plugins/browser/NativeLauncherPlugin.js

@@ -6,6 +6,7 @@ let chromeProcess = null;
 export const NativeLauncherPlugin = {
     name: 'native-launcher',
     version: '1.0.0',
+    dependencies: ['config'],
     setup(ctx) {
         // Only active if NOT in WSL
         const isWSL = fs.existsSync('/mnt/c');
@@ -14,7 +15,7 @@ export const NativeLauncherPlugin = {
         ctx.actions.registerAction({
             id: 'launcher:launch',
             handler: async (payload) => {
-                const config = ctx.host.config;
+                const config = ctx.config;
                 const chromePath = findChrome();
                 if (!chromePath) {
                     await ctx.actions.runAction('core:log', { level: 'error', message: 'Chrome not found.' });

package/dist/plugins/browser/WSLLauncherPlugin.js

@@ -6,6 +6,7 @@ let chromePid = null;
 export const WSLLauncherPlugin = {
     name: 'wsl-launcher',
     version: '1.0.0',
+    dependencies: ['config'],
     setup(ctx) {
         // Only active in WSL
         const isWSL = fs.existsSync('/mnt/c');
@@ -118,19 +119,37 @@ Write-Host "CHROME_PID:$($process.Id)"
                 if (chromePid) {
                     await ctx.actions.runAction('core:log', { level: 'info', message: `Terminating Chrome process (PID: ${chromePid})...` });
                     try {
-                        // Use taskkill via PowerShell
-                        const killChild = spawn('powershell.exe', ['-Command', `Stop-Process -Id ${chromePid} -Force`], {
-                            stdio: 'ignore'
-                        });
-                        killChild.on('exit', async (code) => {
-                            if (code === 0) {
-                                await ctx.actions.runAction('core:log', { level: 'info', message: 'Chrome process terminated successfully.' });
-                                chromePid = null;
-                            }
-                            else {
-                                await ctx.actions.runAction('core:log', { level: 'warn', message: `taskkill exited with code ${code}` });
+                        // 1. Try Stop-Process first (Graceful)
+                        const killCmd = `
+                            $targetPid = ${chromePid}
+                            try { 
+                                Stop-Process -Id $targetPid -Force -ErrorAction Stop
+                                Write-Host "STOPPED"
+                            } catch {
+                                try {
+                                    taskkill.exe /F /PID $targetPid
+                                    Write-Host "TASKKILLED"
+                                } catch {
+                                    Write-Host "FAILED: $_" 
+                                    exit 1
+                                }
                             }
+                        `;
+                        const killChild = spawn('powershell.exe', ['-Command', killCmd], { stdio: 'pipe' });
+                        // Capture output to debug why it might fail
+                        if (killChild.stdout) {
+                            killChild.stdout.on('data', d => ctx.actions.runAction('core:log', { level: 'debug', message: `[KillParams] ${d}` }));
+                        }
+                        if (killChild.stderr) {
+                            killChild.stderr.on('data', d => ctx.actions.runAction('core:log', { level: 'warn', message: `[KillMsg] ${d}` }));
+                        }
+                        await new Promise((resolve) => {
+                            killChild.on('exit', (code) => {
+                                resolve();
+                            });
                         });
+                        await ctx.actions.runAction('core:log', { level: 'info', message: 'Chrome process termination signal sent.' });
+                        chromePid = null;
                         return true;
                     }
                     catch (err) {

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/dist/utils/sandbox.js

@@ -0,0 +1,192 @@
+import puppeteer from 'puppeteer-core';
+import path from 'path';
+import fs from 'fs-extra';
+import { spawn, execSync } from 'child_process';
+import axios from 'axios';
+import { findChrome } from './browserUtils.js';
+export class SandboxRunner {
+    /**
+     * Launch a headless browser with the extension loaded to verify it can initialize.
+     * @param extensionPath Absolute path to the unpacked extension directory
+     * @param chromePath Optional path to Chrome executable. If not provided, attempts to auto-detect.
+     */
+    static async validateExtensionRuntime(extensionPath, chromePath) {
+        const logs = [];
+        const executablePath = chromePath || findChrome();
+        if (!executablePath) {
+            return {
+                success: false,
+                logs,
+                error: 'Chrome executable not found. Cannot run verification.'
+            };
+        }
+        const isWSL = executablePath.startsWith('/mnt/');
+        if (isWSL) {
+            logs.push('[Sandbox] WSL Environment detected. Using "Spawn & Connect" strategy.');
+            return this.runWSLCheck(extensionPath, executablePath, logs);
+        }
+        else {
+            return this.runStandardCheck(extensionPath, executablePath, logs);
+        }
+    }
+    static async runStandardCheck(extensionPath, executablePath, logs) {
+        let browser;
+        try {
+            logs.push(`[Sandbox] Launching standard verification for: ${extensionPath}`);
+            logs.push(`[Sandbox] Using Chrome at: ${executablePath}`);
+            browser = await puppeteer.launch({
+                headless: true,
+                executablePath: executablePath,
+                args: [
+                    `--disable-extensions-except=${extensionPath}`,
+                    `--load-extension=${extensionPath}`,
+                    '--no-sandbox',
+                    '--disable-setuid-sandbox'
+                ]
+            });
+            return await this.performChecks(browser, extensionPath, logs);
+        }
+        catch (error) {
+            console.error('[Sandbox] Standard Launch Error:', error);
+            return { success: false, logs, error: error instanceof Error ? error.message : String(error) };
+        }
+        finally {
+            if (browser)
+                await browser.close();
+        }
+    }
+    static async runWSLCheck(extensionPath, linuxChromePath, logs) {
+        let browser;
+        let chromePid = null;
+        try {
+            // 1. Path Conversion (Linux -> Windows)
+            const driveMatch = linuxChromePath.match(/^\/mnt\/([a-z])\//);
+            if (!driveMatch)
+                throw new Error(`Could not parse drive letter from ${linuxChromePath}`);
+            const driveLetter = driveMatch[1];
+            const winChromePath = linuxChromePath
+                .replace(new RegExp(`^/mnt/${driveLetter}/`), `${driveLetter.toUpperCase()}:\\`)
+                .replace(/\//g, '\\');
+            // 1b. Detect Host IP (WSL DNS Resolver IP)
+            let hostIp = '127.0.0.1';
+            try {
+                const resolveConf = fs.readFileSync('/etc/resolv.conf', 'utf-8');
+                const match = resolveConf.match(/nameserver\s+([\d.]+)/);
+                if (match)
+                    hostIp = match[1];
+                logs.push(`[Sandbox] Host IP detected: ${hostIp}`);
+            }
+            catch (e) {
+                logs.push(`[Sandbox] Failed to detect Host IP, fallback to 127.0.0.1: ${e}`);
+            }
+            let winExtensionPath = extensionPath;
+            const extDriveMatch = extensionPath.match(/^\/mnt\/([a-z])\//);
+            if (extDriveMatch) {
+                winExtensionPath = extensionPath
+                    .replace(new RegExp(`^/mnt/${extDriveMatch[1]}/`), `${extDriveMatch[1].toUpperCase()}:\\`)
+                    .replace(/\//g, '\\');
+            }
+            else {
+                logs.push('[Sandbox] WARNING: Extension path is not in /mnt/. Windows Chrome might not see it.');
+            }
+            // 2. Spawn Chrome via PowerShell
+            const port = 9222;
+            const winProfile = `C:\\Temp\\ai-ext-sandbox-${Date.now()}`;
+            const args = [
+                `--headless=new`,
+                `--disable-extensions-except="${winExtensionPath}"`,
+                `--load-extension="${winExtensionPath}"`,
+                `--user-data-dir="${winProfile}"`,
+                '--no-sandbox',
+                '--disable-gpu',
+                '--disable-dev-shm-usage',
+                '--no-first-run',
+                '--no-default-browser-check',
+                `--remote-debugging-port=${port}`,
+                `--remote-debugging-address=0.0.0.0`, // Bind to all interfaces so WSL can see it
+                `--remote-allow-origins=*` // Allow puppeteer connection
+            ];
+            const psCommand = `Start-Process -FilePath "${winChromePath}" -ArgumentList '${args.join(' ')}' -PassThru`;
+            logs.push(`[Sandbox] Spawning Chrome via PowerShell on port ${port}...`);
+            logs.push(`[Sandbox] Profile: ${winProfile}`);
+            const child = spawn('powershell.exe', ['-Command', psCommand], { stdio: 'pipe' });
+            await new Promise((resolve, reject) => {
+                child.stdout.on('data', (data) => {
+                    const output = data.toString();
+                    const match = output.match(/\s+(\d+)\s+\d+\s+chrome/i) || output.match(/Id\s+:\s+(\d+)/);
+                    if (match) {
+                        chromePid = parseInt(match[1], 10);
+                        logs.push(`[Sandbox] Chrome PID: ${chromePid}`);
+                    }
+                });
+                child.on('close', (code) => {
+                    if (code === 0)
+                        resolve();
+                    else
+                        reject(new Error(`PowerShell exited with code ${code}`));
+                });
+            });
+            // 3. Wait for Port
+            logs.push('[Sandbox] Waiting for Chrome to accept connections...');
+            let connected = false;
+            // Increased timeout to 15s (30 * 500ms)
+            for (let i = 0; i < 30; i++) {
+                try {
+                    // Use hostIp, not localhost
+                    await axios.get(`http://${hostIp}:${port}/json/version`, { timeout: 1000 });
+                    connected = true;
+                    break;
+                }
+                catch (e) {
+                    await new Promise(r => setTimeout(r, 500));
+                }
+            }
+            if (!connected)
+                throw new Error(`Timed out waiting for Chrome debug port ${port}`);
+            // 4. Connect Puppeteer
+            logs.push('[Sandbox] Connecting Puppeteer...');
+            browser = await puppeteer.connect({
+                browserURL: `http://${hostIp}:${port}`
+            });
+            // 5. Perform Checks
+            const result = await this.performChecks(browser, extensionPath, logs);
+            return result;
+        }
+        catch (error) {
+            console.error('[Sandbox] WSL Check Error:', error);
+            return { success: false, logs, error: error instanceof Error ? error.message : String(error) };
+        }
+        finally {
+            if (browser)
+                await browser.disconnect();
+            if (chromePid) {
+                logs.push(`[Sandbox] Killing Chrome PID ${chromePid}...`);
+                try {
+                    execSync(`powershell.exe -Command "Stop-Process -Id ${chromePid} -Force"`);
+                }
+                catch (e) { /* ignore */ }
+            }
+        }
+    }
+    static async performChecks(browser, extensionPath, logs) {
+        await new Promise(r => setTimeout(r, 2000));
+        const targets = await browser.targets();
+        const backgroundTarget = targets.find(t => t.type() === 'service_worker' || t.type() === 'background_page');
+        if (!backgroundTarget) {
+            const manifestPath = path.join(extensionPath, 'manifest.json');
+            if (fs.existsSync(manifestPath)) {
+                const manifest = await fs.readJson(manifestPath);
+                if (manifest.background) {
+                    return { success: false, logs, error: 'Background Service Worker defined in manifest but failed to start.' };
+                }
+                else {
+                    logs.push('[Sandbox] No background script defined in manifest. Skipping worker check.');
+                }
+            }
+        }
+        else {
+            logs.push('Background worker started successfully.');
+        }
+        return { success: true, logs };
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "ai-extension-preview",
-    "version": "0.1.13",
+    "version": "0.1.15",
     "description": "Local preview tool for AI Extension Builder",
     "type": "module",
     "bin": {
@@ -37,9 +37,10 @@
         "node-fetch": "^3.3.2",
         "ora": "^8.1.1",
         "puppeteer-core": "^24.33.0",
-        "skeleton-crew-runtime": "^0.1.5",
+        "skeleton-crew-runtime": "0.2.0",
         "web-ext": "^8.3.0",
-        "ws": "^8.18.0"
+        "ws": "^8.18.0",
+        "zod": "^4.2.1"
     },
     "devDependencies": {
         "@types/adm-zip": "^0.5.6",
@@ -51,4 +52,4 @@
         "typescript": "^5.7.2",
         "vitest": "^4.0.16"
     }
-}
+}