vibecheck-ai 2.0.1 → 5.0.0

package/bin/runners/lib/packs/evidence-pack.js

@@ -0,0 +1,671 @@
+// bin/runners/lib/packs/evidence-pack.js
+// ═══════════════════════════════════════════════════════════════════════════════
+// EVIDENCE PACK V2 - Enhanced evidence bundling with receipt cross-references
+// Bundles screenshots, videos, traces, HAR files, and findings
+// ═══════════════════════════════════════════════════════════════════════════════
+
+const fs = require('fs');
+const path = require('path');
+const {
+  createPackBuilder,
+  PACK_TYPE,
+  ARTIFACT_TYPE,
+  collectReceiptReferences,
+  loadReceipt,
+  formatSize,
+} = require('./pack-factory');
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// ARTIFACT COLLECTION
+// ═══════════════════════════════════════════════════════════════════════════════
+
+/**
+ * Artifact type mappings
+ */
+const ARTIFACT_EXTENSIONS = {
+  screenshots: ['.png', '.jpg', '.jpeg', '.webp', '.gif'],
+  videos: ['.webm', '.mp4', '.mov'],
+  traces: ['.zip'], // Playwright traces
+  har: ['.har'],
+  logs: ['.log', '.txt'],
+};
+
+/**
+ * Collect artifacts from directory
+ * @param {string} dir - Directory to scan
+ * @param {string} type - Artifact type
+ * @param {string[]} extensions - Valid extensions
+ * @returns {Array} Found artifacts
+ */
+function collectFromDir(dir, type, extensions) {
+  const artifacts = [];
+  
+  if (!fs.existsSync(dir)) return artifacts;
+  
+  function scan(currentDir, relativePath = '') {
+    const entries = fs.readdirSync(currentDir, { withFileTypes: true });
+    
+    for (const entry of entries) {
+      const fullPath = path.join(currentDir, entry.name);
+      const relPath = relativePath ? `${relativePath}/${entry.name}` : entry.name;
+      
+      if (entry.isDirectory()) {
+        scan(fullPath, relPath);
+      } else if (entry.isFile()) {
+        const ext = path.extname(entry.name).toLowerCase();
+        if (extensions.includes(ext)) {
+          const stats = fs.statSync(fullPath);
+          artifacts.push({
+            type,
+            filename: entry.name,
+            path: fullPath,
+            relativePath: relPath,
+            size: stats.size,
+            extension: ext,
+            modified: stats.mtime,
+          });
+        }
+      }
+    }
+  }
+  
+  scan(dir);
+  return artifacts;
+}
+
+/**
+ * Collect all evidence artifacts from .vibecheck directories
+ * @param {string} repoRoot - Repository root
+ * @param {object} options - Collection options
+ * @returns {object} Collected artifacts by type
+ */
+function collectEvidence(repoRoot, options = {}) {
+  const { runId, maxArtifacts = 100 } = options;
+  
+  const evidence = {
+    screenshots: [],
+    videos: [],
+    traces: [],
+    har: [],
+    logs: [],
+    findings: [],
+  };
+  
+  // Directories to scan
+  const scanDirs = [
+    '.vibecheck/prove',
+    '.vibecheck/reality',
+    '.vibecheck/receipts',
+    '.vibecheck/proofs',
+  ];
+  
+  // If runId specified, only scan that run
+  if (runId) {
+    scanDirs.push(`.vibecheck/receipts/${runId}`);
+    scanDirs.push(`.vibecheck/proofs/${runId}`);
+    scanDirs.push(`.vibecheck/runs/${runId}`);
+  }
+  
+  // Collect artifacts by type
+  for (const dir of scanDirs) {
+    const fullDir = path.join(repoRoot, dir);
+    
+    evidence.screenshots.push(...collectFromDir(fullDir, 'screenshot', ARTIFACT_EXTENSIONS.screenshots));
+    evidence.videos.push(...collectFromDir(fullDir, 'video', ARTIFACT_EXTENSIONS.videos));
+    evidence.traces.push(...collectFromDir(fullDir, 'trace', ARTIFACT_EXTENSIONS.traces));
+    evidence.har.push(...collectFromDir(fullDir, 'har', ARTIFACT_EXTENSIONS.har));
+    evidence.logs.push(...collectFromDir(fullDir, 'log', ARTIFACT_EXTENSIONS.logs));
+  }
+  
+  // Load findings from latest scan
+  const scanPath = path.join(repoRoot, '.vibecheck/results/latest.json');
+  if (fs.existsSync(scanPath)) {
+    try {
+      const scan = JSON.parse(fs.readFileSync(scanPath, 'utf8'));
+      evidence.findings = scan.findings || scan.report?.findings || [];
+    } catch (e) {
+      // Skip if can't read
+    }
+  }
+  
+  // Deduplicate and limit
+  for (const type of Object.keys(ARTIFACT_EXTENSIONS)) {
+    const seen = new Set();
+    evidence[type] = evidence[type]
+      .filter(a => {
+        if (seen.has(a.path)) return false;
+        seen.add(a.path);
+        return true;
+      })
+      .sort((a, b) => b.modified - a.modified)
+      .slice(0, maxArtifacts);
+  }
+  
+  return evidence;
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// EVIDENCE REPORT GENERATION
+// ═══════════════════════════════════════════════════════════════════════════════
+
+/**
+ * Generate markdown evidence report
+ * @param {object} evidence - Collected evidence
+ * @param {object} receipts - Receipt references
+ * @returns {string} Markdown content
+ */
+function generateMarkdownReport(evidence, receipts) {
+  const lines = [];
+  
+  lines.push('# Evidence Pack Report');
+  lines.push('');
+  lines.push(`Generated: ${new Date().toISOString()}`);
+  lines.push('');
+  
+  // Summary
+  lines.push('## Summary');
+  lines.push('');
+  lines.push(`- **Screenshots:** ${evidence.screenshots.length}`);
+  lines.push(`- **Videos:** ${evidence.videos.length}`);
+  lines.push(`- **Traces:** ${evidence.traces.length}`);
+  lines.push(`- **HAR Files:** ${evidence.har.length}`);
+  lines.push(`- **Findings:** ${evidence.findings.length}`);
+  lines.push('');
+  
+  // Cross-references
+  lines.push('## Cross-References');
+  lines.push('');
+  if (receipts.ship) {
+    lines.push(`- **Ship Receipt:** ${receipts.ship.verdict || 'N/A'} (${receipts.ship.path})`);
+  }
+  if (receipts.reality) {
+    lines.push(`- **Reality Receipt:** ${receipts.reality.verdict || 'N/A'} (Run: ${receipts.reality.runId})`);
+  }
+  if (receipts.scan) {
+    lines.push(`- **Scan Receipt:** ${receipts.scan.findingCount} findings`);
+  }
+  lines.push('');
+  
+  // Findings
+  if (evidence.findings.length > 0) {
+    lines.push('## Findings');
+    lines.push('');
+    lines.push('| Severity | Category | Title |');
+    lines.push('|----------|----------|-------|');
+    for (const f of evidence.findings.slice(0, 25)) {
+      const title = (f.title || f.message || '').slice(0, 50);
+      lines.push(`| ${f.severity} | ${f.category} | ${title} |`);
+    }
+    if (evidence.findings.length > 25) {
+      lines.push(`\n_... and ${evidence.findings.length - 25} more findings_`);
+    }
+    lines.push('');
+  }
+  
+  // Screenshots
+  if (evidence.screenshots.length > 0) {
+    lines.push('## Screenshots');
+    lines.push('');
+    for (const s of evidence.screenshots.slice(0, 10)) {
+      lines.push(`- \`${s.relativePath}\` (${formatSize(s.size)})`);
+    }
+    if (evidence.screenshots.length > 10) {
+      lines.push(`\n_... and ${evidence.screenshots.length - 10} more screenshots_`);
+    }
+    lines.push('');
+  }
+  
+  // Videos
+  if (evidence.videos.length > 0) {
+    lines.push('## Videos');
+    lines.push('');
+    for (const v of evidence.videos.slice(0, 5)) {
+      lines.push(`- \`${v.relativePath}\` (${formatSize(v.size)})`);
+    }
+    if (evidence.videos.length > 5) {
+      lines.push(`\n_... and ${evidence.videos.length - 5} more videos_`);
+    }
+    lines.push('');
+  }
+  
+  // Traces
+  if (evidence.traces.length > 0) {
+    lines.push('## Playwright Traces');
+    lines.push('');
+    for (const t of evidence.traces.slice(0, 10)) {
+      lines.push(`- \`${t.relativePath}\` (${formatSize(t.size)})`);
+    }
+    lines.push('');
+  }
+  
+  return lines.join('\n');
+}
+
+/**
+ * Generate HTML evidence gallery
+ * @param {object} evidence - Collected evidence
+ * @param {object} receipts - Receipt references
+ * @returns {string} HTML content
+ */
+function generateHtmlGallery(evidence, receipts) {
+  const screenshotCards = evidence.screenshots.slice(0, 20).map(s => `
+    <div class="artifact-card">
+      <img src="${s.relativePath}" alt="${s.filename}" loading="lazy">
+      <div class="artifact-info">
+        <div class="artifact-name">${s.filename}</div>
+        <div class="artifact-size">${formatSize(s.size)}</div>
+      </div>
+    </div>
+  `).join('');
+  
+  const videoCards = evidence.videos.slice(0, 10).map(v => `
+    <div class="artifact-card video">
+      <video controls preload="metadata">
+        <source src="${v.relativePath}" type="video/${v.extension.slice(1)}">
+      </video>
+      <div class="artifact-info">
+        <div class="artifact-name">${v.filename}</div>
+        <div class="artifact-size">${formatSize(v.size)}</div>
+      </div>
+    </div>
+  `).join('');
+  
+  const findingRows = evidence.findings.slice(0, 50).map(f => {
+    const severityClass = f.severity === 'BLOCK' ? 'danger' : f.severity === 'WARN' ? 'warning' : 'info';
+    return `
+      <tr>
+        <td><span class="badge ${severityClass}">${f.severity}</span></td>
+        <td>${f.category || 'N/A'}</td>
+        <td>${(f.title || f.message || '').slice(0, 60)}</td>
+        <td>${f.file || 'N/A'}</td>
+      </tr>
+    `;
+  }).join('');
+  
+  return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Evidence Pack Gallery</title>
+  <style>
+    :root {
+      --bg: #0d1117;
+      --surface: #161b22;
+      --border: #30363d;
+      --text: #c9d1d9;
+      --text-muted: #8b949e;
+      --accent: #ff9650;
+      --success: #3fb950;
+      --warning: #d29922;
+      --danger: #f85149;
+      --info: #58a6ff;
+    }
+    
+    * { box-sizing: border-box; margin: 0; padding: 0; }
+    
+    body {
+      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+      background: var(--bg);
+      color: var(--text);
+      line-height: 1.6;
+      padding: 2rem;
+    }
+    
+    .container { max-width: 1400px; margin: 0 auto; }
+    
+    h1 { color: var(--accent); margin-bottom: 0.5rem; }
+    h2 { 
+      margin-top: 2rem;
+      margin-bottom: 1rem;
+      padding-bottom: 0.5rem;
+      border-bottom: 1px solid var(--border);
+    }
+    
+    .subtitle { color: var(--text-muted); margin-bottom: 2rem; }
+    
+    .stats {
+      display: flex;
+      gap: 1rem;
+      margin-bottom: 2rem;
+      flex-wrap: wrap;
+    }
+    
+    .stat {
+      background: var(--surface);
+      padding: 1rem 1.5rem;
+      border-radius: 8px;
+      border: 1px solid var(--border);
+    }
+    
+    .stat-value {
+      font-size: 1.5rem;
+      font-weight: bold;
+      color: var(--accent);
+    }
+    
+    .stat-label {
+      font-size: 0.75rem;
+      color: var(--text-muted);
+      text-transform: uppercase;
+    }
+    
+    .receipts {
+      display: flex;
+      gap: 1rem;
+      margin-bottom: 2rem;
+      flex-wrap: wrap;
+    }
+    
+    .receipt {
+      background: var(--surface);
+      border-left: 3px solid;
+      padding: 1rem;
+      border-radius: 0 6px 6px 0;
+    }
+    
+    .receipt.ship { border-color: var(--success); }
+    .receipt.reality { border-color: var(--info); }
+    .receipt.scan { border-color: var(--warning); }
+    
+    .receipt-type {
+      font-size: 0.75rem;
+      color: var(--text-muted);
+      text-transform: uppercase;
+    }
+    
+    .receipt-verdict {
+      font-weight: 600;
+    }
+    
+    .gallery {
+      display: grid;
+      grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+      gap: 1rem;
+    }
+    
+    .artifact-card {
+      background: var(--surface);
+      border-radius: 8px;
+      overflow: hidden;
+      border: 1px solid var(--border);
+    }
+    
+    .artifact-card img {
+      width: 100%;
+      height: 180px;
+      object-fit: cover;
+      cursor: pointer;
+    }
+    
+    .artifact-card.video video {
+      width: 100%;
+      height: 180px;
+      object-fit: cover;
+      background: #000;
+    }
+    
+    .artifact-info {
+      padding: 0.75rem;
+    }
+    
+    .artifact-name {
+      font-size: 0.875rem;
+      font-weight: 500;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    
+    .artifact-size {
+      font-size: 0.75rem;
+      color: var(--text-muted);
+    }
+    
+    table {
+      width: 100%;
+      border-collapse: collapse;
+      background: var(--surface);
+      border-radius: 8px;
+      overflow: hidden;
+    }
+    
+    th, td {
+      padding: 0.75rem;
+      text-align: left;
+      border-bottom: 1px solid var(--border);
+    }
+    
+    th {
+      background: var(--bg);
+      font-size: 0.75rem;
+      text-transform: uppercase;
+      color: var(--text-muted);
+    }
+    
+    .badge {
+      display: inline-block;
+      padding: 0.25rem 0.5rem;
+      border-radius: 4px;
+      font-size: 0.75rem;
+      font-weight: 500;
+    }
+    
+    .badge.danger { background: var(--danger)22; color: var(--danger); }
+    .badge.warning { background: var(--warning)22; color: var(--warning); }
+    .badge.info { background: var(--info)22; color: var(--info); }
+    
+    .lightbox {
+      display: none;
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(0,0,0,0.9);
+      z-index: 1000;
+      cursor: pointer;
+      align-items: center;
+      justify-content: center;
+    }
+    
+    .lightbox.active { display: flex; }
+    
+    .lightbox img {
+      max-width: 90%;
+      max-height: 90%;
+      object-fit: contain;
+    }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <h1>Evidence Pack Gallery</h1>
+    <p class="subtitle">Generated: ${new Date().toISOString()}</p>
+    
+    <div class="stats">
+      <div class="stat">
+        <div class="stat-value">${evidence.screenshots.length}</div>
+        <div class="stat-label">Screenshots</div>
+      </div>
+      <div class="stat">
+        <div class="stat-value">${evidence.videos.length}</div>
+        <div class="stat-label">Videos</div>
+      </div>
+      <div class="stat">
+        <div class="stat-value">${evidence.traces.length}</div>
+        <div class="stat-label">Traces</div>
+      </div>
+      <div class="stat">
+        <div class="stat-value">${evidence.findings.length}</div>
+        <div class="stat-label">Findings</div>
+      </div>
+    </div>
+    
+    <div class="receipts">
+      ${receipts.ship ? `
+        <div class="receipt ship">
+          <div class="receipt-type">Ship Receipt</div>
+          <div class="receipt-verdict">${receipts.ship.verdict || 'N/A'}</div>
+        </div>
+      ` : ''}
+      ${receipts.reality ? `
+        <div class="receipt reality">
+          <div class="receipt-type">Reality Receipt</div>
+          <div class="receipt-verdict">${receipts.reality.verdict || 'N/A'}</div>
+        </div>
+      ` : ''}
+      ${receipts.scan ? `
+        <div class="receipt scan">
+          <div class="receipt-type">Scan</div>
+          <div class="receipt-verdict">${receipts.scan.findingCount} findings</div>
+        </div>
+      ` : ''}
+    </div>
+    
+    ${evidence.findings.length > 0 ? `
+    <h2>Findings (${evidence.findings.length})</h2>
+    <table>
+      <thead>
+        <tr>
+          <th>Severity</th>
+          <th>Category</th>
+          <th>Title</th>
+          <th>File</th>
+        </tr>
+      </thead>
+      <tbody>
+        ${findingRows}
+      </tbody>
+    </table>
+    ` : ''}
+    
+    ${evidence.screenshots.length > 0 ? `
+    <h2>Screenshots (${evidence.screenshots.length})</h2>
+    <div class="gallery">
+      ${screenshotCards}
+    </div>
+    ` : ''}
+    
+    ${evidence.videos.length > 0 ? `
+    <h2>Videos (${evidence.videos.length})</h2>
+    <div class="gallery">
+      ${videoCards}
+    </div>
+    ` : ''}
+  </div>
+  
+  <div class="lightbox" onclick="this.classList.remove('active')">
+    <img src="" alt="Lightbox">
+  </div>
+  
+  <script>
+    document.querySelectorAll('.artifact-card img').forEach(img => {
+      img.addEventListener('click', function(e) {
+        e.stopPropagation();
+        const lightbox = document.querySelector('.lightbox');
+        lightbox.querySelector('img').src = this.src;
+        lightbox.classList.add('active');
+      });
+    });
+  </script>
+</body>
+</html>`;
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// PACK BUILDER
+// ═══════════════════════════════════════════════════════════════════════════════
+
+/**
+ * Build evidence pack
+ * @param {string} repoRoot - Repository root
+ * @param {object} options - Build options
+ * @returns {object} Build result
+ */
+async function buildEvidencePack(repoRoot, options = {}) {
+  const { outputDir, createZip = false, runId, maxArtifacts = 100 } = options;
+  
+  // Collect evidence
+  const evidence = collectEvidence(repoRoot, { runId, maxArtifacts });
+  
+  // Collect receipts
+  const receipts = collectReceiptReferences(repoRoot);
+  
+  // Generate reports
+  const markdownReport = generateMarkdownReport(evidence, receipts);
+  const htmlGallery = generateHtmlGallery(evidence, receipts);
+  
+  // Build pack
+  const builder = createPackBuilder(PACK_TYPE.EVIDENCE, repoRoot);
+  
+  if (outputDir) {
+    builder.outputTo(outputDir);
+  }
+  
+  // Add reports
+  builder
+    .addArtifact('evidence-report.md', markdownReport, ARTIFACT_TYPE.MARKDOWN, 'Evidence report')
+    .addArtifact('gallery.html', htmlGallery, ARTIFACT_TYPE.HTML, 'Evidence gallery');
+  
+  // Add evidence data
+  builder.addArtifact('evidence.json', JSON.stringify({
+    screenshots: evidence.screenshots.map(s => ({ ...s, path: undefined })),
+    videos: evidence.videos.map(v => ({ ...v, path: undefined })),
+    traces: evidence.traces.map(t => ({ ...t, path: undefined })),
+    har: evidence.har.map(h => ({ ...h, path: undefined })),
+    findings: evidence.findings,
+  }, null, 2), ARTIFACT_TYPE.JSON, 'Evidence data');
+  
+  // Add actual artifacts (screenshots, videos, traces)
+  for (const screenshot of evidence.screenshots.slice(0, 20)) {
+    builder.addFile(screenshot.path, `screenshots/${screenshot.filename}`, ARTIFACT_TYPE.SCREENSHOT);
+  }
+  
+  for (const video of evidence.videos.slice(0, 5)) {
+    builder.addFile(video.path, `videos/${video.filename}`, ARTIFACT_TYPE.VIDEO);
+  }
+  
+  for (const trace of evidence.traces.slice(0, 10)) {
+    builder.addFile(trace.path, `traces/${trace.filename}`, ARTIFACT_TYPE.TRACE);
+  }
+  
+  for (const har of evidence.har.slice(0, 10)) {
+    builder.addFile(har.path, `har/${har.filename}`, ARTIFACT_TYPE.HAR);
+  }
+  
+  builder.withMetadata({
+    screenshotCount: evidence.screenshots.length,
+    videoCount: evidence.videos.length,
+    traceCount: evidence.traces.length,
+    harCount: evidence.har.length,
+    findingCount: evidence.findings.length,
+    hasShipReceipt: !!receipts.ship,
+    hasRealityReceipt: !!receipts.reality,
+    runId,
+  });
+  
+  if (createZip) {
+    return builder.buildZip();
+  }
+  
+  return builder.build();
+}
+
+// ═══════════════════════════════════════════════════════════════════════════════
+// EXPORTS
+// ═══════════════════════════════════════════════════════════════════════════════
+
+module.exports = {
+  // Collection
+  collectEvidence,
+  collectFromDir,
+  ARTIFACT_EXTENSIONS,
+  
+  // Reports
+  generateMarkdownReport,
+  generateHtmlGallery,
+  
+  // Builder
+  buildEvidencePack,
+};