ai-extension-preview 0.1.10 → 0.1.12

package/dist/index.js

@@ -8,7 +8,9 @@ import os from 'os';
 import { Runtime } from 'skeleton-crew-runtime';
 import { CorePlugin } from './plugins/CorePlugin.js';
 import { DownloaderPlugin } from './plugins/DownloaderPlugin.js';
-import { BrowserPlugin } from './plugins/BrowserPlugin.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 chalk from 'chalk';
@@ -24,10 +26,19 @@ program
     .option('--user <user>', 'User ID (if required)')
     .parse(process.argv);
 const options = program.opts();
-async function authenticate(host) {
+async function authenticate(host, port) {
     try {
-        // 1. Init Session
-        const initRes = await axios.post(`${host}/preview/init`);
+        // 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".');
@@ -41,15 +52,17 @@ async function authenticate(host) {
                 const statusRes = await axios.get(`${host}/preview/status/${sessionId}`);
                 const data = statusRes.data;
                 if (data.status === 'linked') {
-                    // console.log(chalk.green('✔ Connected!'));
+                    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: 'session:' + sessionId // Use session ID as token for now
+                        token: data.token || ''
                     };
                 }
                 if (data.status === 'expired') {
@@ -57,57 +70,64 @@ async function authenticate(host) {
                     process.exit(1);
                 }
             }
-            catch (e) {
-                // Ignore transient network errors
+            catch (err) {
+                // Ignore poll errors, keep trying
             }
         }
     }
     catch (error) {
-        console.error(chalk.red(`Failed to initialize session: ${error.message}`));
-        process.exit(1);
+        console.error('Authentication failed:', error);
+        throw error;
     }
 }
-async function main() {
-    let jobId = options.job;
-    let userId = options.user;
-    let token = options.token;
-    const host = options.host;
-    // Interactive Auth Flow if no Job ID provided
-    if (!jobId) {
-        const authData = await authenticate(host);
-        jobId = authData.jobId;
-        userId = authData.userId || userId;
-        token = authData.token || token;
-    }
-    // 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', jobId);
-    // 1. Initialize Runtime
+// 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
+(async () => {
+    const { job: jobId, host, token, user: userId } = options;
+    // 1. Initialize Runtime first to allocate port
     const runtime = new Runtime({
         hostContext: {
             config: {
                 host,
-                token,
-                user: userId,
-                jobId,
+                token: token || '',
+                user: userId || '',
+                jobId: jobId || '',
                 workDir: WORK_DIR
             }
         }
     });
-    // 2. Register Plugins
-    // Note: In a real dynamic system we might load these from a folder
-    // console.log('Registering plugins...');
-    // Register Plugins
-    // UI Plugin first or last? 
-    // If first, it captures subsequent logs.
+    runtime.logger.info('Registering plugins...');
     runtime.registerPlugin(CorePlugin);
     runtime.registerPlugin(DownloaderPlugin);
-    runtime.registerPlugin(BrowserPlugin);
+    runtime.registerPlugin(BrowserManagerPlugin);
+    runtime.registerPlugin(WSLLauncherPlugin);
+    runtime.registerPlugin(NativeLauncherPlugin);
     runtime.registerPlugin(ServerPlugin);
     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
@@ -118,18 +138,18 @@ async function main() {
         await ctx.actions.runAction('core:log', { level: 'error', message: 'Initial check failed. Could not verify job or download extension.' });
         process.exit(1);
     }
-    // Start Browser (This will block until browser is closed OR return immediately if detached)
-    const browserSessionResult = await ctx.actions.runAction('browser:start', null);
-    // If detached launch (result=true) or web-ext blocked and finished...
-    // We should ONLY exit if the loop is also done (which it never is unless disposed).
-    // Actually, if web-ext finishes (e.g. user closed browser), we might want to exit?
-    // But for Detached Mode, we MUST stay open to poll updates.
-    // If browser:start returned, it means either:
-    // 1. Browser closed (web-ext mode) -> we arguably should exit.
-    // 2. Detached mode started -> we MUST NOT exit.
-    // Changing logic: rely on SIGINT to exit.
+    // Launch Browser
+    await ctx.actions.runAction('browser:start', {});
+    // Keep process alive
+    process.on('SIGINT', async () => {
+        await ctx.actions.runAction('core:log', { level: 'info', message: 'Shutting down...' });
+        process.exit(0);
+    });
     runtime.logger.info('Press Ctrl+C to exit.');
-}
+})().catch((err) => {
+    console.error(chalk.red('Fatal Error:'), err.message || err);
+    process.exit(1);
+});
 // Handle global errors
 process.on('uncaughtException', (err) => {
     if (err.code === 'ECONNRESET' || err.message?.includes('ECONNRESET')) {
@@ -142,7 +162,3 @@ process.on('uncaughtException', (err) => {
 process.on('unhandledRejection', (reason) => {
     console.error('Unhandled Rejection:', reason);
 });
-main().catch(err => {
-    console.error(chalk.red('Fatal Error:'), err.message || err);
-    process.exit(1);
-});

package/dist/plugins/DownloaderPlugin.js

@@ -12,35 +12,36 @@ export const DownloaderPlugin = {
         const config = ctx.host.config;
         const DIST_DIR = path.join(config.workDir, 'dist');
         const DOWNLOAD_PATH = path.join(config.workDir, 'extension.zip');
-        const rawToken = config.token ? String(config.token) : '';
-        const token = rawToken.replace(/^Bearer\s+/i, '').trim();
-        // Auto-extract user ID from token if not provided
-        let userId = config.user;
-        if (!userId && token) {
-            try {
-                const parts = token.split('.');
-                if (parts.length === 3) {
-                    const payload = JSON.parse(Buffer.from(parts[1], 'base64').toString());
-                    userId = payload.id || payload.sub || payload.userId;
-                    // Add cleanup logging
-                    if (userId)
-                        ctx.actions.runAction('core:log', { level: 'info', message: `Extracted User ID: ${userId}` });
+        // Helper function to create axios client with current config
+        const createClient = () => {
+            const rawToken = config.token ? String(config.token) : '';
+            const token = rawToken.replace(/^Bearer\s+/i, '').trim();
+            // Auto-extract user ID from token if not provided
+            let userId = config.user;
+            if (!userId && token) {
+                try {
+                    const parts = token.split('.');
+                    if (parts.length === 3) {
+                        const payload = JSON.parse(Buffer.from(parts[1], 'base64').toString());
+                        userId = payload.id || payload.sub || payload.userId;
+                    }
+                }
+                catch (e) {
+                    // Ignore parse errors
                 }
             }
-            catch (e) {
-                // Ignore parse errors
-            }
-        }
-        const client = axios.create({
-            baseURL: config.host,
-            headers: {
-                'Authorization': token ? `Bearer ${token}` : undefined,
-                'X-User-Id': userId
-            },
-            httpsAgent: new https.Agent({
-                rejectUnauthorized: false
-            })
-        });
+            ctx.actions.runAction('core:log', { level: 'info', message: `[DEBUG] DownloaderPlugin creating client with userId: ${userId}` });
+            return axios.create({
+                baseURL: config.host,
+                headers: {
+                    'Authorization': token ? `Bearer ${token}` : undefined,
+                    'X-User-Id': userId
+                },
+                httpsAgent: new https.Agent({
+                    rejectUnauthorized: false
+                })
+            });
+        };
         const VERSION_FILE = path.join(config.workDir, 'version');
         let lastModified = '';
         if (fs.existsSync(VERSION_FILE)) {
@@ -58,6 +59,7 @@ export const DownloaderPlugin = {
                 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 job = res.data;
                         const newVersion = job.version;
@@ -114,6 +116,7 @@ export const DownloaderPlugin = {
             handler: async () => {
                 const spinner = ora('Downloading new version...').start();
                 try {
+                    const client = createClient(); // Create client with current config
                     const response = await client.get(`/download/${config.jobId}`, {
                         responseType: 'arraybuffer'
                     });
@@ -124,8 +127,10 @@ export const DownloaderPlugin = {
                     zip.extractAllTo(DIST_DIR, true);
                     // --- HOT RELOAD INJECTION ---
                     try {
+                        // Get dynamically allocated port from ServerPlugin
+                        const hotReloadPort = ctx.hotReloadPort || 3500;
                         const HOT_RELOAD_CODE = `
-const EVENT_SOURCE_URL = 'http://localhost:3500/status';
+const EVENT_SOURCE_URL = 'http://localhost:${hotReloadPort}/status';
 const CURRENT_JOB_ID = '${config.jobId}';
 let lastVersion = null;
 let lastJobId = null;

package/dist/plugins/ServerPlugin.js

@@ -2,9 +2,13 @@ import http from 'http';
 export const ServerPlugin = {
     name: 'server',
     version: '1.0.0',
-    setup(ctx) {
+    async setup(ctx) {
         let currentVersion = '0.0.0';
-        const PORT = 3500;
+        // Try to bind to a port, retrying with incremented ports on failure
+        const startPort = 3500;
+        const maxAttempts = 100;
+        let allocatedPort = null;
+        let server = null;
         // Listen for version updates
         ctx.events.on('downloader:updated', (data) => {
             if (data && data.version) {
@@ -12,10 +16,11 @@ export const ServerPlugin = {
                 ctx.actions.runAction('core:log', { level: 'info', message: `Server: Reporting version ${currentVersion}` });
             }
         });
-        const server = http.createServer((req, res) => {
+        // Create server with request handler
+        const requestHandler = (req, res) => {
             // CORS Headers
             res.setHeader('Access-Control-Allow-Origin', '*');
-            res.setHeader('Access-Control-Allow-Methods', 'GET, OPTIONS');
+            res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
             res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
             if (req.method === 'OPTIONS') {
                 res.writeHead(204);
@@ -24,29 +29,76 @@ export const ServerPlugin = {
             }
             if (req.url === '/status') {
                 const currentJobId = ctx.host.config.jobId;
-                // ctx.actions.runAction('core:log', { level: 'info', message: `[DEBUG] Server: Extension requested status (Reporting: ${currentVersion})` });
                 res.writeHead(200, { 'Content-Type': 'application/json' });
                 res.end(JSON.stringify({
                     version: currentVersion,
-                    jobId: currentJobId
+                    jobId: currentJobId,
+                    port: allocatedPort
                 }));
             }
+            else if (req.url === '/disconnect' && req.method === 'POST') {
+                // Trigger browser stop
+                ctx.actions.runAction('core:log', { level: 'info', message: '[API] Disconnect request received' });
+                ctx.actions.runAction('browser:stop', null).then((result) => {
+                    ctx.actions.runAction('core:log', { level: 'info', message: `[API] Browser stop result: ${result}` });
+                }).catch((err) => {
+                    ctx.actions.runAction('core:log', { level: 'error', message: `[API] Browser stop failed: ${err.message}` });
+                });
+                res.writeHead(200, { 'Content-Type': 'application/json' });
+                res.end(JSON.stringify({ success: true }));
+            }
             else {
                 res.writeHead(404);
                 res.end('Not Found');
             }
-        });
-        server.listen(PORT, () => {
-            ctx.actions.runAction('core:log', { level: 'info', message: `Hot Reload Server running on port ${PORT}` });
-        });
-        server.on('error', (err) => {
-            if (err.code === 'EADDRINUSE') {
-                ctx.actions.runAction('core:log', { level: 'error', message: `Port ${PORT} is busy. Hot reload may fail.` });
+        };
+        // Try to bind to ports sequentially
+        for (let attempt = 0; attempt < maxAttempts; attempt++) {
+            const port = startPort + attempt;
+            try {
+                server = http.createServer(requestHandler);
+                // Wrap listen in a promise to handle async properly
+                await new Promise((resolve, reject) => {
+                    server.once('error', (err) => {
+                        if (err.code === 'EADDRINUSE') {
+                            reject(err);
+                        }
+                        else {
+                            reject(err);
+                        }
+                    });
+                    server.once('listening', () => {
+                        resolve();
+                    });
+                    server.listen(port);
+                });
+                // Success! Port is allocated
+                allocatedPort = port;
+                await ctx.actions.runAction('core:log', { level: 'info', message: `Hot Reload Server running on port ${allocatedPort}` });
+                break;
             }
-            else {
-                ctx.actions.runAction('core:log', { level: 'error', message: `Server error: ${err.message}` });
+            catch (err) {
+                if (err.code === 'EADDRINUSE') {
+                    // Port busy, try next one
+                    if (server) {
+                        server.removeAllListeners();
+                        server = null;
+                    }
+                    continue;
+                }
+                else {
+                    // Other error, fail immediately
+                    await ctx.actions.runAction('core:log', { level: 'error', message: `Server error: ${err.message}` });
+                    return;
+                }
             }
-        });
+        }
+        if (!allocatedPort || !server) {
+            await ctx.actions.runAction('core:log', { level: 'error', message: `Failed to allocate port after ${maxAttempts} attempts (ports ${startPort}-${startPort + maxAttempts - 1})` });
+            return;
+        }
+        // Store port in context for DownloaderPlugin to use
+        ctx.hotReloadPort = allocatedPort;
         // Store server instance to close later
         ctx._serverInstance = server;
     },

package/dist/plugins/browser/BrowserManagerPlugin.js

@@ -0,0 +1,82 @@
+import path from 'path';
+import fs from 'fs-extra';
+import { findExtensionRoot, validateExtension } from '../../utils/browserUtils.js';
+export const BrowserManagerPlugin = {
+    name: 'browser-manager',
+    version: '1.0.0',
+    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'));
+        // --- SYNC FUNCTION ---
+        const syncToStaging = async () => {
+            try {
+                if (fs.existsSync(STAGING_DIR)) {
+                    fs.emptyDirSync(STAGING_DIR);
+                }
+                fs.ensureDirSync(STAGING_DIR);
+                fs.copySync(DIST_DIR, STAGING_DIR);
+                await ctx.actions.runAction('core:log', { level: 'info', message: `Synced code to Staging` });
+                // Emit staged event (optional)
+                ctx.events.emit('browser:staged', { path: STAGING_DIR });
+            }
+            catch (err) {
+                await ctx.actions.runAction('core:log', { level: 'error', message: `Failed to sync to staging: ${err.message}` });
+            }
+        };
+        const launchBrowser = async () => {
+            // Resolve proper root AFTER sync
+            const extensionRoot = findExtensionRoot(STAGING_DIR) || STAGING_DIR;
+            // Validate
+            const validation = validateExtension(extensionRoot);
+            if (!validation.valid) {
+                await ctx.actions.runAction('core:log', { level: 'error', message: `[CRITICAL] Extension validation failed: ${validation.error} in ${extensionRoot}` });
+            }
+            else if (extensionRoot !== STAGING_DIR) {
+                await ctx.actions.runAction('core:log', { level: 'info', message: `Detected nested extension at: ${path.basename(extensionRoot)}` });
+            }
+            // Delegate Launch
+            // We pass the filesystem path (STAGING_DIR or extensionRoot)
+            // The specific Launcher plugin handles environment specific path verification/conversion
+            await ctx.actions.runAction('launcher:launch', {
+                extensionPath: extensionRoot,
+                stagingDir: STAGING_DIR
+            });
+        };
+        // Action: Start Browser (Orchestrator)
+        ctx.actions.registerAction({
+            id: 'browser:start',
+            handler: async () => {
+                await syncToStaging();
+                await launchBrowser();
+                return true;
+            }
+        });
+        // Action: Stop Browser
+        ctx.actions.registerAction({
+            id: 'browser:stop',
+            handler: async () => {
+                await ctx.actions.runAction('core:log', { level: 'info', message: 'Stopping browser...' });
+                const result = await ctx.actions.runAction('launcher:kill', null);
+                return result;
+            }
+        });
+        // Event: Update detected
+        ctx.events.on('downloader:updated', async () => {
+            await ctx.actions.runAction('core:log', { level: 'info', message: 'Update detected. Syncing to staging...' });
+            await ctx.actions.runAction('browser:start', {});
+        });
+        // Event: Browser closed (from launcher)
+        ctx.events.on('browser:closed', async (data) => {
+            await ctx.actions.runAction('core:log', { level: 'info', message: `Browser closed with code ${data.code}` });
+            // Emit event that can be picked up by other plugins (e.g., to notify backend)
+            ctx.events.emit('session:terminated', { reason: 'browser_closed' });
+        });
+    }
+};

package/dist/plugins/browser/NativeLauncherPlugin.js

@@ -0,0 +1,91 @@
+import path from 'path';
+import fs from 'fs-extra';
+import { spawn } from 'child_process';
+import { findChrome, normalizePathToWindows } from '../../utils/browserUtils.js';
+let chromeProcess = null;
+export const NativeLauncherPlugin = {
+    name: 'native-launcher',
+    version: '1.0.0',
+    setup(ctx) {
+        // Only active if NOT in WSL
+        const isWSL = fs.existsSync('/mnt/c');
+        if (isWSL)
+            return;
+        ctx.actions.registerAction({
+            id: 'launcher:launch',
+            handler: async (payload) => {
+                const config = ctx.host.config;
+                const chromePath = findChrome();
+                if (!chromePath) {
+                    await ctx.actions.runAction('core:log', { level: 'error', message: 'Chrome not found.' });
+                    return false;
+                }
+                let executable = chromePath;
+                if (process.platform === 'win32') {
+                    executable = normalizePathToWindows(chromePath);
+                }
+                // Native Windows / Linux
+                let safeDist = path.resolve(payload.extensionPath);
+                // Default Profile
+                let safeProfile = path.join(path.dirname(config.workDir), 'profile');
+                if (process.platform === 'win32') {
+                    safeDist = normalizePathToWindows(safeDist);
+                    // Use C:\\Temp profile to avoid permissions issues
+                    safeProfile = 'C:\\\\Temp\\\\ai-ext-profile';
+                }
+                await ctx.actions.runAction('core:log', { level: 'info', message: `Native Launch Executable: ${executable} ` });
+                await ctx.actions.runAction('core:log', { level: 'info', message: `Native Launch Target: ${safeDist} ` });
+                const cleanArgs = [
+                    `--load - extension=${safeDist} `,
+                    `--user - data - dir=${safeProfile} `,
+                    '--no-first-run',
+                    '--no-default-browser-check',
+                    '--disable-gpu',
+                    'chrome://extensions'
+                ];
+                try {
+                    // Kill existing process if any
+                    if (chromeProcess) {
+                        chromeProcess.kill();
+                        chromeProcess = null;
+                    }
+                    chromeProcess = spawn(executable, cleanArgs, {
+                        detached: false,
+                        stdio: 'ignore'
+                    });
+                    // Monitor process exit
+                    chromeProcess.on('exit', async (code) => {
+                        await ctx.actions.runAction('core:log', { level: 'info', message: `Chrome exited with code ${code} ` });
+                        chromeProcess = null;
+                        ctx.events.emit('browser:closed', { code });
+                    });
+                    await ctx.actions.runAction('core:log', { level: 'info', message: `Chrome launched with PID: ${chromeProcess.pid} ` });
+                }
+                catch (spawnErr) {
+                    await ctx.actions.runAction('core:log', { level: 'error', message: `Spawn Failed: ${spawnErr.message} ` });
+                    return false;
+                }
+                return true;
+            }
+        });
+        // Register kill action
+        ctx.actions.registerAction({
+            id: 'launcher:kill',
+            handler: async () => {
+                if (chromeProcess) {
+                    await ctx.actions.runAction('core:log', { level: 'info', message: 'Terminating Chrome process...' });
+                    chromeProcess.kill();
+                    chromeProcess = null;
+                    return true;
+                }
+                return false;
+            }
+        });
+    },
+    dispose(ctx) {
+        if (chromeProcess) {
+            chromeProcess.kill();
+            chromeProcess = null;
+        }
+    }
+};

package/dist/plugins/browser/WSLLauncherPlugin.js

@@ -0,0 +1,180 @@
+import path from 'path';
+import fs from 'fs-extra';
+import { spawn } from 'child_process';
+import { findChrome } from '../../utils/browserUtils.js';
+let chromePid = null;
+export const WSLLauncherPlugin = {
+    name: 'wsl-launcher',
+    version: '1.0.0',
+    setup(ctx) {
+        // Only active in WSL
+        const isWSL = fs.existsSync('/mnt/c');
+        if (!isWSL)
+            return;
+        ctx.actions.registerAction({
+            id: 'launcher:launch',
+            handler: async (payload) => {
+                const chromePath = findChrome();
+                if (!chromePath) {
+                    await ctx.actions.runAction('core:log', { level: 'error', message: 'Chrome not found for detached launch.' });
+                    return false;
+                }
+                // Hardcoded Safe Paths for WSL Strategy
+                const winStagingDir = 'C:\\\\Temp\\\\ai-ext-preview';
+                const winProfile = 'C:\\\\Temp\\\\ai-ext-profile';
+                // Calculate Final Windows Extension Path
+                // We assume payload.extensionPath starts with /mnt/c/Temp/ai-ext-preview
+                // But simplified: We know we sync to STAGING_DIR.
+                // If extensionPath is nested, we handle it relative to STAGING_DIR.
+                let finalWinExtensionPath = winStagingDir;
+                if (payload.extensionPath !== payload.stagingDir) {
+                    const relative = path.relative(payload.stagingDir, payload.extensionPath);
+                    // Join with backslashes
+                    finalWinExtensionPath = path.posix.join(winStagingDir.replace(/\\\\/g, '/'), relative).replace(/\//g, '\\\\');
+                }
+                const driveLetter = 'c';
+                const winChromePath = chromePath
+                    .replace(new RegExp(`^/mnt/${driveLetter}/`), `${driveLetter.toUpperCase()}:\\\\`)
+                    .replace(/\//g, '\\\\');
+                await ctx.actions.runAction('core:log', { level: 'info', message: `WSL Launch Target (Win): ${finalWinExtensionPath}` });
+                // Create PowerShell Launch Script with PID capture
+                const psContent = `
+$chromePath = "${winChromePath}"
+$extPath = "${finalWinExtensionPath}"
+$profilePath = "${winProfile}"
+
+# Verify Paths
+if (-not (Test-Path -Path $extPath)) {
+    Write-Host "ERROR: Extension Path NOT FOUND!"
+    exit 1
+}
+
+# Create Profile Dir if needed
+if (-not (Test-Path -Path $profilePath)) {
+    New-Item -ItemType Directory -Force -Path $profilePath | Out-Null
+}
+
+$argsList = @(
+    "--load-extension=\`"$extPath\`"",
+    "--user-data-dir=\`"$profilePath\`"",
+    "--no-first-run",
+    "--no-default-browser-check",
+    "--disable-gpu",
+    "about:blank"
+)
+
+# Launch and capture PID
+$process = Start-Process -FilePath $chromePath -ArgumentList $argsList -PassThru
+Write-Host "CHROME_PID:$($process.Id)"
+`;
+                // Write ps1 to STAGING_DIR/launch.ps1
+                const psPath = path.join(payload.stagingDir, 'launch.ps1');
+                try {
+                    await fs.writeFile(psPath, psContent);
+                }
+                catch (e) {
+                    await ctx.actions.runAction('core:log', { level: 'error', message: `WSL Write PS1 Failed: ${e.message}` });
+                    return false;
+                }
+                // Execute via PowerShell
+                const psPathWin = `${winStagingDir}\\\\launch.ps1`;
+                const child = spawn('powershell.exe', ['-NoProfile', '-ExecutionPolicy', 'Bypass', '-File', psPathWin], {
+                    detached: false,
+                    stdio: ['ignore', 'pipe', 'pipe']
+                });
+                // Capture PID from output
+                if (child.stdout) {
+                    child.stdout.on('data', async (chunk) => {
+                        const msg = chunk.toString();
+                        const pidMatch = msg.match(/CHROME_PID:(\d+)/);
+                        if (pidMatch) {
+                            chromePid = parseInt(pidMatch[1], 10);
+                            await ctx.actions.runAction('core:log', { level: 'info', message: `Chrome launched with PID: ${chromePid}` });
+                            // Start monitoring the process
+                            monitorProcess(ctx, chromePid);
+                        }
+                        await ctx.actions.runAction('core:log', { level: 'info', message: `[PS1] ${msg.trim()}` });
+                    });
+                }
+                if (child.stderr) {
+                    child.stderr.on('data', async (chunk) => {
+                        const msg = chunk.toString();
+                        // Ignore minor PS noise unless critical
+                        if (msg.includes('Exec format error')) {
+                            await ctx.actions.runAction('core:log', { level: 'error', message: `CRITICAL: WSL Interop broken.` });
+                        }
+                        else if (msg.trim()) {
+                            await ctx.actions.runAction('core:log', { level: 'error', message: `Launch Error: ${msg}` });
+                        }
+                    });
+                }
+                return true;
+            }
+        });
+        // Register kill action
+        ctx.actions.registerAction({
+            id: 'launcher:kill',
+            handler: async () => {
+                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}` });
+                            }
+                        });
+                        return true;
+                    }
+                    catch (err) {
+                        await ctx.actions.runAction('core:log', { level: 'error', message: `Kill failed: ${err.message}` });
+                        return false;
+                    }
+                }
+                return false;
+            }
+        });
+        // Helper function to monitor process
+        function monitorProcess(ctx, pid) {
+            const checkInterval = setInterval(async () => {
+                try {
+                    const checkChild = spawn('powershell.exe', ['-Command', `Get-Process -Id ${pid} -ErrorAction SilentlyContinue`], {
+                        stdio: 'pipe'
+                    });
+                    let output = '';
+                    if (checkChild.stdout) {
+                        checkChild.stdout.on('data', (chunk) => {
+                            output += chunk.toString();
+                        });
+                    }
+                    checkChild.on('exit', async (code) => {
+                        if (!output.trim() || code !== 0) {
+                            // Process no longer exists
+                            clearInterval(checkInterval);
+                            await ctx.actions.runAction('core:log', { level: 'info', message: 'Chrome process exited.' });
+                            chromePid = null;
+                            ctx.events.emit('browser:closed', { code: 0 });
+                        }
+                    });
+                }
+                catch (err) {
+                    clearInterval(checkInterval);
+                }
+            }, 2000); // Check every 2 seconds
+        }
+    },
+    dispose(ctx) {
+        if (chromePid) {
+            // Attempt to kill on cleanup
+            spawn('powershell.exe', ['-Command', `Stop-Process -Id ${chromePid} -Force`], { stdio: 'ignore' });
+            chromePid = null;
+        }
+    }
+};

package/dist/utils/browserUtils.js

@@ -0,0 +1,79 @@
+import path from 'path';
+import fs from 'fs-extra';
+const CHROME_PATHS = [
+    // Standard Windows Paths
+    'C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe',
+    'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe',
+    // WSL Mappings
+    '/mnt/c/Program Files/Google/Chrome/Application/chrome.exe',
+    '/mnt/c/Program Files (x86)/Google/Chrome/Application/chrome.exe',
+    // Git Bash / Unix-y Windows Environment Mappings
+    '/c/Program Files/Google/Chrome/Application/chrome.exe',
+    '/c/Program Files (x86)/Google/Chrome/Application/chrome.exe',
+    // Linux
+    '/usr/bin/google-chrome',
+    '/usr/bin/chromium'
+];
+export function findChrome() {
+    for (const p of CHROME_PATHS) {
+        if (fs.existsSync(p))
+            return p;
+    }
+    return null;
+}
+// --- Helper to find actual extension root (handle nested folder in zip) ---
+export const findExtensionRoot = (dir) => {
+    if (fs.existsSync(path.join(dir, 'manifest.json')))
+        return dir;
+    // Check immediate subdirectories (depth 1)
+    try {
+        const items = fs.readdirSync(dir);
+        for (const item of items) {
+            const fullPath = path.join(dir, item);
+            if (fs.statSync(fullPath).isDirectory()) {
+                if (fs.existsSync(path.join(fullPath, 'manifest.json'))) {
+                    return fullPath;
+                }
+            }
+        }
+    }
+    catch (e) {
+        // Dir might be empty or invalid
+    }
+    return null;
+};
+export const normalizePathToWindows = (p) => {
+    // Handle Git Bash /c/ style
+    const gitBashMatch = p.match(/^\/([a-z])\/(.*)/i);
+    if (gitBashMatch) {
+        return `${gitBashMatch[1].toUpperCase()}:\\${gitBashMatch[2].replace(/\//g, '\\')}`;
+    }
+    // Handle Forward slashes
+    return p.replace(/\//g, '\\');
+};
+export const stripTrailingSlash = (p) => {
+    return p.replace(/[\\\/]+$/, '');
+};
+// --- Helper to validate extension directory existence and structure ---
+export const validateExtension = (dir) => {
+    if (!fs.existsSync(dir)) {
+        return { valid: false, error: 'Directory does not exist' };
+    }
+    const stats = fs.statSync(dir);
+    if (!stats.isDirectory()) {
+        return { valid: false, error: 'Path is not a directory' };
+    }
+    const manifestPath = path.join(dir, 'manifest.json');
+    if (!fs.existsSync(manifestPath)) {
+        return { valid: false, error: 'manifest.json missing' };
+    }
+    // Basic JSON validity check
+    try {
+        const content = fs.readFileSync(manifestPath, 'utf-8');
+        JSON.parse(content);
+    }
+    catch (e) {
+        return { valid: false, error: 'manifest.json is invalid JSON' };
+    }
+    return { valid: true };
+};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "ai-extension-preview",
-    "version": "0.1.10",
+    "version": "0.1.12",
     "description": "Local preview tool for AI Extension Builder",
     "type": "module",
     "bin": {

package/dist/plugins/BrowserPlugin.js

@@ -1,288 +0,0 @@
-import path from 'path';
-import { spawn } from 'child_process';
-import fs from 'fs-extra';
-const CHROME_PATHS = [
-    // Standard Windows Paths
-    'C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe',
-    'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe',
-    // WSL Mappings
-    '/mnt/c/Program Files/Google/Chrome/Application/chrome.exe',
-    '/mnt/c/Program Files (x86)/Google/Chrome/Application/chrome.exe',
-    // Git Bash / Unix-y Windows Environment Mappings
-    '/c/Program Files/Google/Chrome/Application/chrome.exe',
-    '/c/Program Files (x86)/Google/Chrome/Application/chrome.exe',
-    // Linux
-    '/usr/bin/google-chrome',
-    '/usr/bin/chromium'
-];
-function findChrome() {
-    for (const p of CHROME_PATHS) {
-        if (fs.existsSync(p))
-            return p;
-    }
-    return null;
-}
-// --- Helper to find actual extension root (handle nested folder in zip) ---
-export const findExtensionRoot = (dir) => {
-    if (fs.existsSync(path.join(dir, 'manifest.json')))
-        return dir;
-    // Check immediate subdirectories (depth 1)
-    try {
-        const items = fs.readdirSync(dir);
-        for (const item of items) {
-            const fullPath = path.join(dir, item);
-            if (fs.statSync(fullPath).isDirectory()) {
-                if (fs.existsSync(path.join(fullPath, 'manifest.json'))) {
-                    return fullPath;
-                }
-            }
-        }
-    }
-    catch (e) {
-        // Dir might be empty or invalid
-    }
-    return null;
-};
-export const normalizePathToWindows = (p) => {
-    // Handle Git Bash /c/ style
-    const gitBashMatch = p.match(/^\/([a-z])\/(.*)/i);
-    if (gitBashMatch) {
-        return `${gitBashMatch[1].toUpperCase()}:\\${gitBashMatch[2].replace(/\//g, '\\')}`;
-    }
-    // Handle Forward slashes
-    return p.replace(/\//g, '\\');
-};
-export const stripTrailingSlash = (p) => {
-    return p.replace(/[\\\/]+$/, '');
-};
-// --- Helper to validate extension directory existence and structure ---
-export const validateExtension = (dir) => {
-    if (!fs.existsSync(dir)) {
-        return { valid: false, error: 'Directory does not exist' };
-    }
-    const stats = fs.statSync(dir);
-    if (!stats.isDirectory()) {
-        return { valid: false, error: 'Path is not a directory' };
-    }
-    const manifestPath = path.join(dir, 'manifest.json');
-    if (!fs.existsSync(manifestPath)) {
-        return { valid: false, error: 'manifest.json missing' };
-    }
-    // Basic JSON validity check
-    try {
-        const content = fs.readFileSync(manifestPath, 'utf-8');
-        JSON.parse(content);
-    }
-    catch (e) {
-        return { valid: false, error: 'manifest.json is invalid JSON' };
-    }
-    return { valid: true };
-};
-export const BrowserPlugin = {
-    name: 'browser',
-    version: '1.0.0',
-    setup(ctx) {
-        const config = ctx.host.config;
-        const DIST_DIR = path.join(config.workDir, 'dist');
-        let runner = null;
-        const launchDetached = async () => {
-            const chromePath = findChrome();
-            if (!chromePath) {
-                await ctx.actions.runAction('core:log', { level: 'error', message: 'Chrome not found for detached launch.' });
-                return false;
-            }
-            const isWSL = fs.existsSync('/mnt/c');
-            let executable = chromePath;
-            // Normalize Executable for Native Windows (Git Bash)
-            if (!isWSL && process.platform === 'win32') {
-                executable = normalizePathToWindows(chromePath);
-            }
-            const STAGING_DIR = isWSL ? '/mnt/c/Temp/ai-ext-preview' : path.join(config.workDir, '../staging');
-            const WIN_PROFILE_DIR = 'C:/Temp/ai-ext-profile';
-            // For native windows/linux, use local staging path
-            // Note: We will evaluate actual extension root later, but base is STAGING_DIR
-            const EXTENSION_PATH = isWSL ? 'C:/Temp/ai-ext-preview' : STAGING_DIR;
-            // --- SYNC FUNCTION ---
-            const syncToStaging = async () => {
-                try {
-                    if (fs.existsSync(STAGING_DIR)) {
-                        fs.emptyDirSync(STAGING_DIR);
-                    }
-                    fs.ensureDirSync(STAGING_DIR);
-                    fs.copySync(DIST_DIR, STAGING_DIR);
-                    await ctx.actions.runAction('core:log', { level: 'info', message: `Synced code to Staging` });
-                    // Emit staged event for ServerPlugin (optional for now, but good practice)
-                    ctx.events.emit('browser:staged', { path: STAGING_DIR });
-                }
-                catch (err) {
-                    await ctx.actions.runAction('core:log', { level: 'error', message: `Failed to sync to staging: ${err.message}` });
-                }
-            };
-            // Initial Sync
-            await syncToStaging();
-            // Resolve proper root AFTER sync
-            let extensionRoot = findExtensionRoot(STAGING_DIR) || STAGING_DIR;
-            // Check if we found a valid root
-            const validation = validateExtension(extensionRoot);
-            if (!validation.valid) {
-                await ctx.actions.runAction('core:log', { level: 'error', message: `[CRITICAL] Extension validation failed: ${validation.error} in ${extensionRoot}` });
-                await ctx.actions.runAction('core:log', { level: 'info', message: `Checked Path: ${extensionRoot}` });
-                // We proceed anyway? Or should we stop? 
-                // Previous logic proceeded but logged critical error. 
-                // Let's keep it logging critical but maybe return false if we wanted to be strict.
-                // However, user might fix it live.
-            }
-            else if (extensionRoot !== STAGING_DIR) {
-                await ctx.actions.runAction('core:log', { level: 'info', message: `Detected nested extension at: ${path.basename(extensionRoot)}` });
-            }
-            // Listen for updates and re-sync
-            ctx.events.on('downloader:updated', async (data) => {
-                await ctx.actions.runAction('core:log', { level: 'info', message: 'Update detected. Syncing to staging...' });
-                await syncToStaging();
-                // Re-validate on update? 
-                // const newRoot = findExtensionRoot(STAGING_DIR) || STAGING_DIR;
-                // const newValidation = validateExtension(newRoot);
-                // if (!newValidation.valid) ...
-            });
-            await ctx.actions.runAction('core:log', { level: 'info', message: 'Browser running in Detached Mode.' });
-            // Launch Logic
-            // Launch Logic
-            if (isWSL) {
-                // -------------------------------------------------------------------------
-                // WSL STRATEGY (Validated 2025-12-24)
-                // 1. Use Windows User Profile for staging to avoid Permission/Path issues
-                // 2. Use PowerShell script to launch Chrome to reliably pass arguments
-                // -------------------------------------------------------------------------
-                // 1. Setup Safe Paths (C:\Temp)
-                // We use the same path that syncToStaging() used (/mnt/c/Temp/ai-ext-preview)
-                const winStagingDir = 'C:\\Temp\\ai-ext-preview';
-                const winProfile = 'C:\\Temp\\ai-ext-profile';
-                let userProfileWin = 'C:\\Temp'; // Legacy variable support
-                const driveLetter = 'c';
-                // Calculate final paths
-                let finalWinExtensionPath = winStagingDir;
-                // Handle nested extension root
-                if (extensionRoot !== STAGING_DIR) {
-                    const relative = path.relative(STAGING_DIR, extensionRoot);
-                    finalWinExtensionPath = path.posix.join(winStagingDir.replace(/\\/g, '/'), relative).replace(/\//g, '\\');
-                }
-                const winChromePath = chromePath
-                    .replace(new RegExp(`^/mnt/${driveLetter}/`), `${driveLetter.toUpperCase()}:\\`)
-                    .replace(/\//g, '\\');
-                await ctx.actions.runAction('core:log', { level: 'info', message: `WSL Launch Target (Win): ${finalWinExtensionPath}` });
-                // await ctx.actions.runAction('core:log', { level: 'info', message: `WSL Profile (Win): ${winProfile}` });
-                // Create PowerShell Launch Script
-                const psContent = `
-$chromePath = "${winChromePath}"
-$extPath = "${finalWinExtensionPath}"
-$profilePath = "${winProfile}"
-
-Write-Host "DEBUG: ChromePath: $chromePath"
-Write-Host "DEBUG: ExtPath: $extPath"
-Write-Host "DEBUG: ProfilePath: $profilePath"
-
-# Verify Paths
-if (-not (Test-Path -Path $extPath)) {
-    Write-Host "ERROR: Extension Path NOT FOUND!"
-} else {
-    Write-Host "DEBUG: Extension Path Exists."
-}
-
-# Create Profile Dir if needed
-if (-not (Test-Path -Path $profilePath)) {
-    New-Item -ItemType Directory -Force -Path $profilePath | Out-Null
-}
-
-$argsList = @(
-    "--load-extension=""$extPath""",
-    "--user-data-dir=""$profilePath""",
-    "--no-first-run",
-    "--no-default-browser-check",
-    "--disable-gpu",
-    "about:blank"
-)
-
-# Convert to single string to ensure Start-Process handles it safely
-$argStr = $argsList -join " "
-Write-Host "DEBUG: Args: $argStr"
-
-Write-Host "DEBUG: Launching Chrome..."
-Start-Process -FilePath $chromePath -ArgumentList $argStr
-`;
-                // Write ps1 to /mnt/c/Temp/ai-ext-preview/launch.ps1 (Same as STAGING_DIR)
-                const psPath = path.join(STAGING_DIR, 'launch.ps1');
-                try {
-                    await fs.writeFile(psPath, psContent);
-                }
-                catch (e) {
-                    await ctx.actions.runAction('core:log', { level: 'error', message: `WSL Write PS1 Failed: ${e.message}` });
-                }
-                // Execute via PowerShell (Spawn detached)
-                // psPathWin is C:\\Temp\\ai-ext-preview\\launch.ps1
-                const psPathWin = `${winStagingDir}\\launch.ps1`;
-                const child = spawn('powershell.exe', ['-NoProfile', '-ExecutionPolicy', 'Bypass', '-File', psPathWin], {
-                    detached: true,
-                    stdio: ['ignore', 'pipe', 'pipe'] // Pipe stderr AND stdout to catch launch errors/debug
-                });
-                if (child.stdout) {
-                    child.stdout.on('data', async (chunk) => {
-                        const msg = chunk.toString();
-                        await ctx.actions.runAction('core:log', { level: 'info', message: `[PS1] ${msg.trim()}` });
-                    });
-                }
-                if (child.stderr) {
-                    child.stderr.on('data', async (chunk) => {
-                        const msg = chunk.toString();
-                        await ctx.actions.runAction('core:log', { level: 'error', message: `Launch Error (Stderr): ${msg}` });
-                        if (msg.includes('Exec format error')) {
-                            await ctx.actions.runAction('core:log', { level: 'error', message: `CRITICAL: WSL Interop is broken. Cannot launch Chrome.` });
-                            await ctx.actions.runAction('core:log', { level: 'error', message: `FIX: Open PowerShell as Admin and run: wsl --shutdown` });
-                            ctx.events.emit('browser:launch-failed', { reason: 'WSL_INTEROP_BROKEN' });
-                        }
-                    });
-                }
-                child.on('error', async (err) => {
-                    await ctx.actions.runAction('core:log', { level: 'error', message: `Launch Failed: ${err.message}` });
-                    ctx.events.emit('browser:launch-failed', { reason: err.message });
-                });
-                child.unref();
-                return true;
-            }
-            else {
-                // Native Windows / Linux
-                // Use extensionRoot which points to the detected subfolder or root
-                const safeDist = path.resolve(extensionRoot);
-                const safeProfile = path.join(path.dirname(config.workDir), 'profile'); // ~/.ai-extension-preview/profile
-                await ctx.actions.runAction('core:log', { level: 'info', message: `Native Launch Executable: ${executable}` });
-                await ctx.actions.runAction('core:log', { level: 'info', message: `Native Launch Target: ${safeDist}` });
-                const cleanArgs = [
-                    `--load-extension=${safeDist}`,
-                    `--user-data-dir=${safeProfile}`,
-                    '--no-first-run',
-                    '--no-default-browser-check',
-                    '--disable-gpu',
-                    'chrome://extensions'
-                ];
-                try {
-                    const subprocess = spawn(executable, cleanArgs, {
-                        detached: true,
-                        stdio: 'ignore'
-                    });
-                    subprocess.unref();
-                }
-                catch (spawnErr) {
-                    await ctx.actions.runAction('core:log', { level: 'error', message: `Spawn Failed: ${spawnErr.message}` });
-                }
-                return true;
-            }
-        };
-        ctx.actions.registerAction({
-            id: 'browser:start',
-            handler: async () => {
-                // Force Detached Mode for Reliability on ALL platforms
-                // This creates the stable "Staging" workflow we want.
-                return await launchDetached();
-            }
-        });
-    }
-};