@zibby/core 0.1.20 → 0.1.22

package/src/utils/test-post-processor.js

@@ -1,211 +0,0 @@
-import fs from 'fs/promises';
-import { SelectorGenerator } from './selector-generator.js';
-
-export class TestPostProcessor {
-  static async generateFromEvents(testFilePath, eventsPath, traceActions, testTitle) {
-    try {
-      console.log(`[TestPostProcessor] 🎯 Generating test from events.json (100% accurate)`);
-      
-      const { readFileSync } = await import('fs');
-      const events = JSON.parse(readFileSync(eventsPath, 'utf-8'));
-      
-      const actionEvents = events.filter(e => ['navigate', 'type', 'fill', 'click', 'select_option'].includes(e.type));
-      
-      // Match trace actions with events by sequence order (both are chronological)
-      // Skip navigate events when matching trace actions (trace doesn't record navigations)
-      const _actionEventsNoNav = actionEvents.filter(e => e.type !== 'navigate');
-      
-      console.log(`[TestPostProcessor] Found ${actionEvents.length} action events, ${traceActions.length} trace actions`);
-      
-      let testCode = `import { ZibbyRuntime } from '@zibby/core';\nimport { test, expect } from '@playwright/test';\n\n`;
-      testCode += `test('${testTitle}', async ({ page }) => {\n`;
-      testCode += `  const timestamp = Date.now();\n\n`;
-      
-      let traceIdx = 0;
-      
-      for (const event of actionEvents) {
-        if (event.type === 'navigate') {
-          testCode += `  await page.goto('${event.data.params.url}');\n\n`;
-        } else if (event.type === 'type' || event.type === 'fill') {
-          const { element, text } = event.data.params;
-          const strategies = (traceActions[traceIdx]?.strategies) || [];
-          
-          const fingerprint = {
-            name: element,
-            action: 'fill',
-            value: text,
-            strategies
-          };
-          
-          testCode += `  await ZibbyRuntime.step(page, ${JSON.stringify(fingerprint, null, 2)});\n\n`;
-          traceIdx++;
-        } else if (event.type === 'click') {
-          const { element } = event.data.params;
-          const strategies = (traceActions[traceIdx]?.strategies) || [];
-          
-          const fingerprint = {
-            name: element,
-            action: 'click',
-            value: '',
-            strategies
-          };
-          
-          testCode += `  await ZibbyRuntime.step(page, ${JSON.stringify(fingerprint, null, 2)});\n\n`;
-          traceIdx++;
-        } else if (event.type === 'select_option') {
-          const { element, values } = event.data.params;
-          const strategies = (traceActions[traceIdx]?.strategies) || [];
-          
-          const fingerprint = {
-            name: element,
-            action: 'selectOption',
-            value: Array.isArray(values) ? values[0] : values,
-            strategies
-          };
-          
-          testCode += `  await ZibbyRuntime.step(page, ${JSON.stringify(fingerprint, null, 2)});\n\n`;
-          traceIdx++;
-        }
-      }
-      
-      testCode += `});\n`;
-      
-      const { dirname } = await import('path');
-      const { mkdirSync } = await import('fs');
-      mkdirSync(dirname(testFilePath), { recursive: true });
-      await fs.writeFile(testFilePath, testCode, 'utf-8');
-      
-      console.log(`[TestPostProcessor] ✅ Generated test with ${events.filter(e => ['type', 'fill', 'click', 'select_option'].includes(e.type)).length} actions`);
-      
-      return true;
-    } catch (err) {
-      console.warn('[TestPostProcessor] Failed to generate from events:', err.message);
-      return false;
-    }
-  }
-
-  static async enhanceSelectorsWithTrace(testFilePath, traceActions, _executionData) {
-    try {
-      console.log(`[TestPostProcessor] 🛡️ Applying Zibby Safe Action Wrappers...`);
-      
-      let testCode = await fs.readFile(testFilePath, 'utf-8');
-      
-      if (!testCode.includes('ZibbyRuntime')) {
-        testCode = `import { ZibbyRuntime } from '@zibby/core';\n${  testCode}`;
-      }
-
-      for (let i = 0; i < traceActions.length; i++) {
-        const action = traceActions[i];
-        const elementVar = `element${i}`;
-        
-        const actionPattern = new RegExp(
-          `const ${elementVar}\\b\\s*=\\s*page\\.[^;]+;(\\s*await ${elementVar}\\.waitFor\\([^)]*\\);)?\\s*await ${elementVar}\\.(click|fill|type|selectOption|pressSequentially)\\(([^)]*)\\);`,
-          's'
-        );
-        
-        const match = testCode.match(actionPattern);
-        if (!match) continue;
-
-        const fingerprint = {
-          name: action.name || `Action ${i}`,
-          action: action.method === 'type' ? 'fill' : action.method,
-          value: match[3].trim().replace(/^['"]|['"]$/g, ''),
-          strategies: action.strategies || []
-        };
-
-        const zibbyStep = `await ZibbyRuntime.step(page, ${JSON.stringify(fingerprint, null, 2)});`;
-        
-        testCode = testCode.replace(match[0], zibbyStep);
-      }
-      
-      await fs.writeFile(testFilePath, testCode, 'utf-8');
-      console.log(`[TestPostProcessor] ✅ Successfully converted test to Resilient Zibby format`);
-      
-      return true;
-    } catch (err) {
-      console.warn('[TestPostProcessor] Failed to apply safe wrappers:', err.message);
-      return false;
-    }
-  }
-
-  static async enhanceSelectors(testFilePath, executionData) {
-    try {
-      const { actions = [] } = executionData;
-      if (!actions.length) return false;
-
-      let testCode = await fs.readFile(testFilePath, 'utf-8');
-      
-      const selectorMap = this.buildSelectorMap(actions);
-      testCode = this.replaceSimpleSelectors(testCode, selectorMap);
-      
-      await fs.writeFile(testFilePath, testCode, 'utf-8');
-      
-      return true;
-    } catch (err) {
-      console.warn('Failed to enhance selectors:', err);
-      return false;
-    }
-  }
-
-  static buildSelectorMap(actions) {
-    const map = new Map();
-
-    for (let i = 0; i < actions.length; i++) {
-      const action = actions[i];
-      if (!action.selectors || action.type === 'navigate') continue;
-
-      const varName = `element${i}`;
-      const robustCode = SelectorGenerator.generate(action, varName);
-      
-      const match = robustCode.match(/= (.+);/s);
-      if (match) {
-        const locatorExpr = match[1].trim();
-        
-        const key = `${action.type}:${this.normalizeDescription(action.description)}`;
-        map.set(key, locatorExpr);
-
-        if (action.selectors.role) {
-          map.set(`role:${action.selectors.role.name}`, locatorExpr);
-        }
-        if (action.selectors.attributes?.placeholder) {
-          map.set(`placeholder:${action.selectors.attributes.placeholder}`, locatorExpr);
-        }
-      }
-    }
-
-    return map;
-  }
-
-  static replaceSimpleSelectors(code, selectorMap) {
-    let enhanced = code;
-
-    const selectorPatterns = [
-      /await page\.(getByRole|getByPlaceholder|getByText|getByLabel|locator)\([^)]+\)\.(fill|click|type)\([^)]*\)/g
-    ];
-
-    for (const pattern of selectorPatterns) {
-      enhanced = enhanced.replace(pattern, (match) => {
-        for (const [key, robustLocator] of selectorMap.entries()) {
-          if (match.includes(key.split(':')[1])) {
-            const actionMatch = match.match(/\.(fill|click|type)\(([^)]*)\)/);
-            if (actionMatch) {
-              const [, method, args] = actionMatch;
-              const varName = 'element';
-              return `const ${varName} = ${robustLocator};\n    await ${varName}.${method}(${args})`;
-            }
-          }
-        }
-        return match;
-      });
-    }
-
-    return enhanced;
-  }
-
-  static normalizeDescription(desc) {
-    if (!desc) return '';
-    return desc.toLowerCase().replace(/[^a-z0-9]+/g, ' ').trim();
-  }
-}
-
-export default TestPostProcessor;

