autokap 1.0.6 → 1.0.8

package/dist/capture-selector-memory.d.ts

@@ -0,0 +1,31 @@
+import type { SupabaseClient } from '@supabase/supabase-js';
+export interface ScreenshotSelectorMemoryUpdate {
+    stepSignature: string;
+    selector: string;
+    source: 'agent' | 'deterministic' | 'manual';
+    success: boolean;
+}
+/** Map a viewport width to a device category for selector memory scoping. */
+export declare function getViewportCategory(width: number): 'mobile' | 'tablet' | 'desktop';
+export declare function loadScreenshotSelectorMemory(supabase: SupabaseClient, params: {
+    projectId: string | null;
+    presetId?: string | null;
+    domain: string;
+    lang: string;
+    theme: 'light' | 'dark';
+    /** Optional viewport width — when provided, filters selectors by viewport category. */
+    viewportWidth?: number | null;
+}): Promise<Record<string, string[]>>;
+export declare function persistScreenshotSelectorMemoryUpdates(supabase: SupabaseClient, params: {
+    projectId: string | null;
+    presetId?: string | null;
+    domain: string;
+    lang: string;
+    theme: 'light' | 'dark';
+    viewportWidth?: number | null;
+}, updates: ScreenshotSelectorMemoryUpdate[]): Promise<void>;
+export declare function extractSelectorUpdates(actions: Array<{
+    action: string;
+    params: Record<string, unknown>;
+    success: boolean;
+}>): ScreenshotSelectorMemoryUpdate[];

package/dist/capture-selector-memory.js

