vision-navigator 1.0.0

package/dist/server.js

@@ -0,0 +1,409 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.startServer = startServer;
+require("dotenv/config");
+const express_1 = __importDefault(require("express"));
+const navigator_1 = require("./navigator");
+const storage_1 = require("./storage");
+const path_1 = __importDefault(require("path"));
+const js_yaml_1 = __importDefault(require("js-yaml"));
+const fs_1 = __importDefault(require("fs"));
+const app = (0, express_1.default)();
+app.use(express_1.default.json());
+app.use(express_1.default.text({ type: ['text/yaml', 'application/x-yaml', 'application/yaml'] }));
+const activeRuns = new Map();
+const groqPlatformUsage = new Map();
+const groqDailyLimit = Number(process.env.GROQ_DAILY_LIMIT || 5);
+const storage = new storage_1.Storage();
+// Serve static frontend and screenshots
+app.use(express_1.default.static(path_1.default.join(__dirname, '../public')));
+app.use('/screenshots', express_1.default.static(path_1.default.join(process.cwd(), 'screenshots')));
+function currentDateKey() {
+    const d = new Date();
+    return `${d.getUTCFullYear()}-${String(d.getUTCMonth() + 1).padStart(2, '0')}-${String(d.getUTCDate()).padStart(2, '0')}`;
+}
+function getClientKey(req) {
+    const ip = (req.headers['x-forwarded-for'] || req.ip || '').toString();
+    return ip.split(',')[0].trim() || 'unknown';
+}
+function enforceGroqPlatformLimit(req, res) {
+    const hasPlatformKey = Boolean(process.env.GROQ_API_KEY) || String(process.env.OPENROUTER_API_KEY || '').startsWith('gsk_');
+    const byoKey = req.get('x-groq-api-key');
+    const requestedProvider = req.get('x-llm-provider');
+    if (requestedProvider && requestedProvider !== 'groq')
+        return true;
+    if (!hasPlatformKey || byoKey)
+        return true;
+    const key = getClientKey(req);
+    const date = currentDateKey();
+    const prev = groqPlatformUsage.get(key);
+    if (!prev || prev.date !== date) {
+        groqPlatformUsage.set(key, { date, count: 0 });
+    }
+    const now = groqPlatformUsage.get(key);
+    if (!now)
+        return true;
+    if (now.count >= groqDailyLimit) {
+        res.status(429).json({ error: `Demo limit reached (${groqDailyLimit} generations/day). Bring your own Groq API key.` });
+        return false;
+    }
+    now.count += 1;
+    groqPlatformUsage.set(key, now);
+    return true;
+}
+function makeNavigatorFromRequest(req) {
+    const groqApiKey = req.get('x-groq-api-key') || undefined;
+    const groqModel = req.get('x-groq-model') || undefined;
+    const provider = req.get('x-llm-provider') || undefined;
+    const normalizedProvider = provider === 'groq' || provider === 'openrouter' || provider === 'ollama' ? provider : undefined;
+    const hasEnvGroqKey = Boolean(process.env.GROQ_API_KEY) || String(process.env.OPENROUTER_API_KEY || '').startsWith('gsk_');
+    const effectiveProvider = normalizedProvider === 'groq' && !groqApiKey && !hasEnvGroqKey ? undefined : normalizedProvider;
+    return new navigator_1.Navigator(undefined, undefined, {
+        provider: effectiveProvider,
+        groqApiKey,
+        groqModel
+    });
+}
+app.get('/runs', (req, res) => {
+    try {
+        const historyPath = path_1.default.join(process.cwd(), 'screenshots', 'runs.json');
+        if (fs_1.default.existsSync(historyPath)) {
+            const history = JSON.parse(fs_1.default.readFileSync(historyPath, 'utf8'));
+            res.json(history.reverse()); // Newest first
+        }
+        else {
+            res.json([]);
+        }
+    }
+    catch (e) {
+        res.status(500).json({ error: String(e) });
+    }
+});
+app.post('/workflow/stream', async (req, res) => {
+    res.setHeader('Content-Type', 'text/event-stream');
+    res.setHeader('Cache-Control', 'no-cache');
+    res.setHeader('Connection', 'keep-alive');
+    try {
+        if (!enforceGroqPlatformLimit(req, res))
+            return;
+        let workflow = req.body;
+        const contentType = req.get('Content-Type');
+        if (contentType && (contentType.includes('yaml') || contentType.includes('yml'))) {
+            if (typeof req.body === 'string') {
+                try {
+                    workflow = js_yaml_1.default.load(req.body);
+                }
+                catch (e) {
+                    res.write(`data: ${JSON.stringify({ error: "Invalid YAML format: " + String(e) })}\n\n`);
+                    return res.end();
+                }
+            }
+        }
+        if (!workflow || !workflow.steps) {
+            res.write(`data: ${JSON.stringify({ error: "Invalid workflow format" })}\n\n`);
+            return res.end();
+        }
+        const navigator = makeNavigatorFromRequest(req);
+        await navigator.ensureModelReady();
+        console.log("Starting streaming workflow execution...");
+        const runId = Date.now().toString();
+        const control = { aborted: false };
+        activeRuns.set(runId, { control });
+        res.write(`data: ${JSON.stringify({ started: true, runId })}\n\n`);
+        try {
+            const run = await navigator.runWorkflow(workflow, (stepResult) => {
+                res.write(`data: ${JSON.stringify({ step: stepResult, runId })}\n\n`);
+            }, { runId }, control);
+            res.write(`data: ${JSON.stringify({ done: true, run })}\n\n`);
+            res.end();
+        }
+        finally {
+            activeRuns.delete(runId);
+        }
+    }
+    catch (e) {
+        console.error("Server Error:", e);
+        res.write(`data: ${JSON.stringify({ error: String(e) })}\n\n`);
+        res.end();
+    }
+});
+app.post('/workflow', async (req, res) => {
+    try {
+        if (!enforceGroqPlatformLimit(req, res))
+            return;
+        let workflow = req.body;
+        // Check if body is string (YAML) and parse it
+        const contentType = req.get('Content-Type');
+        if (contentType && (contentType.includes('yaml') || contentType.includes('yml'))) {
+            if (typeof req.body === 'string') {
+                try {
+                    workflow = js_yaml_1.default.load(req.body);
+                }
+                catch (e) {
+                    return res.status(400).json({ error: "Invalid YAML format: " + String(e) });
+                }
+            }
+        }
+        if (!workflow || !workflow.steps) {
+            return res.status(400).json({ error: "Invalid workflow format" });
+        }
+        const navigator = makeNavigatorFromRequest(req);
+        await navigator.ensureModelReady();
+        console.log("Starting workflow execution...");
+        const runId = Date.now().toString();
+        const control = { aborted: false };
+        activeRuns.set(runId, { control });
+        let run;
+        try {
+            run = await navigator.runWorkflow(workflow, undefined, { runId }, control);
+        }
+        finally {
+            activeRuns.delete(runId);
+        }
+        // Check if results are empty and there were errors
+        if (run.results.length === 0 && workflow.steps && workflow.steps.length > 0) {
+            return res.status(500).json({
+                error: "Workflow execution failed to produce results. Check server logs for details.",
+                results: [],
+                run
+            });
+        }
+        res.json({ run });
+    }
+    catch (e) {
+        console.error("Server Error:", e);
+        res.status(500).json({ error: String(e) });
+    }
+});
+app.post('/run/:runId/stop', (req, res) => {
+    const runId = String(req.params.runId || '');
+    const active = activeRuns.get(runId);
+    if (!active) {
+        return res.status(404).json({ error: "Run not found or already finished." });
+    }
+    active.control.aborted = true;
+    res.json({ ok: true, runId });
+});
+app.post('/suite/stream', async (req, res) => {
+    res.setHeader('Content-Type', 'text/event-stream');
+    res.setHeader('Cache-Control', 'no-cache');
+    res.setHeader('Connection', 'keep-alive');
+    try {
+        if (!enforceGroqPlatformLimit(req, res))
+            return;
+        let suite = req.body;
+        const contentType = req.get('Content-Type');
+        if (contentType && (contentType.includes('yaml') || contentType.includes('yml'))) {
+            if (typeof req.body === 'string') {
+                try {
+                    suite = js_yaml_1.default.load(req.body);
+                }
+                catch (e) {
+                    res.write(`data: ${JSON.stringify({ error: "Invalid YAML format: " + String(e) })}\n\n`);
+                    return res.end();
+                }
+            }
+        }
+        const tests = suite?.tests || suite?.workflows || suite?.suite?.tests;
+        if (!tests || !Array.isArray(tests) || tests.length === 0) {
+            res.write(`data: ${JSON.stringify({ error: "Invalid suite format (expected tests: [...])" })}\n\n`);
+            return res.end();
+        }
+        const suiteName = suite?.name || suite?.suite?.name || "Unnamed Suite";
+        res.write(`data: ${JSON.stringify({ startedSuite: true, suiteName })}\n\n`);
+        const navigator = makeNavigatorFromRequest(req);
+        await navigator.ensureModelReady();
+        const suiteResults = [];
+        for (let i = 0; i < tests.length; i++) {
+            const t = tests[i];
+            const testName = t?.name || t?.id || t?.title || "Unnamed Test";
+            let workflow = t?.workflow || t?.test || t;
+            if (typeof workflow === 'string') {
+                workflow = js_yaml_1.default.load(workflow);
+            }
+            else if (t?.workflow_file) {
+                const filePath = path_1.default.resolve(process.cwd(), String(t.workflow_file));
+                if (!fs_1.default.existsSync(filePath)) {
+                    const entry = { testName, status: "failed", error: `workflow_file not found: ${t.workflow_file}` };
+                    suiteResults.push(entry);
+                    res.write(`data: ${JSON.stringify({ doneTest: true, ...entry })}\n\n`);
+                    continue;
+                }
+                const fileContent = fs_1.default.readFileSync(filePath, 'utf-8');
+                workflow = js_yaml_1.default.load(fileContent);
+            }
+            else if (t?.steps && Array.isArray(t.steps)) {
+                workflow = { steps: t.steps };
+            }
+            if (!workflow || !workflow.steps) {
+                const entry = { testName, status: "failed", error: "Invalid workflow format in test" };
+                suiteResults.push(entry);
+                res.write(`data: ${JSON.stringify({ doneTest: true, ...entry })}\n\n`);
+                continue;
+            }
+            const runId = `${Date.now()}_${i + 1}`;
+            const control = { aborted: false };
+            activeRuns.set(runId, { control });
+            res.write(`data: ${JSON.stringify({ startedTest: true, suiteName, testName, runId })}\n\n`);
+            try {
+                const run = await navigator.runWorkflow(workflow, (stepResult) => {
+                    res.write(`data: ${JSON.stringify({ step: stepResult, suiteName, testName, runId })}\n\n`);
+                }, { suiteName, testName, runId }, control);
+                const entry = { testName, runId: run.runId, status: run.status, issues: run.issues?.length || 0 };
+                suiteResults.push(entry);
+                res.write(`data: ${JSON.stringify({ doneTest: true, ...entry })}\n\n`);
+            }
+            finally {
+                activeRuns.delete(runId);
+            }
+        }
+        res.write(`data: ${JSON.stringify({ done: true, suiteName, results: suiteResults })}\n\n`);
+        res.end();
+    }
+    catch (e) {
+        res.write(`data: ${JSON.stringify({ error: String(e) })}\n\n`);
+        res.end();
+    }
+});
+app.post('/suite', async (req, res) => {
+    try {
+        if (!enforceGroqPlatformLimit(req, res))
+            return;
+        let suite = req.body;
+        const contentType = req.get('Content-Type');
+        if (contentType && (contentType.includes('yaml') || contentType.includes('yml'))) {
+            if (typeof req.body === 'string') {
+                try {
+                    suite = js_yaml_1.default.load(req.body);
+                }
+                catch (e) {
+                    return res.status(400).json({ error: "Invalid YAML format: " + String(e) });
+                }
+            }
+        }
+        const tests = suite?.tests || suite?.workflows || suite?.suite?.tests;
+        if (!tests || !Array.isArray(tests) || tests.length === 0) {
+            return res.status(400).json({ error: "Invalid suite format (expected tests: [...])" });
+        }
+        const suiteName = suite?.name || suite?.suite?.name || "Unnamed Suite";
+        const navigator = makeNavigatorFromRequest(req);
+        await navigator.ensureModelReady();
+        const suiteResults = [];
+        for (let i = 0; i < tests.length; i++) {
+            const t = tests[i];
+            const testName = t?.name || t?.id || t?.title || "Unnamed Test";
+            let workflow = t?.workflow || t?.test || t;
+            if (typeof workflow === 'string') {
+                workflow = js_yaml_1.default.load(workflow);
+            }
+            else if (t?.workflow_file) {
+                const filePath = path_1.default.resolve(process.cwd(), String(t.workflow_file));
+                if (!fs_1.default.existsSync(filePath)) {
+                    suiteResults.push({ testName, status: "failed", error: `workflow_file not found: ${t.workflow_file}` });
+                    continue;
+                }
+                const fileContent = fs_1.default.readFileSync(filePath, 'utf-8');
+                workflow = js_yaml_1.default.load(fileContent);
+            }
+            else if (t?.steps && Array.isArray(t.steps)) {
+                workflow = { steps: t.steps };
+            }
+            if (!workflow || !workflow.steps) {
+                suiteResults.push({ testName, status: "failed", error: "Invalid workflow format in test" });
+                continue;
+            }
+            console.log(`Starting suite test: ${suiteName} / ${testName}`);
+            const runId = `${Date.now()}_${i + 1}`;
+            const control = { aborted: false };
+            activeRuns.set(runId, { control });
+            try {
+                const run = await navigator.runWorkflow(workflow, undefined, { suiteName, testName, runId }, control);
+                suiteResults.push({ testName, runId: run.runId, status: run.status, issues: run.issues?.length || 0 });
+            }
+            finally {
+                activeRuns.delete(runId);
+            }
+        }
+        res.json({ suiteName, results: suiteResults });
+    }
+    catch (e) {
+        console.error("Suite Error:", e);
+        res.status(500).json({ error: String(e) });
+    }
+});
+app.get('/health', (req, res) => {
+    res.json({ status: "ok" });
+});
+app.get(/^\/artifacts\/(.+)$/, async (req, res) => {
+    const objectName = String(req.params[0] || '').trim();
+    if (!objectName)
+        return res.status(400).json({ error: "Missing object name" });
+    try {
+        const ext = path_1.default.extname(objectName).toLowerCase();
+        const contentType = ext === '.png'
+            ? 'image/png'
+            : ext === '.jpg' || ext === '.jpeg'
+                ? 'image/jpeg'
+                : ext === '.gif'
+                    ? 'image/gif'
+                    : ext === '.webp'
+                        ? 'image/webp'
+                        : ext === '.json'
+                            ? 'application/json; charset=utf-8'
+                            : ext === '.html'
+                                ? 'text/html; charset=utf-8'
+                                : ext === '.txt' || ext === '.log'
+                                    ? 'text/plain; charset=utf-8'
+                                    : 'application/octet-stream';
+        res.setHeader('Content-Type', contentType);
+        res.setHeader('Cache-Control', 'no-store');
+        const stream = await storage.getObjectStream(objectName);
+        stream.on('error', (e) => {
+            if (!res.headersSent)
+                res.status(404);
+            res.end();
+        });
+        stream.pipe(res);
+    }
+    catch (e) {
+        res.status(404).json({ error: "Not found" });
+    }
+});
+app.get('/model/config', (req, res) => {
+    const hasGroqPlatformKey = Boolean(process.env.GROQ_API_KEY) || String(process.env.OPENROUTER_API_KEY || '').startsWith('gsk_');
+    const hasOpenRouter = Boolean(process.env.OPENROUTER_API_KEY) && !String(process.env.OPENROUTER_API_KEY || '').startsWith('gsk_');
+    let providerDefault = 'ollama';
+    if (hasGroqPlatformKey)
+        providerDefault = 'groq';
+    else if (hasOpenRouter)
+        providerDefault = 'openrouter';
+    const modelDefault = providerDefault === 'groq'
+        ? (process.env.GROQ_MODEL || 'llama-3.1-8b-instant')
+        : providerDefault === 'openrouter'
+            ? (process.env.OPENROUTER_MODEL || 'google/gemini-2.0-flash-exp:free')
+            : (process.env.MODEL || 'qwen2.5:3b');
+    const usageKey = getClientKey(req);
+    const date = currentDateKey();
+    const usage = groqPlatformUsage.get(usageKey);
+    const usageCount = usage && usage.date === date ? usage.count : 0;
+    res.json({
+        providerDefault,
+        modelDefault,
+        groqDailyLimit,
+        groqUsageCount: usageCount,
+        byoSupported: true
+    });
+});
+function startServer(port = 8000) {
+    app.listen(port, () => {
+        console.log(`Vision Navigator Web UI running at http://localhost:${port}`);
+    });
+}
+// Auto-start if run directly (for backward compatibility during dev)
+if (require.main === module) {
+    const PORT = process.env.PORT ? parseInt(process.env.PORT, 10) : 8000;
+    startServer(PORT);
+}