package/src/utils/timeline.js

@@ -1,217 +0,0 @@
-/**
- * Timeline UI - OpenClaw-style progressive output with vertical line connector
- * 
- * When inside a node, ALL console output is automatically prefixed with │
- * and soft-wrapped at terminal width so the pipe stays visible on every
- * visual line, even when text wraps.
- * 
- * Milestone dots (◆) sit ON the line, replacing │ at that point.
- */
-
-import chalk from 'chalk';
-
-const PIPE = chalk.gray('│');
-const PIPE_START = chalk.gray('┌');
-const PIPE_END = chalk.gray('└');
-const DOT = chalk.green('◆');
-const DOT_TOOL = chalk.hex('#c084fc')('◆');
-const DOT_MEMORY = chalk.hex('#2dd4bf')('◆');
-const DOT_FAIL = chalk.red('◆');
-
-const PIPE_PREFIX = `${PIPE} `;
-const PIPE_VISUAL_WIDTH = 2;
-
-function formatDuration(ms) {
-  if (ms < 1000) return `${ms}ms`;
-  return `${(ms / 1000).toFixed(1)}s`;
-}
-
-function makeWrapWriter(orig, state) {
-  return (chunk, encoding, callback) => {
-    if (typeof chunk !== 'string') {
-      return orig(chunk, encoding, callback);
-    }
-
-    const cols = process.stdout.columns || 120;
-    let out = '';
-
-    for (let i = 0; i < chunk.length; i++) {
-      const ch = chunk[i];
-
-      if (state.lineStart) {
-        out += PIPE_PREFIX;
-        state.col = PIPE_VISUAL_WIDTH;
-        state.lineStart = false;
-      }
-
-      if (ch === '\n') {
-        out += ch;
-        state.lineStart = true;
-        state.col = 0;
-        state.inEsc = false;
-      } else if (ch === '\x1b') {
-        state.inEsc = true;
-        out += ch;
-      } else if (state.inEsc) {
-        out += ch;
-        if ((ch >= 'A' && ch <= 'Z') || (ch >= 'a' && ch <= 'z')) {
-          state.inEsc = false;
-        }
-      } else {
-        state.col++;
-        out += ch;
-        if (state.col >= cols) {
-          out += `\n${  PIPE_PREFIX}`;
-          state.col = PIPE_VISUAL_WIDTH;
-        }
-      }
-    }
-
-    return orig(out, encoding, callback);
-  };
-}
-
-class Timeline {
-  constructor() {
-    this._currentNode = null;
-    this._origStdoutWrite = null;
-    this._origStderrWrite = null;
-  }
-
-  get isInsideNode() {
-    return this._currentNode !== null;
-  }
-
-  _startIntercepting() {
-    this._origStdoutWrite = process.stdout.write.bind(process.stdout);
-    this._origStderrWrite = process.stderr.write.bind(process.stderr);
-
-    const outState = { lineStart: true, col: 0, inEsc: false };
-    const errState = { lineStart: true, col: 0, inEsc: false };
-    this._outState = outState;
-    this._errState = errState;
-
-    process.stdout.write = makeWrapWriter(this._origStdoutWrite, outState);
-    process.stderr.write = makeWrapWriter(this._origStderrWrite, errState);
-  }
-
-  _stopIntercepting() {
-    if (this._origStdoutWrite) {
-      if (this._outState && !this._outState.lineStart) {
-        this._origStdoutWrite('\n');
-      }
-      process.stdout.write = this._origStdoutWrite;
-    }
-    if (this._origStderrWrite) {
-      if (this._errState && !this._errState.lineStart) {
-        this._origStderrWrite('\n');
-      }
-      process.stderr.write = this._origStderrWrite;
-    }
-    this._origStdoutWrite = null;
-    this._origStderrWrite = null;
-  }
-
-  _rawWrite(msg) {
-    const write = this._origStdoutWrite || process.stdout.write.bind(process.stdout);
-    write(`${msg  }\n`);
-  }
-
-  /**
-   * Write a milestone dot ON the line. If interceptor is active and we're
-   * mid-line, finish that line first so the dot starts on a fresh line.
-   */
-  _writeDot(dot, message) {
-    if (this._origStdoutWrite) {
-      if (this._outState && !this._outState.lineStart) {
-        this._origStdoutWrite('\n');
-        this._outState.lineStart = true;
-        this._outState.col = 0;
-      }
-      this._origStdoutWrite(`${dot} ${message}\n`);
-    } else {
-      const write = process.stdout.write.bind(process.stdout);
-      write(`${dot} ${message}\n`);
-    }
-  }
-
-  /**
-   * Milestone dot ON the line (inside a node) or with pipe prefix (outside).
-   */
-  step(message) {
-    if (this._origStdoutWrite) {
-      this._writeDot(DOT, message);
-    } else {
-      const write = process.stdout.write.bind(process.stdout);
-      write(`${PIPE}  ${DOT} ${message}\n`);
-    }
-  }
-
-  stepTool(message) {
-    if (this._origStdoutWrite) {
-      this._writeDot(DOT_TOOL, message);
-    } else {
-      const write = process.stdout.write.bind(process.stdout);
-      write(`${PIPE}  ${DOT_TOOL} ${message}\n`);
-    }
-  }
-
-  stepMemory(message) {
-    const colored = chalk.hex('#2dd4bf')(message);
-    if (this._origStdoutWrite) {
-      this._writeDot(DOT_MEMORY, colored);
-    } else {
-      const write = process.stdout.write.bind(process.stdout);
-      write(`${PIPE}  ${DOT_MEMORY} ${colored}\n`);
-    }
-  }
-
-  stepFail(message) {
-    if (this._origStdoutWrite) {
-      this._writeDot(DOT_FAIL, chalk.red(message));
-    } else {
-      const write = process.stdout.write.bind(process.stdout);
-      write(`${PIPE}  ${DOT_FAIL} ${chalk.red(message)}\n`);
-    }
-  }
-
-  nodeStart(name) {
-    this._currentNode = name;
-    this._rawWrite(`${PIPE_START} ${name}`);
-    this._startIntercepting();
-  }
-
-  nodeComplete(name, opts = {}) {
-    this._stopIntercepting();
-    const { duration, details } = opts;
-    if (details) {
-      for (const d of details) {
-        this._rawWrite(`${DOT} ${d}`);
-      }
-    }
-    const durationStr = duration ? chalk.dim(` ${formatDuration(duration)}`) : '';
-    this._rawWrite(`${PIPE_END} ${chalk.green('done')}${durationStr}`);
-    this._rawWrite('');
-  }
-
-  nodeFailed(name, error, opts = {}) {
-    this._stopIntercepting();
-    const { duration } = opts;
-    const durationStr = duration ? chalk.dim(` ${formatDuration(duration)}`) : '';
-    this._rawWrite(`${DOT_FAIL} ${chalk.red(error)}`);
-    this._rawWrite(`${PIPE_END} ${chalk.red('failed')}${durationStr}`);
-    this._rawWrite('');
-  }
-
-  route(from, to) {
-    this._rawWrite(chalk.dim(`  ${from} → ${to}`));
-    this._rawWrite('');
-  }
-
-  graphComplete() {
-    this._rawWrite(chalk.green.bold('✓ Workflow completed'));
-  }
-}
-
-export const timeline = new Timeline();
-export default timeline;