web-agent-bridge 1.0.0

package/sdk/README.md

@@ -0,0 +1,55 @@
+# WAB Agent SDK
+
+SDK for building AI agents that interact with [Web Agent Bridge](https://github.com/abokenan444/web-agent-bridge).
+
+## Quick Start
+
+```javascript
+const puppeteer = require('puppeteer');
+const { WABAgent } = require('web-agent-bridge/sdk');
+
+const browser = await puppeteer.launch();
+const page = await browser.newPage();
+
+const agent = new WABAgent(page);
+await agent.navigateAndWait('https://example.com');
+
+// Discover available actions
+const actions = await agent.getActions();
+console.log(actions);
+
+// Execute an action
+const result = await agent.execute('signup', { email: 'user@example.com' });
+
+// Read page content
+const content = await agent.readContent('h1');
+
+await browser.close();
+```
+
+## BiDi Mode
+
+```javascript
+const agent = new WABAgent(page, { useBiDi: true });
+await agent.waitForBridge();
+
+const context = await agent.getBiDiContext();
+const actions = await agent.getActions();
+await agent.execute('click-login');
+```
+
+## API
+
+| Method | Description |
+|---|---|
+| `waitForBridge()` | Wait for WAB to load on the page |
+| `hasBridge()` | Check if WAB is available |
+| `getActions(category?)` | List available actions |
+| `getAction(name)` | Get a specific action |
+| `execute(name, params?)` | Execute an action |
+| `readContent(selector)` | Read element text content |
+| `getPageInfo()` | Get page metadata |
+| `authenticate(apiKey, meta?)` | Authenticate the agent |
+| `navigateAndWait(url)` | Navigate and wait for bridge |
+| `executeSteps(steps)` | Execute multiple actions in sequence |
+| `getBiDiContext()` | Get BiDi context (BiDi mode only) |

package/sdk/index.js

@@ -0,0 +1,167 @@
+/**
+ * WAB Agent SDK
+ *
+ * Helpers for building AI agents that interact with Web Agent Bridge.
+ * Works with Puppeteer, Playwright, or any browser automation tool.
+ *
+ * Usage:
+ *   const { WABAgent } = require('./sdk');
+ *   const agent = new WABAgent(page);
+ *   await agent.waitForBridge();
+ *   const actions = await agent.getActions();
+ *   await agent.execute('signup', { email: 'test@example.com' });
+ */
+
+class WABAgent {
+  /**
+   * @param {object} page — A Puppeteer or Playwright page object
+   * @param {object} [options]
+   * @param {number} [options.timeout=10000] — Default timeout in ms
+   * @param {boolean} [options.useBiDi=false] — Use BiDi interface instead of AICommands
+   */
+  constructor(page, options = {}) {
+    this.page = page;
+    this.timeout = options.timeout || 10000;
+    this.useBiDi = options.useBiDi || false;
+    this._biDiId = 0;
+  }
+
+  /**
+   * Wait for the WAB bridge to be ready on the page.
+   * @returns {Promise<boolean>}
+   */
+  async waitForBridge() {
+    const iface = this.useBiDi ? '__wab_bidi' : 'AICommands';
+    await this.page.waitForFunction(
+      (name) => typeof window[name] !== 'undefined',
+      { timeout: this.timeout },
+      iface
+    );
+    return true;
+  }
+
+  /**
+   * Check if the bridge is loaded on the current page.
+   * @returns {Promise<boolean>}
+   */
+  async hasBridge() {
+    const iface = this.useBiDi ? '__wab_bidi' : 'AICommands';
+    return this.page.evaluate((name) => typeof window[name] !== 'undefined', iface);
+  }
+
+  /**
+   * Get all available actions.
+   * @param {string} [category] — Optional category filter
+   * @returns {Promise<Array>}
+   */
+  async getActions(category) {
+    if (this.useBiDi) {
+      const result = await this._bidiSend('wab.getActions', category ? { category } : {});
+      return result.result || [];
+    }
+    return this.page.evaluate((cat) => window.AICommands.getActions(cat), category);
+  }
+
+  /**
+   * Get a single action by name.
+   * @param {string} name
+   * @returns {Promise<object|null>}
+   */
+  async getAction(name) {
+    return this.page.evaluate((n) => window.AICommands.getAction(n), name);
+  }
+
+  /**
+   * Execute an action by name.
+   * @param {string} name — Action name
+   * @param {object} [params] — Action parameters
+   * @returns {Promise<object>}
+   */
+  async execute(name, params) {
+    if (this.useBiDi) {
+      const result = await this._bidiSend('wab.executeAction', { name, data: params || {} });
+      return result.result || result;
+    }
+    return this.page.evaluate(
+      (n, p) => window.AICommands.execute(n, p),
+      name, params
+    );
+  }
+
+  /**
+   * Read text content of an element.
+   * @param {string} selector — CSS selector
+   * @returns {Promise<object>}
+   */
+  async readContent(selector) {
+    if (this.useBiDi) {
+      const result = await this._bidiSend('wab.readContent', { selector });
+      return result.result || result;
+    }
+    return this.page.evaluate((sel) => window.AICommands.readContent(sel), selector);
+  }
+
+  /**
+   * Get page info and bridge metadata.
+   * @returns {Promise<object>}
+   */
+  async getPageInfo() {
+    if (this.useBiDi) {
+      const result = await this._bidiSend('wab.getPageInfo');
+      return result.result || result;
+    }
+    return this.page.evaluate(() => window.AICommands.getPageInfo());
+  }
+
+  /**
+   * Authenticate an agent with the bridge.
+   * @param {string} apiKey
+   * @param {object} [meta] — Agent metadata
+   * @returns {Promise<object>}
+   */
+  async authenticate(apiKey, meta) {
+    return this.page.evaluate(
+      (key, m) => window.AICommands.authenticate(key, m),
+      apiKey, meta
+    );
+  }
+
+  /**
+   * Navigate to a URL and wait for the bridge.
+   * @param {string} url
+   * @returns {Promise<void>}
+   */
+  async navigateAndWait(url) {
+    await this.page.goto(url, { waitUntil: 'networkidle2' });
+    await this.waitForBridge();
+  }
+
+  /**
+   * Execute multiple actions in sequence.
+   * @param {Array<{name: string, params?: object}>} steps
+   * @returns {Promise<Array>}
+   */
+  async executeSteps(steps) {
+    const results = [];
+    for (const step of steps) {
+      results.push(await this.execute(step.name, step.params));
+    }
+    return results;
+  }
+
+  /**
+   * Get BiDi context (only available when useBiDi is true).
+   * @returns {Promise<object>}
+   */
+  async getBiDiContext() {
+    return this.page.evaluate(() => window.__wab_bidi.getContext());
+  }
+
+  /** @private */
+  async _bidiSend(method, params = {}) {
+    const cmd = { id: ++this._biDiId, method, params };
+    return this.page.evaluate((c) => window.__wab_bidi.send(c), cmd);
+  }
+}
+
+module.exports = { WABAgent };

package/sdk/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "@anthropic-wab/agent-sdk",
+  "version": "1.0.0",
+  "description": "SDK for building AI agents that interact with Web Agent Bridge (WAB)",
+  "main": "index.js",
+  "license": "MIT",
+  "keywords": ["wab", "ai-agent", "sdk", "web-automation", "bridge"],
+  "peerDependencies": {
+    "puppeteer": ">=20.0.0"
+  },
+  "peerDependenciesMeta": {
+    "puppeteer": { "optional": true }
+  }
+}