@@ -0,0 +1,345 @@
+const GENERIC_NAV_TOKENS = new Set([
+    'page',
+    'pages',
+    'open',
+    'view',
+    'link',
+    'button',
+    'click',
+    'menu',
+    'nav',
+    'navigation',
+    'section',
+    'screen',
+    'capture',
+    'prepare',
+    'show',
+    'the',
+    'and',
+    'for',
+    'with',
+]);
+const INTERNAL_AUTOMATION_SELECTOR_RE = /\[data-ak-[^\]]+\]|data-ak-interactive-index/i;
+function containsInternalAutomationSelector(selector) {
+    return !!selector && INTERNAL_AUTOMATION_SELECTOR_RE.test(selector);
+}
+function uniqueInOrder(values) {
+    const seen = new Set();
+    const result = [];
+    for (const value of values) {
+        if (seen.has(value))
+            continue;
+        seen.add(value);
+        result.push(value);
+    }
+    return result;
+}
+function normalizeNavigationTokens(values) {
+    const tokens = [];
+    for (const value of values) {
+        if (!value)
+            continue;
+        const parts = value
+            .toLowerCase()
+            .split(/[^a-z0-9]+/i)
+            .map((part) => part.trim())
+            .filter((part) => part.length >= 3 && part.length <= 32 && !GENERIC_NAV_TOKENS.has(part));
+        tokens.push(...parts);
+    }
+    return uniqueInOrder(tokens).slice(0, 8);
+}
+function extractPathTokens(rawUrl) {
+    if (!rawUrl)
+        return [];
+    try {
+        const url = new URL(rawUrl);
+        return normalizeNavigationTokens(url.pathname.split('/'));
+    }
+    catch {
+        return normalizeNavigationTokens(rawUrl.split('/'));
+    }
+}
+/** Map a viewport width to a device category for selector memory scoping. */
+export function getViewportCategory(width) {
+    if (width < 768)
+        return 'mobile';
+    if (width < 1024)
+        return 'tablet';
+    return 'desktop';
+}
+export async function loadScreenshotSelectorMemory(supabase, params) {
+    const selectFields = 'step_signature, selector, confidence, last_success_at';
+    const grouped = {};
+    const appendRows = (rows) => {
+        for (const row of rows) {
+            const signature = String(row.step_signature ?? '').trim();
+            const selector = String(row.selector ?? '').trim();
+            if (!signature || !selector)
+                continue;
+            if (!grouped[signature])
+                grouped[signature] = [];
+            if (!grouped[signature].includes(selector)) {
+                grouped[signature].push(selector);
+            }
+        }
+    };
+    const viewportCategory = params.viewportWidth
+        ? getViewportCategory(params.viewportWidth)
+        : null;
+    if (params.presetId) {
+        let query = supabase
+            .from('screenshot_step_memory')
+            .select(selectFields)
+            .eq('domain', params.domain)
+            .eq('preset_id', params.presetId)
+            .eq('lang', params.lang)
+            .eq('theme', params.theme)
+            .order('confidence', { ascending: false })
+            .order('last_success_at', { ascending: false })
+            .limit(200);
+        if (params.projectId) {
+            query = query.eq('project_id', params.projectId);
+        }
+        if (viewportCategory) {
+            query = query.or(`viewport_category.eq.${viewportCategory},viewport_category.is.null`);
+        }
+        const { data } = await query;
+        if (data && data.length > 0) {
+            appendRows(data);
+            return grouped;
+        }
+    }
+    let fallbackQuery = supabase
+        .from('screenshot_step_memory')
+        .select(selectFields)
+        .eq('domain', params.domain)
+        .order('confidence', { ascending: false })
+        .order('last_success_at', { ascending: false })
+        .limit(200);
+    if (params.projectId) {
+        fallbackQuery = fallbackQuery.eq('project_id', params.projectId);
+    }
+    if (viewportCategory) {
+        fallbackQuery = fallbackQuery.or(`viewport_category.eq.${viewportCategory},viewport_category.is.null`);
+    }
+    const { data: fallbackData } = await fallbackQuery;
+    if (fallbackData) {
+        appendRows(fallbackData);
+    }
+    return grouped;
+}
+export async function persistScreenshotSelectorMemoryUpdates(supabase, params, updates) {
+    const nowIso = new Date().toISOString();
+    const uniqueUpdates = new Map();
+    for (const update of updates) {
+        if (!update.stepSignature || !update.selector)
+            continue;
+        const key = `${update.stepSignature}|${update.selector}|${update.source}`;
+        uniqueUpdates.set(key, update);
+    }
+    for (const update of uniqueUpdates.values()) {
+        const baseQuery = supabase
+            .from('screenshot_step_memory')
+            .select('id, success_count, fail_count, confidence')
+            .eq('domain', params.domain)
+            .eq('step_signature', update.stepSignature)
+            .eq('selector', update.selector)
+            .eq('lang', params.lang)
+            .eq('theme', params.theme)
+            .limit(1);
+        const scopedQuery = params.presetId
+            ? baseQuery.eq('preset_id', params.presetId)
+            : baseQuery.is('preset_id', null);
+        const projectScopedQuery = params.projectId
+            ? scopedQuery.eq('project_id', params.projectId)
+            : scopedQuery.is('project_id', null);
+        const { data: existingRows } = await projectScopedQuery;
+        const existing = existingRows?.[0];
+        if (!existing) {
+            await supabase.from('screenshot_step_memory').insert({
+                project_id: params.projectId,
+                preset_id: params.presetId ?? null,
+                domain: params.domain,
+                lang: params.lang,
+                theme: params.theme,
+                viewport_category: params.viewportWidth ? getViewportCategory(params.viewportWidth) : null,
+                step_signature: update.stepSignature,
+                selector: update.selector,
+                source: update.source,
+                success_count: update.success ? 1 : 0,
+                fail_count: update.success ? 0 : 1,
+                confidence: update.success ? 0.65 : 0.35,
+                last_success_at: update.success ? nowIso : null,
+                last_failure_at: update.success ? null : nowIso,
+            });
+            continue;
+        }
+        const successCount = (existing.success_count ?? 0) + (update.success ? 1 : 0);
+        const failCount = (existing.fail_count ?? 0) + (update.success ? 0 : 1);
+        const currentConfidence = existing.confidence ?? 0.5;
+        const confidence = update.success
+            ? Math.min(0.98, currentConfidence + 0.08)
+            : Math.max(0.05, currentConfidence - 0.12);
+        await supabase
+            .from('screenshot_step_memory')
+            .update({
+            success_count: successCount,
+            fail_count: failCount,
+            confidence,
+            last_success_at: update.success ? nowIso : undefined,
+            last_failure_at: update.success ? undefined : nowIso,
+        })
+            .eq('id', existing.id);
+    }
+}
+export function extractSelectorUpdates(actions) {
+    const updates = [];
+    const languageAliases = {
+        en: ['en', 'english'],
+        fr: ['fr', 'french', 'francais', 'français'],
+        de: ['de', 'german', 'deutsch'],
+        es: ['es', 'spanish', 'espanol', 'español'],
+        it: ['it', 'italian', 'italiano'],
+        pt: ['pt', 'portuguese', 'portugues', 'português'],
+    };
+    for (const action of actions) {
+        if (action.action !== 'click'
+            && action.action !== 'type_text'
+            && action.action !== 'safe_expand'
+            && action.action !== 'select_option') {
+            continue;
+        }
+        const selector = action.params.selector
+            ?? action.params.resolvedSelector
+            ?? (action.params.index !== undefined ? `[index:${action.params.index}]` : null);
+        if (!selector || selector.startsWith('[index:') || containsInternalAutomationSelector(selector)) {
+            continue;
+        }
+        const text = String(action.params.text ?? '').toLowerCase();
+        const label = String(action.params.elementLabel ?? '').toLowerCase();
+        const optionLabel = String(action.params.optionLabel ?? '').toLowerCase();
+        const optionValue = String(action.params.optionValue ?? '').toLowerCase();
+        const href = String(action.params.href ?? '').toLowerCase();
+        const selectorLower = selector.toLowerCase();
+        const combined = `${selectorLower} ${text} ${label} ${optionLabel} ${optionValue} ${href}`;
+        if (combined.includes('login')
+            || combined.includes('sign in')
+            || combined.includes('signin')
+            || combined.includes('password')
+            || combined.includes('email')
+            || combined.includes('auth')) {
+            updates.push({
+                stepSignature: action.action === 'type_text'
+                    ? combined.includes('password')
+                        ? 'login:password_field'
+                        : 'login:email_field'
+                    : 'login:submit',
+                selector,
+                source: 'agent',
+                success: action.success,
+            });
+        }
+        if (action.action === 'type_text'
+            && (combined.includes('search') || combined.includes('query'))) {
+            updates.push({
+                stepSignature: 'search:field',
+                selector,
+                source: 'agent',
+                success: action.success,
+            });
+        }
+        if ((action.action === 'click' || action.action === 'safe_expand')
+            && (combined.includes('menu') || combined.includes('navigation') || combined.includes('hamburger') || combined.includes('drawer'))) {
+            updates.push({
+                stepSignature: 'menu:primary',
+                selector,
+                source: 'agent',
+                success: action.success,
+            });
+        }
+        if ((action.action === 'click' || action.action === 'safe_expand')
+            && (combined.includes('account') || combined.includes('profile') || combined.includes('avatar') || combined.includes('user'))) {
+            updates.push({
+                stepSignature: 'account:menu',
+                selector,
+                source: 'agent',
+                success: action.success,
+            });
+        }
+        const languageLike = combined.includes('lang')
+            || combined.includes('locale')
+            || combined.includes('language')
+            || Object.values(languageAliases).some((aliases) => aliases.some((alias) => combined.includes(alias)));
+        if (languageLike) {
+            updates.push({
+                stepSignature: 'lang:switcher',
+                selector,
+                source: 'agent',
+                success: action.success,
+            });
+            for (const [langCode, aliases] of Object.entries(languageAliases)) {
+                if (aliases.some((alias) => combined.includes(alias))) {
+                    updates.push({
+                        stepSignature: `lang:option:${langCode}`,
+                        selector,
+                        source: 'agent',
+                        success: action.success,
+                    });
+                    break;
+                }
+            }
+        }
+        if (action.action === 'click' || action.action === 'safe_expand' || action.action === 'select_option') {
+            for (const token of extractPathTokens(String(action.params.href ?? '')).slice(0, 4)) {
+                updates.push({
+                    stepSignature: `nav:path:${token}`,
+                    selector,
+                    source: 'agent',
+                    success: action.success,
+                });
+            }
+            for (const token of normalizeNavigationTokens([
+                action.params.elementLabel,
+                action.params.optionLabel,
+            ]).slice(0, 4)) {
+                updates.push({
+                    stepSignature: `nav:label:${token}`,
+                    selector,
+                    source: 'agent',
+                    success: action.success,
+                });
+            }
+        }
+        const themeLike = combined.includes('theme')
+            || combined.includes('appearance')
+            || combined.includes('dark')
+            || combined.includes('light')
+            || combined.includes('mode');
+        if (themeLike) {
+            updates.push({
+                stepSignature: 'theme:toggle',
+                selector,
+                source: 'agent',
+                success: action.success,
+            });
+            if (combined.includes('dark')) {
+                updates.push({
+                    stepSignature: 'theme:option:dark',
+                    selector,
+                    source: 'agent',
+                    success: action.success,
+                });
+            }
+            if (combined.includes('light')) {
+                updates.push({
+                    stepSignature: 'theme:option:light',
+                    selector,
+                    source: 'agent',
+                    success: action.success,
+                });
+            }
+        }
+    }
+    return updates;
+}
+//# sourceMappingURL=capture-selector-memory.js.map

