@scenetest/vite-plugin 0.11.0 → 0.13.0

package/dist/panels/recorder/index.js

@@ -0,0 +1,208 @@
+/**
+ * Scenetest Scene Recorder
+ *
+ * Records user interactions as DSL lines in a live sidebar panel.
+ * Captures clicks, typing, navigation, and annotates with inline assertions.
+ *
+ * Usage:
+ *   import { initRecorder } from '@scenetest/vite-plugin/panels/recorder'
+ *   initRecorder()
+ *
+ * Or auto-init:
+ *   import '@scenetest/vite-plugin/panels/recorder'
+ */
+import { startCapture } from './capture.js';
+import { createRecorderPanel, attachPanelListeners, appendLine, appendAnnotation, appendWarning, removeLine, clearPanel, setRecordingState, } from './panel.js';
+/**
+ * Global recorder state
+ */
+const state = {
+    recording: true,
+    lines: [],
+    annotations: [],
+    nextId: 1,
+    pendingInput: null,
+};
+let stopCapture = null;
+/**
+ * Initialize the scene recorder.
+ * Creates the sidebar panel, starts event capture, and hooks into assertions.
+ * Safe to call multiple times — subsequent calls are no-ops.
+ */
+export function initRecorder() {
+    if (typeof window === 'undefined') {
+        console.warn('[scenetest/recorder] initRecorder() called in non-browser environment');
+        return;
+    }
+    if (window.__scenetest_recorder) {
+        return;
+    }
+    window.__scenetest_recorder = true;
+    console.log('%c\u23FA scenetest recorder', 'color: #c792ea; font-weight: bold');
+    // Create panel when DOM is ready
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', setup);
+    }
+    else {
+        setup();
+    }
+}
+function setup() {
+    // Create the sidebar panel
+    createRecorderPanel();
+    // Wire up panel event handlers
+    attachPanelListeners({
+        onToggleRecording: () => {
+            if (!state.recording) {
+                resumeRecording();
+            }
+        },
+        onPause: () => {
+            if (state.recording) {
+                pauseRecording();
+            }
+        },
+        onClear: () => {
+            state.lines = [];
+            state.annotations = [];
+            state.nextId = 1;
+            clearPanel();
+        },
+        onExport: () => {
+            exportDsl();
+        },
+        onDeleteLine: (lineId) => {
+            state.lines = state.lines.filter(l => l.id !== lineId);
+            state.annotations = state.annotations.filter(a => a.afterLineId !== lineId);
+            removeLine(lineId);
+        },
+    });
+    // Start capturing events
+    stopCapture = startCapture(state, (line) => {
+        appendLine(line, state.lines.length - 1);
+    }, (message) => {
+        appendWarning(message);
+    });
+    // Hook into assertion reporting
+    hookAssertions();
+}
+/**
+ * Hook into window.__scenetest_report to capture assertions
+ * and display them as inline annotations in the recorder.
+ */
+function hookAssertions() {
+    const existingReport = window.__scenetest_report;
+    window.__scenetest_report = function (result) {
+        // Forward to existing reporter (observer panel, Playwright, etc.)
+        if (existingReport) {
+            try {
+                existingReport(result);
+            }
+            catch {
+                // Ignore errors
+            }
+        }
+        // Only annotate if we're recording and have lines
+        if (!state.recording || state.lines.length === 0)
+            return;
+        const lastLine = state.lines[state.lines.length - 1];
+        const annotation = {
+            afterLineId: lastLine.id,
+            type: result.result ? 'pass' : 'fail',
+            description: result.description,
+            timestamp: Date.now(),
+        };
+        state.annotations.push(annotation);
+        appendAnnotation(annotation);
+    };
+}
+/**
+ * Pause recording
+ */
+function pauseRecording() {
+    state.recording = false;
+    setRecordingState(false);
+    console.log('%c\u23F8 recorder paused', 'color: #6a6a8a');
+}
+/**
+ * Resume recording
+ */
+function resumeRecording() {
+    state.recording = true;
+    setRecordingState(true);
+    console.log('%c\u23FA recorder resumed', 'color: #c792ea');
+}
+/**
+ * Export the current DSL lines as a downloadable .spec.md file
+ * in the formal screenplay-cue format.
+ */
+function exportDsl() {
+    if (state.lines.length === 0) {
+        console.warn('[scenetest/recorder] Nothing to export');
+        return;
+    }
+    // Generate scene name from current page path
+    const pagePath = location.pathname
+        .replace(/^\//, '')
+        .replace(/\//g, ' ')
+        .trim()
+        || 'recorded scene';
+    // Build the formal markdown DSL format:
+    // ## scene-name
+    // user:
+    // - action selector
+    // - action selector value
+    const lines = [
+        `## ${pagePath}`,
+        'user:',
+        ...state.lines.map(l => `- ${l.text}`),
+        '', // trailing newline
+    ];
+    const content = lines.join('\n');
+    // Generate filename
+    const pathSlug = location.pathname
+        .replace(/^\//, '')
+        .replace(/\//g, '-')
+        || 'scene';
+    const timestamp = new Date().toISOString().slice(0, 19).replace(/[T:]/g, '-');
+    const filename = `${pathSlug}-${timestamp}.spec.md`;
+    // Create and trigger download
+    const blob = new Blob([content], { type: 'text/markdown' });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = filename;
+    a.click();
+    URL.revokeObjectURL(url);
+    console.log(`%c\u2193 exported ${state.lines.length} lines to ${filename}`, 'color: #4ade80');
+}
+/**
+ * Get the current DSL lines as a string array.
+ * Useful for programmatic access.
+ */
+export function getDslLines() {
+    return state.lines.map(l => l.text);
+}
+/**
+ * Get the full recorder state.
+ * Useful for testing and debugging.
+ */
+export function getRecorderState() {
+    return state;
+}
+/**
+ * Programmatically stop the recorder and clean up.
+ */
+export function destroyRecorder() {
+    if (stopCapture) {
+        stopCapture();
+        stopCapture = null;
+    }
+    const el = document.getElementById('scenetest-recorder');
+    if (el) {
+        el.remove();
+    }
+    window.__scenetest_recorder = false;
+    document.documentElement.style.removeProperty('--scenetest-recorder-width');
+}
+//# sourceMappingURL=index.js.map

package/dist/panels/recorder/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/panels/recorder/index.ts"],"names":[],"mappings":"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"}

package/dist/panels/recorder/panel.d.ts

@@ -0,0 +1,55 @@
+/**
+ * Sidebar panel UI for the recorder.
+ *
+ * Shows a left-side panel with:
+ * - Recording indicator
+ * - Live DSL lines accumulating as the user interacts
+ * - Inline assertion annotations
+ * - Delete buttons on each line
+ * - Export button
+ */
+import type { DslLine, AssertionAnnotation } from './types.js';
+/**
+ * Create and mount the recorder panel
+ */
+export declare function createRecorderPanel(): HTMLDivElement;
+/**
+ * Attach event listeners to the panel.
+ * Separated from creation so the caller can wire up callbacks.
+ */
+export declare function attachPanelListeners(opts: {
+    onToggleRecording: () => void;
+    onPause: () => void;
+    onClear: () => void;
+    onExport: () => void;
+    onDeleteLine: (lineId: number) => void;
+}): void;
+/**
+ * Add a new DSL line to the panel
+ */
+export declare function appendLine(line: DslLine, index: number): void;
+/**
+ * Add an assertion annotation after the last line
+ */
+export declare function appendAnnotation(annotation: AssertionAnnotation): void;
+/**
+ * Add a warning message to the panel
+ */
+export declare function appendWarning(message: string): void;
+/**
+ * Remove a line from the panel by id
+ */
+export declare function removeLine(lineId: number): void;
+/**
+ * Clear all lines and annotations from the panel
+ */
+export declare function clearPanel(): void;
+/**
+ * Update recording state indicator
+ */
+export declare function setRecordingState(recording: boolean): void;
+/**
+ * Re-render all lines (after deletion or reorder)
+ */
+export declare function renderAllLines(lines: DslLine[], annotations: AssertionAnnotation[]): void;
+//# sourceMappingURL=panel.d.ts.map

package/dist/panels/recorder/panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../../src/panels/recorder/panel.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAAK,EAAE,OAAO,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAA;AAmE9D;;GAEG;AACH,wBAAgB,mBAAmB,IAAI,cAAc,CAuCpD;AAED;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,IAAI,EAAE;IACzC,iBAAiB,EAAE,MAAM,IAAI,CAAA;IAC7B,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;CACvC,GAAG,IAAI,CAqDP;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAgB7D;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,UAAU,EAAE,mBAAmB,GAAG,IAAI,CAQtE;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,CASnD;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAkB/C;AAED;;GAEG;AACH,wBAAgB,UAAU,IAAI,IAAI,CAUjC;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,CAW1D;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,OAAO,EAAE,EAAE,WAAW,EAAE,mBAAmB,EAAE,GAAG,IAAI,CA4BzF"}

package/dist/panels/recorder/panel.js

@@ -0,0 +1,284 @@
+/**
+ * Sidebar panel UI for the recorder.
+ *
+ * Shows a left-side panel with:
+ * - Recording indicator
+ * - Live DSL lines accumulating as the user interacts
+ * - Inline assertion annotations
+ * - Delete buttons on each line
+ * - Export button
+ */
+import { recorderStyles } from './styles.js';
+let panelEl = null;
+let linesEl = null;
+let footerCountEl = null;
+let isCollapsed = false;
+/**
+ * Highlight DSL syntax in a line of text
+ */
+function highlightDsl(text) {
+    const parts = text.split(' ');
+    const action = parts[0];
+    // Actions that take only a value (no selector)
+    const valueOnlyActions = ['openTo', 'seeText', 'wait', 'emit'];
+    // Actions that take selector + value
+    const selectorValueActions = ['typeInto', 'select', 'warnIf'];
+    // No-arg actions
+    const noArgActions = ['prev', 'scrollToBottom'];
+    let html = `<span class="recorder-action">${escapeHtml(action)}</span>`;
+    if (noArgActions.includes(action) || parts.length === 1) {
+        return html;
+    }
+    if (valueOnlyActions.includes(action)) {
+        html += ` <span class="recorder-value">${escapeHtml(parts.slice(1).join(' '))}</span>`;
+    }
+    else if (selectorValueActions.includes(action)) {
+        html += ` <span class="recorder-selector">${escapeHtml(parts[1])}</span>`;
+        if (parts.length > 2) {
+            html += ` <span class="recorder-value">${escapeHtml(parts.slice(2).join(' '))}</span>`;
+        }
+    }
+    else {
+        // Selector-only actions (see, click, check, notSee, seeToast, up)
+        html += ` <span class="recorder-selector">${escapeHtml(parts.slice(1).join(' '))}</span>`;
+    }
+    return html;
+}
+/**
+ * Render a single DSL line with `- ` prefix (formal markdown DSL format)
+ */
+function renderLine(line, index) {
+    return `<div class="recorder-line new" data-line-id="${line.id}">
+    <span class="recorder-line-number">${index + 1}</span>
+    <div class="recorder-line-content">
+      <span class="recorder-line-text"><span class="recorder-prefix">- </span>${highlightDsl(line.text)}</span>
+    </div>
+    <button class="recorder-line-delete" data-delete-id="${line.id}" title="Remove line">\u00d7</button>
+  </div>`;
+}
+/**
+ * Render an assertion annotation
+ */
+function renderAnnotation(annotation) {
+    const icon = annotation.type === 'pass' ? '\u2713' : '\u2717';
+    return `<div class="recorder-annotation ${annotation.type}">
+    <span class="recorder-annotation-icon">${icon}</span>
+    <span class="recorder-annotation-text">${escapeHtml(annotation.description)}</span>
+  </div>`;
+}
+/**
+ * Create and mount the recorder panel
+ */
+export function createRecorderPanel() {
+    const el = document.createElement('div');
+    el.id = 'scenetest-recorder';
+    el.innerHTML = `
+    <style>${recorderStyles}</style>
+    <div class="recorder-header">
+      <div class="recorder-header-left">
+        <div class="recorder-rec-dot" id="recorder-rec-dot"></div>
+        <span class="recorder-header-title">scene recorder</span>
+      </div>
+      <button class="recorder-toggle-btn" id="recorder-toggle" title="Collapse">\u25C0</button>
+    </div>
+    <div class="recorder-actions">
+      <button class="recorder-btn active" id="recorder-record-btn">record</button>
+      <button class="recorder-btn" id="recorder-pause-btn">pause</button>
+      <button class="recorder-btn danger" id="recorder-clear-btn">clear</button>
+      <button class="recorder-btn primary" id="recorder-export-btn">export .spec.md</button>
+    </div>
+    <div class="recorder-lines" id="recorder-lines">
+      <div class="recorder-empty">
+        <div class="recorder-empty-icon">\u23FA</div>
+        Click around the app to start recording...<br>
+        Actions appear here as markdown DSL.
+      </div>
+    </div>
+    <div class="recorder-footer">
+      <span class="recorder-line-count" id="recorder-line-count">0 lines</span>
+    </div>
+  `;
+    document.body.appendChild(el);
+    panelEl = el;
+    linesEl = el.querySelector('#recorder-lines');
+    footerCountEl = el.querySelector('#recorder-line-count');
+    // Set CSS variable for app to adjust layout
+    document.documentElement.style.setProperty('--scenetest-recorder-width', '360px');
+    return el;
+}
+/**
+ * Attach event listeners to the panel.
+ * Separated from creation so the caller can wire up callbacks.
+ */
+export function attachPanelListeners(opts) {
+    if (!panelEl)
+        return;
+    // Toggle collapse
+    panelEl.querySelector('#recorder-toggle')?.addEventListener('click', (e) => {
+        e.stopPropagation();
+        isCollapsed = !isCollapsed;
+        panelEl?.classList.toggle('collapsed', isCollapsed);
+        const btn = panelEl?.querySelector('#recorder-toggle');
+        if (btn) {
+            btn.textContent = isCollapsed ? '\u25B6' : '\u25C0';
+            btn.setAttribute('title', isCollapsed ? 'Expand' : 'Collapse');
+        }
+        document.documentElement.style.setProperty('--scenetest-recorder-width', isCollapsed ? '48px' : '360px');
+    });
+    // Record button
+    panelEl.querySelector('#recorder-record-btn')?.addEventListener('click', (e) => {
+        e.stopPropagation();
+        opts.onToggleRecording();
+    });
+    // Pause button
+    panelEl.querySelector('#recorder-pause-btn')?.addEventListener('click', (e) => {
+        e.stopPropagation();
+        opts.onPause();
+    });
+    // Clear button
+    panelEl.querySelector('#recorder-clear-btn')?.addEventListener('click', (e) => {
+        e.stopPropagation();
+        opts.onClear();
+    });
+    // Export button
+    panelEl.querySelector('#recorder-export-btn')?.addEventListener('click', (e) => {
+        e.stopPropagation();
+        opts.onExport();
+    });
+    // Delete line (event delegation on the lines container)
+    linesEl?.addEventListener('click', (e) => {
+        const target = e.target;
+        const deleteBtn = target.closest('[data-delete-id]');
+        if (deleteBtn) {
+            e.stopPropagation();
+            const lineId = parseInt(deleteBtn.getAttribute('data-delete-id'), 10);
+            opts.onDeleteLine(lineId);
+        }
+    });
+}
+/**
+ * Add a new DSL line to the panel
+ */
+export function appendLine(line, index) {
+    if (!linesEl)
+        return;
+    // Remove the empty state message if present
+    const emptyEl = linesEl.querySelector('.recorder-empty');
+    if (emptyEl) {
+        emptyEl.remove();
+    }
+    const lineHtml = renderLine(line, index);
+    linesEl.insertAdjacentHTML('beforeend', lineHtml);
+    // Scroll to bottom
+    linesEl.scrollTop = linesEl.scrollHeight;
+    updateLineCount(index + 1);
+}
+/**
+ * Add an assertion annotation after the last line
+ */
+export function appendAnnotation(annotation) {
+    if (!linesEl)
+        return;
+    const html = renderAnnotation(annotation);
+    linesEl.insertAdjacentHTML('beforeend', html);
+    // Scroll to bottom
+    linesEl.scrollTop = linesEl.scrollHeight;
+}
+/**
+ * Add a warning message to the panel
+ */
+export function appendWarning(message) {
+    if (!linesEl)
+        return;
+    const html = `<div class="recorder-warning">
+    <span class="recorder-warning-icon">\u26A0</span>
+    <span>${escapeHtml(message)}</span>
+  </div>`;
+    linesEl.insertAdjacentHTML('beforeend', html);
+    linesEl.scrollTop = linesEl.scrollHeight;
+}
+/**
+ * Remove a line from the panel by id
+ */
+export function removeLine(lineId) {
+    if (!linesEl)
+        return;
+    const lineEl = linesEl.querySelector(`[data-line-id="${lineId}"]`);
+    if (lineEl) {
+        lineEl.remove();
+    }
+    // Re-number remaining lines
+    const lines = linesEl.querySelectorAll('.recorder-line');
+    lines.forEach((el, i) => {
+        const numEl = el.querySelector('.recorder-line-number');
+        if (numEl) {
+            numEl.textContent = String(i + 1);
+        }
+    });
+    updateLineCount(lines.length);
+}
+/**
+ * Clear all lines and annotations from the panel
+ */
+export function clearPanel() {
+    if (!linesEl)
+        return;
+    linesEl.innerHTML = `<div class="recorder-empty">
+    <div class="recorder-empty-icon">\u23FA</div>
+    Click around the app to start recording...<br>
+    Actions appear here as markdown DSL.
+  </div>`;
+    updateLineCount(0);
+}
+/**
+ * Update recording state indicator
+ */
+export function setRecordingState(recording) {
+    if (!panelEl)
+        return;
+    const dot = panelEl.querySelector('#recorder-rec-dot');
+    const recordBtn = panelEl.querySelector('#recorder-record-btn');
+    const pauseBtn = panelEl.querySelector('#recorder-pause-btn');
+    dot?.classList.toggle('paused', !recording);
+    recordBtn?.classList.toggle('active', recording);
+    pauseBtn?.classList.toggle('active', !recording);
+}
+/**
+ * Re-render all lines (after deletion or reorder)
+ */
+export function renderAllLines(lines, annotations) {
+    if (!linesEl)
+        return;
+    if (lines.length === 0) {
+        clearPanel();
+        return;
+    }
+    let html = '';
+    for (let i = 0; i < lines.length; i++) {
+        html += renderLine(lines[i], i);
+        // Add any annotations that belong after this line
+        const lineAnnotations = annotations.filter(a => a.afterLineId === lines[i].id);
+        for (const ann of lineAnnotations) {
+            html += renderAnnotation(ann);
+        }
+    }
+    // Add any trailing annotations (after the last line)
+    const lastLineId = lines[lines.length - 1].id;
+    const trailingAnnotations = annotations.filter(a => a.afterLineId > lastLineId);
+    for (const ann of trailingAnnotations) {
+        html += renderAnnotation(ann);
+    }
+    linesEl.innerHTML = html;
+    updateLineCount(lines.length);
+}
+function updateLineCount(count) {
+    if (footerCountEl) {
+        footerCountEl.textContent = `${count} line${count !== 1 ? 's' : ''}`;
+    }
+}
+function escapeHtml(text) {
+    const div = document.createElement('div');
+    div.textContent = text;
+    return div.innerHTML;
+}
+//# sourceMappingURL=panel.js.map

package/dist/panels/recorder/panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel.js","sourceRoot":"","sources":["../../../src/panels/recorder/panel.ts"],"names":[],"mappings":"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"}

package/dist/panels/recorder/reverse-selector.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Reverse selector resolution: given a DOM element, produce a scenetest selector string.
+ *
+ * This is the inverse of resolveSelector() in @scenetest/cli.
+ * Instead of selector → element, it goes element → selector.
+ *
+ * Algorithm:
+ * 1. Starting from the target element, find the first addressable attribute
+ * 2. Walk up ancestors collecting addressable tokens to build a unique path
+ * 3. Return the space-separated selector string (parent child grandchild)
+ */
+/**
+ * Resolve a DOM element to a scenetest selector string.
+ *
+ * Walks up from the element collecting addressable tokens until
+ * the path uniquely identifies the element.
+ *
+ * @returns The selector string, or null if the element can't be addressed
+ */
+export declare function reverseSelector(element: Element): string | null;
+/**
+ * Find the nearest addressable ancestor (or self) for an element.
+ * Useful when the clicked element itself has no selector but a parent does.
+ */
+export declare function nearestAddressable(element: Element): Element | null;
+/**
+ * Get a human-readable description of why an element can't be addressed.
+ * Used to show warnings when clicking unaddressable elements.
+ */
+export declare function explainUnaddressable(element: Element): string;
+//# sourceMappingURL=reverse-selector.d.ts.map

package/dist/panels/recorder/reverse-selector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reverse-selector.d.ts","sourceRoot":"","sources":["../../../src/panels/recorder/reverse-selector.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAqCH;;;;;;;GAOG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAoC/D;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,GAAG,IAAI,CAWnE;AAgBD;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,CAK7D"}