package/server/index.js

@@ -0,0 +1,105 @@
+require('dotenv').config();
+
+const express = require('express');
+const http = require('http');
+const cors = require('cors');
+const helmet = require('helmet');
+const rateLimit = require('express-rate-limit');
+const path = require('path');
+const { setupWebSocket } = require('./ws');
+
+const authRoutes = require('./routes/auth');
+const apiRoutes = require('./routes/api');
+const licenseRoutes = require('./routes/license');
+
+const app = express();
+const PORT = process.env.PORT || 3000;
+
+// ─── Security & Middleware ──────────────────────────────────────────────
+app.use(helmet({
+  contentSecurityPolicy: {
+    directives: {
+      defaultSrc: ["'self'"],
+      scriptSrc: ["'self'", "'unsafe-inline'"],
+      styleSrc: ["'self'", "'unsafe-inline'"],
+      imgSrc: ["'self'", "data:", "https:"],
+      connectSrc: ["'self'", "ws:", "wss:"],
+      fontSrc: ["'self'", "https:", "data:"],
+      frameSrc: ["'none'"],
+      frameAncestors: ["'none'"],
+      objectSrc: ["'none'"],
+      baseUri: ["'self'"]
+    }
+  },
+  crossOriginEmbedderPolicy: false
+}));
+app.use(cors());
+app.use(express.json());
+
+const apiLimiter = rateLimit({
+  windowMs: 15 * 60 * 1000,
+  max: 200,
+  standardHeaders: true,
+  legacyHeaders: false,
+  message: { error: 'Too many requests, please try again later' }
+});
+
+const licenseLimiter = rateLimit({
+  windowMs: 60 * 1000,
+  max: 120,
+  standardHeaders: true,
+  legacyHeaders: false
+});
+
+// ─── Static Files ───────────────────────────────────────────────────────
+app.use(express.static(path.join(__dirname, '..', 'public')));
+app.use('/script', express.static(path.join(__dirname, '..', 'script')));
+
+// ─── API Routes ─────────────────────────────────────────────────────────
+app.use('/api/auth', apiLimiter, authRoutes);
+app.use('/api', apiLimiter, apiRoutes);
+app.use('/api/license', licenseLimiter, licenseRoutes);
+
+// ─── HTML Routes ────────────────────────────────────────────────────────
+app.get('/dashboard', (req, res) => {
+  res.sendFile(path.join(__dirname, '..', 'public', 'dashboard.html'));
+});
+app.get('/docs', (req, res) => {
+  res.sendFile(path.join(__dirname, '..', 'public', 'docs.html'));
+});
+app.get('/login', (req, res) => {
+  res.sendFile(path.join(__dirname, '..', 'public', 'login.html'));
+});
+app.get('/register', (req, res) => {
+  res.sendFile(path.join(__dirname, '..', 'public', 'register.html'));
+});
+
+// ─── CDN Versioned Script ───────────────────────────────────────────────
+const pkg = require('../package.json');
+app.use(`/v${pkg.version.split('.')[0]}`, express.static(path.join(__dirname, '..', 'script')));
+app.use('/latest', express.static(path.join(__dirname, '..', 'script')));
+
+// ─── SPA Fallback ───────────────────────────────────────────────────────
+app.get('*', (req, res) => {
+  if (req.accepts('html')) {
+    res.sendFile(path.join(__dirname, '..', 'public', 'index.html'));
+  } else {
+    res.status(404).json({ error: 'Not found' });
+  }
+});
+
+// ─── Start ──────────────────────────────────────────────────────────────
+if (process.env.NODE_ENV !== 'test') {
+  const server = http.createServer(app);
+  setupWebSocket(server);
+
+  server.listen(PORT, () => {
+    console.log(`\n  ╔══════════════════════════════════════════╗`);
+    console.log(`  ║   Web Agent Bridge v${pkg.version}                ║`);
+    console.log(`  ║   Server running on http://localhost:${PORT} ║`);
+    console.log(`  ║   WebSocket: ws://localhost:${PORT}/ws/analytics ║`);
+    console.log(`  ╚══════════════════════════════════════════╝\n`);
+  });
+}
+
+module.exports = app;