package/dist/capture-session-profile-encryption.d.ts

@@ -0,0 +1,2 @@
+export declare function encryptSessionField(value: unknown): unknown;
+export declare function decryptSessionField<T>(value: unknown): T | undefined;

package/dist/capture-session-profile-encryption.js

@@ -0,0 +1,22 @@
+import { decrypt, encrypt, isEncryptedEnvelope } from './capture-encryption.js';
+function getSecret() {
+    const secret = process.env.SESSION_PROFILE_ENCRYPTION_SECRET;
+    if (!secret) {
+        throw new Error('Missing SESSION_PROFILE_ENCRYPTION_SECRET for session profile encryption');
+    }
+    return secret;
+}
+export function encryptSessionField(value) {
+    if (!value)
+        return value;
+    return encrypt(JSON.stringify(value), getSecret());
+}
+export function decryptSessionField(value) {
+    if (!value)
+        return undefined;
+    if (isEncryptedEnvelope(value)) {
+        return JSON.parse(decrypt(value, getSecret()));
+    }
+    return value;
+}
+//# sourceMappingURL=capture-session-profile-encryption.js.map

package/dist/capture-step-timeout.d.ts

@@ -0,0 +1,10 @@
+export declare class CaptureStepTimeoutError extends Error {
+    readonly timeoutMs: number;
+    readonly stepLabel: string;
+    constructor(stepLabel: string, timeoutMs: number);
+}
+export declare function isCaptureStepTimeoutError(error: unknown): error is CaptureStepTimeoutError;
+export declare function withCaptureStepTimeout<T>(work: () => Promise<T>, params: {
+    stepLabel: string;
+    timeoutMs: number;
+}): Promise<T>;