package/dist/storage.js

@@ -0,0 +1,132 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Storage = void 0;
+require("dotenv/config");
+const pocketbase_1 = __importDefault(require("pocketbase"));
+const Minio = __importStar(require("minio"));
+class Storage {
+    constructor() {
+        const pbUrl = process.env.POCKETBASE_URL || 'http://127.0.0.1:8090';
+        this.pb = new pocketbase_1.default(pbUrl);
+        const minioEndpoint = process.env.MINIO_ENDPOINT || '127.0.0.1';
+        const minioPort = parseInt(process.env.MINIO_PORT || '9000', 10);
+        const minioAccessKey = process.env.MINIO_ACCESS_KEY || 'minioadmin';
+        const minioSecretKey = process.env.MINIO_SECRET_KEY || 'minioadmin';
+        this.bucketName = process.env.MINIO_BUCKET || 'store-runs';
+        this.minioClient = new Minio.Client({
+            endPoint: minioEndpoint,
+            port: minioPort,
+            useSSL: false,
+            accessKey: minioAccessKey,
+            secretKey: minioSecretKey
+        });
+        this.init().catch(e => console.error("Storage init error:", e));
+    }
+    async init() {
+        try {
+            const exists = await this.minioClient.bucketExists(this.bucketName);
+            if (!exists) {
+                await this.minioClient.makeBucket(this.bucketName, 'us-east-1');
+                // Make bucket public so dashboard can read images directly
+                const policy = {
+                    Version: '2012-10-17',
+                    Statement: [
+                        {
+                            Action: ['s3:GetObject'],
+                            Effect: 'Allow',
+                            Principal: { AWS: ['*'] },
+                            Resource: [`arn:aws:s3:::${this.bucketName}/*`]
+                        }
+                    ]
+                };
+                await this.minioClient.setBucketPolicy(this.bucketName, JSON.stringify(policy));
+                console.log(`Created Minio bucket: ${this.bucketName}`);
+            }
+        }
+        catch (e) {
+            console.error(`Failed to initialize Minio bucket ${this.bucketName}:`, e);
+        }
+    }
+    async uploadFile(filePath, objectName) {
+        try {
+            await this.minioClient.fPutObject(this.bucketName, objectName, filePath);
+            return objectName;
+        }
+        catch (e) {
+            console.error(`Minio upload failed for ${objectName}:`, e);
+            throw e;
+        }
+    }
+    async getObjectStream(objectName) {
+        return await this.minioClient.getObject(this.bucketName, objectName);
+    }
+    async createRun(runId, status, images, report, issues, meta) {
+        try {
+            // First check if collection exists or try to authenticate if needed. 
+            // Assuming the runs collection exists and is open for create.
+            const record = await this.pb.collection('runs').create({
+                runId: runId, // if runId field exists, or we just rely on pb's own id
+                status: status,
+                images: images,
+                report: report,
+                issues: issues || [],
+                suiteName: meta?.suiteName,
+                testName: meta?.testName
+            });
+            console.log(`Saved run to PocketBase: ${record.id}`);
+            return record;
+        }
+        catch (e) {
+            console.error(`PocketBase createRun failed:`, e.message || e);
+            // Sometimes it's better not to fail the whole run if storage fails
+            return null;
+        }
+    }
+    async updateRun(recordId, data) {
+        try {
+            const record = await this.pb.collection('runs').update(recordId, data);
+            return record;
+        }
+        catch (e) {
+            console.error(`PocketBase updateRun failed:`, e.message || e);
+            return null;
+        }
+    }
+}
+exports.Storage = Storage;

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "vision-navigator",
+  "version": "1.0.0",
+  "description": "AI-powered browser testing and automation framework",
+  "main": "dist/navigator.js",
+  "bin": {
+    "vision-navigator": "./dist/cli.js"
+  },
+  "files": [
+    "dist",
+    "public"
+  ],
+  "scripts": {
+    "test": "npm run test:cli",
+    "test:cli": "node tests/test-cli.js",
+    "build": "tsc",
+    "start": "node dist/cli.js",
+    "dev": "nodemon src/server.ts",
+    "prepublishOnly": "npm run build"
+  },
+  "keywords": [
+    "ai",
+    "browser",
+    "testing",
+    "automation",
+    "cdp",
+    "vision"
+  ],
+  "author": "David Soderman",
+  "license": "MIT",
+  "type": "commonjs",
+  "dependencies": {
+    "@types/express": "^5.0.6",
+    "@types/js-yaml": "^4.0.9",
+    "@types/node": "^25.4.0",
+    "@types/ws": "^8.18.1",
+    "axios": "^1.13.6",
+    "dotenv": "^17.3.1",
+    "express": "^5.2.1",
+    "js-yaml": "^4.1.1",
+    "minio": "^8.0.7",
+    "nodemon": "^3.1.14",
+    "pocketbase": "^0.26.8",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.9.3",
+    "ws": "^8.19.0"
+  }
+}