package/server/middleware/auth.js

@@ -0,0 +1,44 @@
+const jwt = require('jsonwebtoken');
+
+const JWT_SECRET = process.env.JWT_SECRET || 'dev-secret-change-in-production';
+
+function generateToken(user) {
+  return jwt.sign(
+    { id: user.id, email: user.email, name: user.name },
+    JWT_SECRET,
+    { expiresIn: '7d' }
+  );
+}
+
+function authenticateToken(req, res, next) {
+  const authHeader = req.headers['authorization'];
+  const token = authHeader && authHeader.split(' ')[1];
+
+  if (!token) {
+    return res.status(401).json({ error: 'Access token required' });
+  }
+
+  try {
+    const decoded = jwt.verify(token, JWT_SECRET);
+    req.user = decoded;
+    next();
+  } catch (err) {
+    return res.status(403).json({ error: 'Invalid or expired token' });
+  }
+}
+
+function optionalAuth(req, res, next) {
+  const authHeader = req.headers['authorization'];
+  const token = authHeader && authHeader.split(' ')[1];
+
+  if (token) {
+    try {
+      req.user = jwt.verify(token, JWT_SECRET);
+    } catch (e) {
+      // ignore invalid tokens for optional auth
+    }
+  }
+  next();
+}
+
+module.exports = { generateToken, authenticateToken, optionalAuth };

package/server/models/adapters/index.js