package/dist/capture-step-timeout.js

@@ -0,0 +1,30 @@
+export class CaptureStepTimeoutError extends Error {
+    timeoutMs;
+    stepLabel;
+    constructor(stepLabel, timeoutMs) {
+        super(`Timed out after ${timeoutMs}ms while ${stepLabel}.`);
+        this.name = "CaptureStepTimeoutError";
+        this.stepLabel = stepLabel;
+        this.timeoutMs = timeoutMs;
+    }
+}
+export function isCaptureStepTimeoutError(error) {
+    return error instanceof CaptureStepTimeoutError;
+}
+export async function withCaptureStepTimeout(work, params) {
+    return new Promise((resolve, reject) => {
+        const timer = setTimeout(() => {
+            reject(new CaptureStepTimeoutError(params.stepLabel, params.timeoutMs));
+        }, params.timeoutMs);
+        void work()
+            .then((result) => {
+            clearTimeout(timer);
+            resolve(result);
+        })
+            .catch((error) => {
+            clearTimeout(timer);
+            reject(error);
+        });
+    });
+}
+//# sourceMappingURL=capture-step-timeout.js.map

package/dist/capture-strategy.d.ts

@@ -0,0 +1,36 @@
+/**
+ * Capture Agent — Capture Strategy
+ *
+ * Abstraction over the supported media modes: screenshot and clip.
+ * The opcode runner is identical for all three — only the capture
+ * opcodes dispatch to different strategies.
+ */
+import type { ArtifactSpec, ArtifactResult, RuntimeAdapter, MediaMode } from './execution-types.js';
+export interface CaptureStrategy {
+    readonly mediaMode: MediaMode;
+    /** Prepare the adapter for capture (e.g. lock viewport, inject cursor overlay) */
+    prepare(adapter: RuntimeAdapter, spec: ArtifactSpec): Promise<void>;
+    /** Perform the capture and return the raw artifact */
+    capture(adapter: RuntimeAdapter, spec: ArtifactSpec): Promise<ArtifactResult>;
+    /** Post-process the artifact (mockup frame, status bar, format conversion) */
+    postProcess(artifact: ArtifactResult, spec: ArtifactSpec): Promise<ArtifactResult>;
+}
+export declare class ScreenshotStrategy implements CaptureStrategy {
+    readonly mediaMode: "screenshot";
+    prepare(_adapter: RuntimeAdapter, _spec: ArtifactSpec): Promise<void>;
+    capture(adapter: RuntimeAdapter, _spec: ArtifactSpec): Promise<ArtifactResult>;
+    postProcess(artifact: ArtifactResult, spec: ArtifactSpec): Promise<ArtifactResult>;
+}
+export declare class ClipStrategy implements CaptureStrategy {
+    readonly mediaMode: "clip";
+    prepare(adapter: RuntimeAdapter, _spec: ArtifactSpec): Promise<void>;
+    capture(adapter: RuntimeAdapter, _spec: ArtifactSpec): Promise<ArtifactResult>;
+    postProcess(artifact: ArtifactResult, spec: ArtifactSpec): Promise<ArtifactResult>;
+}
+export declare class DomStrategy implements CaptureStrategy {
+    readonly mediaMode: "dom";
+    prepare(_adapter: RuntimeAdapter, _spec: ArtifactSpec): Promise<void>;
+    capture(adapter: RuntimeAdapter, _spec: ArtifactSpec): Promise<ArtifactResult>;
+    postProcess(artifact: ArtifactResult, _spec: ArtifactSpec): Promise<ArtifactResult>;
+}
+export declare function createCaptureStrategy(mediaMode: MediaMode): CaptureStrategy;

package/dist/capture-strategy.js

@@ -0,0 +1,95 @@
+/**
+ * Capture Agent — Capture Strategy
+ *
+ * Abstraction over the supported media modes: screenshot and clip.
+ * The opcode runner is identical for all three — only the capture
+ * opcodes dispatch to different strategies.
+ */
+// ── Screenshot strategy ─────────────────────────────────────────────
+export class ScreenshotStrategy {
+    mediaMode = 'screenshot';
+    async prepare(_adapter, _spec) {
+        // Viewport locking is handled externally by the CLI runner
+        // when creating the browser context per variant.
+    }
+    async capture(adapter, _spec) {
+        const buffer = await adapter.takeScreenshot();
+        return {
+            mediaMode: 'screenshot',
+            buffer,
+            mimeType: 'image/png',
+        };
+    }
+    async postProcess(artifact, spec) {
+        // Post-processing (mockup frame, status bar) will be applied
+        // by the CLI runner using existing utilities:
+        // - applyDeviceFrame() from src/mockup.ts
+        // - generateStatusBarHtml() from src/status-bar.ts
+        // For now, return as-is. Phase 4 CLI runner handles the orchestration.
+        return artifact;
+    }
+}
+// ── Clip strategy ───────────────────────────────────────────────────
+export class ClipStrategy {
+    mediaMode = 'clip';
+    async prepare(adapter, _spec) {
+        // Clip recording preparation:
+        // - The browser context is created with video recording enabled
+        // - Cursor overlay is injected by Browser.forVideoRecording()
+    }
+    async capture(adapter, _spec) {
+        // Clip capture is bounded by BEGIN_CLIP / END_CLIP opcodes.
+        // The opcode runner calls adapter.beginRecording() and adapter.endRecording().
+        // This method is called for the final artifact assembly.
+        const recording = await adapter.endRecording();
+        return {
+            mediaMode: 'clip',
+            buffer: recording.buffer,
+            mimeType: recording.mimeType,
+        };
+    }
+    async postProcess(artifact, spec) {
+        // Post-processing for clips:
+        // - Convert WebM to GIF/MP4 via src/clip-postprocess.ts (if it exists)
+        // - Trim start/end
+        // - Apply cursor theme
+        // Handled by CLI runner using existing video processing utilities.
+        return artifact;
+    }
+}
+// ── DOM strategy (Interactive Demos — AUT-121) ──────────────────────
+export class DomStrategy {
+    mediaMode = 'dom';
+    async prepare(_adapter, _spec) {
+        // Nothing to prepare — DOM serialization happens inline in the
+        // CAPTURE_DOM opcode handler in opcode-runner.ts.
+    }
+    async capture(adapter, _spec) {
+        if (!adapter.serializeDom) {
+            throw new Error('DOM capture requires an adapter that implements serializeDom()');
+        }
+        const result = await adapter.serializeDom();
+        return {
+            mediaMode: 'dom',
+            buffer: Buffer.from(result.html, 'utf8'),
+            mimeType: 'text/html; charset=utf-8',
+            domHtml: result.html,
+            domAssetUrls: result.assetUrls,
+            domHtmlBytes: result.html.length,
+            dimensions: result.viewport,
+        };
+    }
+    async postProcess(artifact, _spec) {
+        // Phase 3 will add asset extraction (CAS), PurgeCSS and Brotli here.
+        return artifact;
+    }
+}
+// ── Factory ─────────────────────────────────────────────────────────
+export function createCaptureStrategy(mediaMode) {
+    switch (mediaMode) {
+        case 'screenshot': return new ScreenshotStrategy();
+        case 'clip': return new ClipStrategy();
+        case 'dom': return new DomStrategy();
+    }
+}
+//# sourceMappingURL=capture-strategy.js.map

package/dist/capture-studio-sync.d.ts

@@ -0,0 +1,23 @@
+import type { SupabaseClient } from '@supabase/supabase-js';
+type StudioBrowserBarConfig = {
+    url?: string;
+    pageTitle?: string;
+    tabIconUrl?: string;
+} | null | undefined;
+export declare function syncStudioVariantAfterCapture(params: {
+    supabase: SupabaseClient;
+    projectId: string;
+    presetId: string;
+    targetId?: string | null;
+    lang: string;
+    theme: string;
+    elementName: string | null;
+    captureId: string;
+    screenshotUrl: string | null;
+    rawScreenshotUrl?: string | null;
+    deviceFrame?: string | null;
+    orientation?: 'portrait' | 'landscape' | null;
+    browserBar?: StudioBrowserBarConfig;
+    matchTargetId?: boolean;
+}): Promise<void>;
+export {};