@@ -0,0 +1,33 @@
+/**
+ * Database Adapter Interface
+ *
+ * WAB supports multiple database backends via adapters.
+ * Set DB_ADAPTER environment variable to choose: sqlite (default), postgresql, mysql
+ *
+ * For PostgreSQL:
+ *   npm install pg
+ *   DB_ADAPTER=postgresql DATABASE_URL=postgres://user:pass@host:5432/wab
+ *
+ * For MySQL:
+ *   npm install mysql2
+ *   DB_ADAPTER=mysql DATABASE_URL=mysql://user:pass@host:3306/wab
+ */
+
+const adapter = process.env.DB_ADAPTER || 'sqlite';
+
+let db;
+switch (adapter) {
+  case 'postgresql':
+  case 'postgres':
+    db = require('./postgresql');
+    break;
+  case 'mysql':
+    db = require('./mysql');
+    break;
+  case 'sqlite':
+  default:
+    db = require('./sqlite');
+    break;
+}
+
+module.exports = db;

package/server/models/adapters/mysql.js

@@ -0,0 +1,183 @@
+/**
+ * MySQL Adapter for WAB
+ *
+ * Prerequisites: npm install mysql2
+ * Set DATABASE_URL=mysql://user:pass@host:3306/wab
+ *
+ * This adapter implements the same interface as the SQLite adapter
+ * so it can be used as a drop-in replacement.
+ */
+
+const mysql = require('mysql2/promise');
+const bcrypt = require('bcryptjs');
+const { v4: uuidv4 } = require('uuid');
+
+const pool = mysql.createPool(process.env.DATABASE_URL);
+
+// Initialize tables
+async function initDB() {
+  const conn = await pool.getConnection();
+  try {
+    await conn.query(`
+      CREATE TABLE IF NOT EXISTS users (
+        id VARCHAR(36) PRIMARY KEY,
+        email VARCHAR(255) UNIQUE NOT NULL,
+        password VARCHAR(255) NOT NULL,
+        name VARCHAR(255) NOT NULL,
+        company VARCHAR(255),
+        created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
+        updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
+      )
+    `);
+    await conn.query(`
+      CREATE TABLE IF NOT EXISTS sites (
+        id VARCHAR(36) PRIMARY KEY,
+        user_id VARCHAR(36) NOT NULL,
+        domain VARCHAR(255) NOT NULL,
+        name VARCHAR(255) NOT NULL,
+        description TEXT,
+        tier ENUM('free','starter','pro','enterprise') DEFAULT 'free',
+        license_key VARCHAR(30) UNIQUE NOT NULL,
+        api_key VARCHAR(50) UNIQUE,
+        config JSON,
+        active BOOLEAN DEFAULT TRUE,
+        created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
+        updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
+        FOREIGN KEY (user_id) REFERENCES users(id) ON DELETE CASCADE,
+        INDEX idx_sites_domain (domain),
+        INDEX idx_sites_license (license_key)
+      )
+    `);
+    await conn.query(`
+      CREATE TABLE IF NOT EXISTS analytics (
+        id INT AUTO_INCREMENT PRIMARY KEY,
+        site_id VARCHAR(36) NOT NULL,
+        action_name VARCHAR(255) NOT NULL,
+        agent_id VARCHAR(255),
+        trigger_type VARCHAR(50),
+        success BOOLEAN,
+        metadata JSON,
+        created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
+        FOREIGN KEY (site_id) REFERENCES sites(id) ON DELETE CASCADE,
+        INDEX idx_analytics_site (site_id),
+        INDEX idx_analytics_created (created_at)
+      )
+    `);
+    await conn.query(`
+      CREATE TABLE IF NOT EXISTS subscriptions (
+        id VARCHAR(36) PRIMARY KEY,
+        user_id VARCHAR(36) NOT NULL,
+        site_id VARCHAR(36) NOT NULL,
+        tier ENUM('free','starter','pro','enterprise') NOT NULL,
+        status ENUM('active','cancelled','expired','trial') DEFAULT 'active',
+        started_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
+        expires_at TIMESTAMP NULL,
+        FOREIGN KEY (user_id) REFERENCES users(id) ON DELETE CASCADE,
+        FOREIGN KEY (site_id) REFERENCES sites(id) ON DELETE CASCADE
+      )
+    `);
+  } finally {
+    conn.release();
+  }
+}
+
+initDB().catch(console.error);
+
+function generateLicenseKey() {
+  const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
+  const segments = [];
+  for (let s = 0; s < 4; s++) {
+    let seg = '';
+    for (let i = 0; i < 5; i++) seg += chars[Math.floor(Math.random() * chars.length)];
+    segments.push(seg);
+  }
+  return `WAB-${segments.join('-')}`;
+}
+
+function generateApiKey() {
+  return `wab_${uuidv4().replace(/-/g, '')}`;
+}
+
+// ─── User Operations ──────────────────────────────────────────────────
+async function registerUser({ email, password, name, company }) {
+  const id = uuidv4();
+  const hashed = bcrypt.hashSync(password, 12);
+  await pool.execute(
+    'INSERT INTO users (id, email, password, name, company) VALUES (?, ?, ?, ?, ?)',
+    [id, email, hashed, name, company || null]
+  );
+  return { id, email, name, company };
+}
+
+async function loginUser({ email, password }) {
+  const [rows] = await pool.execute('SELECT * FROM users WHERE email = ?', [email]);
+  const user = rows[0];
+  if (!user) return null;
+  if (!bcrypt.compareSync(password, user.password)) return null;
+  return { id: user.id, email: user.email, name: user.name, company: user.company };
+}
+
+// ─── Site Operations ──────────────────────────────────────────────────
+async function addSite({ userId, domain, name, description, tier }) {
+  const id = uuidv4();
+  const licenseKey = generateLicenseKey();
+  const apiKey = generateApiKey();
+  const config = JSON.stringify({
+    agentPermissions: { readContent: true, click: true, fillForms: false, scroll: true, navigate: false, apiAccess: false, automatedLogin: false, extractData: false },
+    features: { advancedAnalytics: false, realTimeUpdates: false },
+    restrictions: { allowedSelectors: [], blockedSelectors: ['.private', '[data-private]'], rateLimit: { maxCallsPerMinute: 60 } },
+    logging: { enabled: false, level: 'basic' }
+  });
+  await pool.execute(
+    'INSERT INTO sites (id, user_id, domain, name, description, tier, license_key, api_key, config) VALUES (?,?,?,?,?,?,?,?,?)',
+    [id, userId, domain, name, description || '', tier || 'free', licenseKey, apiKey, config]
+  );
+  return { id, domain, name, licenseKey, apiKey, tier: tier || 'free' };
+}
+
+// ─── Analytics ────────────────────────────────────────────────────────
+async function recordAnalytic({ siteId, actionName, agentId, triggerType, success, metadata }) {
+  await pool.execute(
+    'INSERT INTO analytics (site_id, action_name, agent_id, trigger_type, success, metadata) VALUES (?,?,?,?,?,?)',
+    [siteId, actionName, agentId || null, triggerType || null, success ? 1 : 0, JSON.stringify(metadata || {})]
+  );
+}
+
+// ─── License Verification ─────────────────────────────────────────────
+async function verifyLicense(domain, licenseKey) {
+  const [rows] = await pool.execute(
+    'SELECT * FROM sites WHERE domain = ? AND license_key = ? AND active = TRUE', [domain, licenseKey]
+  );
+  const site = rows[0];
+  if (!site) {
+    const [byKey] = await pool.execute('SELECT * FROM sites WHERE license_key = ? AND active = TRUE', [licenseKey]);
+    if (byKey[0]) return { valid: false, error: 'Domain mismatch', tier: 'free' };
+    return { valid: false, error: 'Invalid license key', tier: 'free' };
+  }
+
+  const tierPermissions = {
+    free: { apiAccess: false, automatedLogin: false, extractData: false, advancedAnalytics: false },
+    starter: { apiAccess: false, automatedLogin: true, extractData: false, advancedAnalytics: true },
+    pro: { apiAccess: true, automatedLogin: true, extractData: true, advancedAnalytics: true },
+    enterprise: { apiAccess: true, automatedLogin: true, extractData: true, advancedAnalytics: true }
+  };
+
+  const config = typeof site.config === 'string' ? JSON.parse(site.config) : site.config;
+  return {
+    valid: true,
+    tier: site.tier,
+    permissions: { ...config.agentPermissions, ...tierPermissions[site.tier] },
+    restrictions: config.restrictions,
+    features: config.features,
+    siteId: site.id
+  };
+}
+
+module.exports = {
+  registerUser,
+  loginUser,
+  addSite,
+  recordAnalytic,
+  verifyLicense,
+  pool
+};