executable-stories-formatters 0.7.14 → 0.8.0

package/dist/index.js

@@ -1,6 +1,6 @@
 // src/index.ts
 import "fs";
-import * as path8 from "path";
+import * as path9 from "path";
 import * as fsPromises from "fs/promises";
 
 // src/converters/acl/status.ts
@@ -678,9 +678,299 @@ ${doc.markdown}`,
   }
 };
 
+// src/converters/story-report.ts
+import { posix as path2 } from "path";
+
+// src/types/story-report.ts
+var STORY_REPORT_SCHEMA_VERSION = "1.0";
+var STORY_REPORT_SCHEMA_MAJOR = 1;
+
+// src/converters/story-report.ts
+function reportSlug(text2) {
+  return text2.toLowerCase().replace(/[/\\.]+/g, "-").replace(/[^\w\s-]/g, "").replace(/[\s_]+/g, "-").replace(/-+/g, "-").replace(/^-+|-+$/g, "");
+}
+function toRelativeSourceFile(sourceFile, projectRoot) {
+  if (!sourceFile) return sourceFile;
+  const normalized = sourceFile.split(path2.sep).join("/");
+  const root = projectRoot.split(path2.sep).join("/").replace(/\/$/, "");
+  if (root && normalized.startsWith(root + "/")) return normalized.slice(root.length + 1);
+  return normalized;
+}
+function fileBasenameTitle(sourceFile) {
+  const base = sourceFile.split("/").pop() ?? sourceFile;
+  return base.replace(/\.(story\.)?(test|spec)\.[tj]sx?$/, "").replace(/\.[tj]sx?$/, "");
+}
+function emptySummary() {
+  return { total: 0, passed: 0, failed: 0, skipped: 0, pending: 0, durationMs: 0 };
+}
+function addToSummary(summary, status, durationMs) {
+  summary.total += 1;
+  summary[status] += 1;
+  summary.durationMs += durationMs;
+}
+function isKeyword(value) {
+  return value === "Given" || value === "When" || value === "Then" || value === "And" || value === "But";
+}
+function copyDocEntries(entries) {
+  if (!entries || entries.length === 0) return [];
+  return entries.map(copyDocEntry);
+}
+function copyDocEntry(entry) {
+  const children = entry.children ? { children: copyDocEntries(entry.children) } : {};
+  switch (entry.kind) {
+    case "note":
+      return { kind: "note", text: entry.text, phase: entry.phase, ...children };
+    case "tag":
+      return { kind: "tag", names: [...entry.names], phase: entry.phase, ...children };
+    case "kv":
+      return { kind: "kv", label: entry.label, value: entry.value, phase: entry.phase, ...children };
+    case "code":
+      return {
+        kind: "code",
+        label: entry.label,
+        content: entry.content,
+        ...entry.lang ? { lang: entry.lang } : {},
+        phase: entry.phase,
+        ...children
+      };
+    case "table":
+      return {
+        kind: "table",
+        label: entry.label,
+        columns: [...entry.columns],
+        rows: entry.rows.map((r) => [...r]),
+        phase: entry.phase,
+        ...children
+      };
+    case "link":
+      return { kind: "link", label: entry.label, url: entry.url, phase: entry.phase, ...children };
+    case "section":
+      return { kind: "section", title: entry.title, markdown: entry.markdown, phase: entry.phase, ...children };
+    case "mermaid":
+      return {
+        kind: "mermaid",
+        code: entry.code,
+        ...entry.title ? { title: entry.title } : {},
+        phase: entry.phase,
+        ...children
+      };
+    case "screenshot":
+      return {
+        kind: "screenshot",
+        path: entry.path,
+        ...entry.alt ? { alt: entry.alt } : {},
+        phase: entry.phase,
+        ...children
+      };
+    case "custom":
+      return {
+        kind: "custom",
+        type: entry.type,
+        data: entry.data,
+        phase: entry.phase,
+        ...children
+      };
+  }
+}
+function buildStep(args) {
+  const step = {
+    id: `${args.scenarioId}--step-${args.index}`,
+    index: args.index,
+    keyword: args.keyword,
+    text: args.text,
+    status: args.status,
+    durationMs: args.durationMs,
+    docEntries: args.docEntries
+  };
+  if (args.errorMessage !== void 0) step.errorMessage = args.errorMessage;
+  if (args.mode !== void 0) step.mode = args.mode;
+  return step;
+}
+function buildSteps(scenarioId, tc) {
+  const declared = tc.story.steps ?? [];
+  const results = tc.stepResults;
+  const max = Math.max(declared.length, results.length);
+  const steps = [];
+  for (let i = 0; i < max; i++) {
+    const decl = declared[i];
+    const res = results[i];
+    const keywordSource = decl?.keyword;
+    const keyword = keywordSource && isKeyword(keywordSource) ? keywordSource : "Given";
+    const text2 = decl?.text ?? "";
+    const status = res?.status ?? "pending";
+    const durationMs = res?.durationMs ?? decl?.durationMs ?? 0;
+    const docEntries = copyDocEntries(decl?.docs);
+    steps.push(buildStep({
+      scenarioId,
+      index: i,
+      keyword,
+      text: text2,
+      status,
+      durationMs,
+      ...res?.errorMessage !== void 0 ? { errorMessage: res.errorMessage } : {},
+      ...decl?.mode !== void 0 ? { mode: decl.mode } : {},
+      docEntries
+    }));
+  }
+  return steps;
+}
+function buildAttachments(tc) {
+  return tc.attachments.map((a) => ({
+    name: a.name,
+    mediaType: a.mediaType,
+    body: a.body,
+    contentEncoding: a.contentEncoding
+  }));
+}
+function buildScenario(tc, featureId) {
+  const titleRaw = tc.story.scenario?.trim() || "(untitled scenario)";
+  const id = `${featureId}--${reportSlug(titleRaw) || `case-${tc.id}`}`;
+  const steps = buildSteps(id, tc);
+  const scenario = {
+    id,
+    title: titleRaw,
+    status: tc.status,
+    durationMs: tc.durationMs,
+    tags: [...tc.tags],
+    retry: tc.retry,
+    retries: tc.retries,
+    docEntries: copyDocEntries(tc.story.docs),
+    steps,
+    attachments: buildAttachments(tc)
+  };
+  if (tc.sourceLine && tc.sourceLine > 0) scenario.sourceLine = tc.sourceLine;
+  if (tc.errorMessage !== void 0) scenario.errorMessage = tc.errorMessage;
+  if (tc.errorStack !== void 0) scenario.errorStack = tc.errorStack;
+  const tickets = tc.story.tickets;
+  if (tickets && tickets.length > 0) {
+    scenario.tickets = tickets.map((t) => t.url ? { id: t.id, url: t.url } : { id: t.id });
+  }
+  return scenario;
+}
+function deriveFeatureTitle(group, relSourceFile) {
+  for (const tc of group) {
+    const head = tc.titlePath?.[0];
+    if (head && head.trim()) return head.trim();
+  }
+  return fileBasenameTitle(relSourceFile);
+}
+function compareScenarios(a, b) {
+  const aLine = a.sourceLine ?? Number.POSITIVE_INFINITY;
+  const bLine = b.sourceLine ?? Number.POSITIVE_INFINITY;
+  if (aLine !== bLine) return aLine - bLine;
+  return a.title.localeCompare(b.title);
+}
+function buildFeature(relSourceFile, group) {
+  const id = `feature-${reportSlug(relSourceFile.replace(/\.[^.]+$/, "")) || "untitled"}`;
+  const title = deriveFeatureTitle(group, relSourceFile);
+  const summary = emptySummary();
+  const scenarios = [];
+  for (const tc of group) {
+    const scenario = buildScenario(tc, id);
+    scenarios.push(scenario);
+    addToSummary(summary, scenario.status, scenario.durationMs);
+  }
+  scenarios.sort(compareScenarios);
+  return { id, title, sourceFile: relSourceFile, summary, scenarios };
+}
+function ensureUniqueFeatureIds(features) {
+  const seen = /* @__PURE__ */ new Map();
+  for (const f of features) {
+    const count = seen.get(f.id) ?? 0;
+    if (count > 0) f.id = `${f.id}-${count + 1}`;
+    seen.set(f.id, count + 1);
+  }
+}
+function ensureUniqueScenarioIds(feature) {
+  const seen = /* @__PURE__ */ new Map();
+  for (const s of feature.scenarios) {
+    const count = seen.get(s.id) ?? 0;
+    if (count > 0) {
+      const newId = `${s.id}-${count + 1}`;
+      for (const step of s.steps) {
+        step.id = step.id.replace(s.id, newId);
+      }
+      s.id = newId;
+    }
+    seen.set(s.id, count + 1);
+  }
+}
+function toStoryReport(run) {
+  const groups = /* @__PURE__ */ new Map();
+  for (const tc of run.testCases) {
+    const rel = toRelativeSourceFile(tc.sourceFile, run.projectRoot);
+    const existing = groups.get(rel);
+    if (existing) existing.push(tc);
+    else groups.set(rel, [tc]);
+  }
+  const features = [];
+  for (const [rel, group] of groups) {
+    features.push(buildFeature(rel, group));
+  }
+  features.sort((a, b) => a.title.localeCompare(b.title));
+  ensureUniqueFeatureIds(features);
+  for (const f of features) ensureUniqueScenarioIds(f);
+  const summary = emptySummary();
+  for (const f of features) {
+    summary.total += f.summary.total;
+    summary.passed += f.summary.passed;
+    summary.failed += f.summary.failed;
+    summary.skipped += f.summary.skipped;
+    summary.pending += f.summary.pending;
+    summary.durationMs += f.summary.durationMs;
+  }
+  const report = {
+    schemaVersion: STORY_REPORT_SCHEMA_VERSION,
+    runId: run.runId,
+    startedAtMs: run.startedAtMs,
+    finishedAtMs: run.finishedAtMs,
+    durationMs: run.durationMs,
+    projectRoot: run.projectRoot,
+    summary,
+    features
+  };
+  if (run.packageVersion) report.packageVersion = run.packageVersion;
+  if (run.gitSha) report.gitSha = run.gitSha;
+  if (run.ci) {
+    const ci = { name: run.ci.name };
+    if (run.ci.url) ci.url = run.ci.url;
+    if (run.ci.buildNumber) ci.buildNumber = run.ci.buildNumber;
+    if (run.ci.branch) ci.branch = run.ci.branch;
+    if (run.ci.commitSha) ci.commitSha = run.ci.commitSha;
+    if (run.ci.prNumber) ci.prNumber = run.ci.prNumber;
+    report.ci = ci;
+  }
+  if (run.coverage) {
+    const cov = {};
+    if (run.coverage.linesPct !== void 0) cov.linesPct = run.coverage.linesPct;
+    if (run.coverage.branchesPct !== void 0) cov.branchesPct = run.coverage.branchesPct;
+    if (run.coverage.functionsPct !== void 0) cov.functionsPct = run.coverage.functionsPct;
+    if (run.coverage.statementsPct !== void 0) cov.statementsPct = run.coverage.statementsPct;
+    report.coverage = cov;
+  }
+  return report;
+}
+
+// src/formatters/story-report-json.ts
+var StoryReportJsonFormatter = class {
+  options;
+  constructor(options = {}) {
+    this.options = {
+      pretty: options.pretty ?? true
+    };
+  }
+  toReport(run) {
+    return toStoryReport(run);
+  }
+  format(run) {
+    const report = toStoryReport(run);
+    return this.options.pretty ? JSON.stringify(report, null, 2) : JSON.stringify(report);
+  }
+};
+
 // src/formatters/html/renderers/index.ts
 import * as fs2 from "fs";
-import * as path2 from "path";
+import * as path3 from "path";
 
 // src/formatters/html/template.ts
 var JS_THEME = `
@@ -1031,11 +1321,53 @@ function initKeyboardShortcuts() {
   });
 }
 
-// Collapse/expand functionality
+// Collapse/expand functionality (persisted in localStorage)
+var COLLAPSE_KEY = 'es-collapsed-ids';
+
+function loadCollapseState() {
+  try {
+    var raw = localStorage.getItem(COLLAPSE_KEY);
+    return raw ? new Set(JSON.parse(raw)) : new Set();
+  } catch (e) {
+    return new Set();
+  }
+}
+
+function saveCollapseState(set) {
+  try {
+    localStorage.setItem(COLLAPSE_KEY, JSON.stringify(Array.from(set)));
+  } catch (e) { /* quota or disabled */ }
+}
+
+function persistCollapse(container) {
+  if (!container || !container.id) return;
+  var state = loadCollapseState();
+  if (container.classList.contains('collapsed')) {
+    state.add(container.id);
+  } else {
+    state.delete(container.id);
+  }
+  saveCollapseState(state);
+}
+
 function toggleCollapse(header, container) {
   container?.classList.toggle('collapsed');
   const isCollapsed = container?.classList.contains('collapsed');
   header.setAttribute('aria-expanded', !isCollapsed);
+  persistCollapse(container);
+}
+
+function restoreCollapseState() {
+  var state = loadCollapseState();
+  if (state.size === 0) return;
+  state.forEach(function(id) {
+    var el = document.getElementById(id);
+    if (!el) return;
+    if (!el.classList.contains('feature') && !el.classList.contains('scenario')) return;
+    el.classList.add('collapsed');
+    var header = el.querySelector('.feature-header, .scenario-header');
+    if (header) header.setAttribute('aria-expanded', 'false');
+  });
 }
 
 function initCollapse() {
@@ -1082,14 +1414,20 @@ function expandAll() {
     const header = el.querySelector('.feature-header, .scenario-header, .trace-view-header');
     header?.setAttribute('aria-expanded', 'true');
   });
+  saveCollapseState(new Set());
 }
 
 function collapseAll() {
+  var ids = new Set();
   document.querySelectorAll('.feature, .scenario, .trace-view').forEach(el => {
     el.classList.add('collapsed');
     const header = el.querySelector('.feature-header, .scenario-header, .trace-view-header');
     header?.setAttribute('aria-expanded', 'false');
+    if (el.id && (el.classList.contains('feature') || el.classList.contains('scenario'))) {
+      ids.add(el.id);
+    }
   });
+  saveCollapseState(ids);
 }
 
 // Detail level toggle
@@ -1216,6 +1554,68 @@ function copyScenarioAsMarkdown(scenarioId) {
   });
 }
 
+// Copy scenario as Claude-ready prompt (failure investigation context)
+function copyScenarioAsPrompt(scenarioId) {
+  var scenario = document.getElementById(scenarioId);
+  if (!scenario) return;
+
+  var feature = scenario.closest('.feature');
+  var featureTitle = feature ? (feature.querySelector('.feature-title') || {}).textContent || '' : '';
+  var title = (scenario.querySelector('.scenario-name') || {}).textContent || '';
+  var statusEl = scenario.querySelector('.status-icon');
+  var status = statusEl && statusEl.classList.contains('status-passed') ? 'passed' :
+               statusEl && statusEl.classList.contains('status-failed') ? 'failed' :
+               statusEl && statusEl.classList.contains('status-skipped') ? 'skipped' : 'pending';
+  var sourceLink = scenario.querySelector('.source-link');
+  var source = sourceLink ? sourceLink.textContent || '' : '';
+  var tags = Array.from(scenario.querySelectorAll('.scenario-meta .tag')).map(function(t) { return t.textContent.trim(); });
+  var steps = scenario.querySelectorAll('.step, .step.continuation');
+
+  var lines = [];
+  lines.push('I need help investigating a failing executable-story scenario.');
+  lines.push('');
+  if (featureTitle.trim()) lines.push('Feature: ' + featureTitle.trim());
+  lines.push('Scenario: ' + title.trim());
+  lines.push('Status: ' + status);
+  if (source.trim()) lines.push('Source: ' + source.trim());
+  if (tags.length > 0) lines.push('Tags: ' + tags.join(', '));
+  lines.push('');
+  lines.push('Steps:');
+  steps.forEach(function(step) {
+    var keyword = step.getAttribute('data-keyword') || '';
+    var text = step.getAttribute('data-text') || '';
+    var stepStatusEl = step.querySelector('.step-status');
+    var marker = '  ';
+    if (stepStatusEl) {
+      if (stepStatusEl.classList.contains('status-failed')) marker = 'x ';
+      else if (stepStatusEl.classList.contains('status-passed')) marker = '+ ';
+      else if (stepStatusEl.classList.contains('status-skipped')) marker = '- ';
+    }
+    lines.push(marker + keyword + ' ' + text);
+  });
+
+  var errorBox = scenario.querySelector('.error-message');
+  if (errorBox) {
+    lines.push('');
+    lines.push('Error:');
+    lines.push((errorBox.textContent || '').trim());
+  }
+  var stackBox = scenario.querySelector('.error-stack');
+  if (stackBox) {
+    lines.push('');
+    lines.push('Stack:');
+    lines.push((stackBox.textContent || '').trim());
+  }
+
+  lines.push('');
+  lines.push('Please read the source file, identify the root cause, and propose a fix.');
+
+  var text = lines.join('\\n');
+  navigator.clipboard.writeText(text).then(function() {
+    showCopyToast(scenario);
+  });
+}
+
 // Hash scroll on load
 function initHashScroll() {
   if (!location.hash) return;
@@ -1385,6 +1785,7 @@ function generateScript(options) {
   initCalls.push("initStatusFilter();");
   initCalls.push("initKeyboardShortcuts();");
   initCalls.push("initCollapse();");
+  initCalls.push("restoreCollapseState();");
   initCalls.push("initDetailLevel();");
   initCalls.push("applyAllFilters();");
   initCalls.push("initHashScroll();");
@@ -1489,6 +1890,106 @@ function escapeHtml(str) {
   return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
 }
 
+// src/theme/tokens.ts
+var ES_THEME_TOKENS_CSS = `
+:root,
+[data-theme="light"] {
+  --es-color-bg: #ffffff;
+  --es-color-fg: #111827;
+  --es-color-muted: #6b7280;
+  --es-color-border: #e5e7eb;
+  --es-color-surface: #f9fafb;
+  --es-color-link: #2563eb;
+  --es-color-passed: #16a34a;
+  --es-color-failed: #dc2626;
+  --es-color-skipped: #9ca3af;
+  --es-color-pending: #d97706;
+  --es-color-passed-bg: #f0fdf4;
+  --es-color-failed-bg: #fef2f2;
+  --es-color-skipped-bg: #f3f4f6;
+  --es-color-pending-bg: #fffbeb;
+  --es-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
+  --es-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
+  --es-size-base: 1rem;
+  --es-size-sm: 0.875rem;
+  --es-size-xs: 0.75rem;
+  --es-size-h1: 1.875rem;
+  --es-size-h2: 1.5rem;
+  --es-size-h3: 1.25rem;
+  --es-space-1: 0.25rem;
+  --es-space-2: 0.5rem;
+  --es-space-3: 0.75rem;
+  --es-space-4: 1rem;
+  --es-space-6: 1.5rem;
+  --es-space-8: 2rem;
+  --es-radius: 0.5rem;
+  --es-line: 1.6;
+  --es-measure: 72ch;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --es-color-bg: #0b0f17;
+    --es-color-fg: #e5e7eb;
+    --es-color-muted: #9ca3af;
+    --es-color-border: #1f2937;
+    --es-color-surface: #111827;
+    --es-color-link: #60a5fa;
+    --es-color-passed: #4ade80;
+    --es-color-failed: #f87171;
+    --es-color-skipped: #6b7280;
+    --es-color-pending: #fbbf24;
+    --es-color-passed-bg: rgba(74, 222, 128, 0.08);
+    --es-color-failed-bg: rgba(248, 113, 113, 0.08);
+    --es-color-skipped-bg: rgba(107, 114, 128, 0.08);
+    --es-color-pending-bg: rgba(251, 191, 36, 0.08);
+  }
+}
+
+[data-theme="dark"] {
+  --es-color-bg: #0b0f17;
+  --es-color-fg: #e5e7eb;
+  --es-color-muted: #9ca3af;
+  --es-color-border: #1f2937;
+  --es-color-surface: #111827;
+  --es-color-link: #60a5fa;
+  --es-color-passed: #4ade80;
+  --es-color-failed: #f87171;
+  --es-color-skipped: #6b7280;
+  --es-color-pending: #fbbf24;
+  --es-color-passed-bg: rgba(74, 222, 128, 0.08);
+  --es-color-failed-bg: rgba(248, 113, 113, 0.08);
+  --es-color-skipped-bg: rgba(107, 114, 128, 0.08);
+  --es-color-pending-bg: rgba(251, 191, 36, 0.08);
+}
+`.trim();
+var ES_THEME_TOKEN_VALUES = {
+  light: {
+    "--es-color-bg": "#ffffff",
+    "--es-color-fg": "#111827",
+    "--es-color-muted": "#6b7280",
+    "--es-color-border": "#e5e7eb",
+    "--es-color-surface": "#f9fafb",
+    "--es-color-link": "#2563eb",
+    "--es-color-passed": "#16a34a",
+    "--es-color-failed": "#dc2626",
+    "--es-color-skipped": "#9ca3af",
+    "--es-color-pending": "#d97706"
+  },
+  dark: {
+    "--es-color-bg": "#0b0f17",
+    "--es-color-fg": "#e5e7eb",
+    "--es-color-muted": "#9ca3af",
+    "--es-color-border": "#1f2937",
+    "--es-color-surface": "#111827",
+    "--es-color-link": "#60a5fa",
+    "--es-color-passed": "#4ade80",
+    "--es-color-failed": "#f87171",
+    "--es-color-skipped": "#6b7280",
+    "--es-color-pending": "#fbbf24"
+  }
+};
+
 // src/formatters/html/styles.ts
 var CSS_STYLES = `
 /* ============================================================================
@@ -1496,6 +1997,14 @@ var CSS_STYLES = `
    ============================================================================ */
 @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');
 
+/* ============================================================================
+   executable-stories canonical tokens (--es-*).
+   Shared with executable-stories-react. Override on :root or any ancestor of
+   the report to re-color both the standalone HTML and the React component.
+   ============================================================================ */
+${ES_THEME_TOKENS_CSS}
+
+
 /* ============================================================================
    CSS Custom Properties - Light Mode (Default)
    Cucumber-branded shadcn/ui base theme
@@ -3384,6 +3893,33 @@ body {
   color: var(--primary);
 }
 
+.copy-prompt-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 1.5rem;
+  height: 1.5rem;
+  border: none;
+  background: none;
+  color: var(--muted-foreground);
+  cursor: pointer;
+  opacity: 0.6;
+  transition: opacity 0.15s ease, transform 0.15s ease;
+  font-size: 0.95rem;
+  padding: 0;
+  flex-shrink: 0;
+}
+
+.scenario-header:hover .copy-prompt-btn,
+.copy-prompt-btn:focus-visible {
+  opacity: 1;
+}
+
+.copy-prompt-btn:hover {
+  color: var(--primary);
+  transform: scale(1.15);
+}
+
 /* ============================================================================
    Keyboard Navigation
    ============================================================================ */
@@ -3621,6 +4157,82 @@ a.toc-title:hover {
   outline-offset: 2px;
 }
 
+/* ============================================================================
+   Mobile responsive refinements
+   ============================================================================ */
+@media (max-width: 640px) {
+  .container {
+    padding: 0.875rem;
+  }
+
+  .header {
+    flex-direction: column;
+    align-items: stretch;
+    gap: 0.75rem;
+  }
+
+  .header-actions {
+    flex-wrap: wrap;
+    gap: 0.5rem;
+  }
+
+  .search-input {
+    width: 100%;
+    flex: 1 1 100%;
+    min-width: 0;
+  }
+
+  .header h1 {
+    font-size: 1.25rem;
+  }
+
+  .scenario-header,
+  .feature-header {
+    flex-wrap: wrap;
+    gap: 0.5rem;
+  }
+
+  .scenario-meta {
+    flex-wrap: wrap;
+  }
+
+  .scenario-actions {
+    flex-wrap: wrap;
+  }
+
+  /* Always-visible action buttons on touch (no hover) */
+  .copy-scenario-btn,
+  .copy-prompt-btn,
+  .permalink-anchor {
+    opacity: 1 !important;
+  }
+
+  .summary-card {
+    padding: 0.75rem 0.875rem;
+  }
+
+  .summary-card .value {
+    font-size: 1.5rem;
+  }
+
+  .tag-bar {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+
+  .shortcuts-overlay {
+    padding: 1rem;
+  }
+}
+
+@media (hover: none) and (pointer: coarse) {
+  .copy-scenario-btn,
+  .copy-prompt-btn,
+  .permalink-anchor {
+    opacity: 1;
+  }
+}
+
 `;
 
 // src/formatters/html/themes/default.ts
@@ -13347,6 +13959,7 @@ function renderScenario(args, deps) {
     </div>
     <div class="scenario-actions">
       <button class="copy-scenario-btn" onclick="copyScenarioAsMarkdown('scenario-${tc.id}')" aria-label="Copy scenario as markdown" title="Copy as Markdown"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg></button>
+      ${tc.status === "failed" ? `<button class="copy-prompt-btn" onclick="copyScenarioAsPrompt('scenario-${tc.id}')" aria-label="Copy as Claude prompt" title="Copy as AI prompt">\u2728</button>` : ""}
       <button class="permalink-anchor" onclick="copyPermalink('scenario-${tc.id}')" aria-label="Copy link to scenario" title="Copy link">#</button>
       <span class="scenario-duration">${duration}</span>
     </div>
@@ -13746,7 +14359,7 @@ var SCREENSHOT_MIME_BY_EXT = {
 };
 function readScreenshotAsDataUri(filePath) {
   try {
-    const ext = path2.extname(filePath).slice(1).toLowerCase();
+    const ext = path3.extname(filePath).slice(1).toLowerCase();
     const mime = SCREENSHOT_MIME_BY_EXT[ext];
     if (!mime) return void 0;
     if (!fs2.existsSync(filePath)) return void 0;
@@ -15223,8 +15836,8 @@ function extractDocAttachments(step) {
   }
   return attachments;
 }
-function guessMediaType(path9) {
-  const lower = path9.toLowerCase();
+function guessMediaType(path10) {
+  const lower = path10.toLowerCase();
   if (lower.endsWith(".png")) return "image/png";
   if (lower.endsWith(".jpg") || lower.endsWith(".jpeg")) return "image/jpeg";
   if (lower.endsWith(".gif")) return "image/gif";
@@ -16269,7 +16882,7 @@ function selectTestCases(args, deps) {
 
 // src/bundler/bundle-assets.ts
 import * as fs4 from "fs";
-import * as path4 from "path";
+import * as path5 from "path";
 
 // src/bundler/scan-html-assets.ts
 function scanHtmlAssets(html) {
@@ -16300,7 +16913,7 @@ function isLocalAssetRef(ref) {
 
 // src/bundler/copy-asset.ts
 import * as fs3 from "fs";
-import * as path3 from "path";
+import * as path4 from "path";
 import * as crypto from "crypto";
 function copyAsset(sourcePath, assetsDir) {
   if (!fs3.existsSync(assetsDir)) {
@@ -16308,10 +16921,10 @@ function copyAsset(sourcePath, assetsDir) {
   }
   const content = fs3.readFileSync(sourcePath);
   const hash = crypto.createHash("sha256").update(content).digest("hex").slice(0, 8);
-  const ext = path3.extname(sourcePath);
-  const baseName = sanitize(path3.basename(sourcePath, ext));
+  const ext = path4.extname(sourcePath);
+  const baseName = sanitize(path4.basename(sourcePath, ext));
   const destName = `${baseName}-${hash}${ext}`;
-  const destPath = path3.join(assetsDir, destName);
+  const destPath = path4.join(assetsDir, destName);
   if (!fs3.existsSync(destPath)) {
     fs3.copyFileSync(sourcePath, destPath);
   }
@@ -16323,14 +16936,14 @@ function sanitize(name) {
 
 // src/bundler/bundle-assets.ts
 function bundleAssets(htmlPath, options = {}) {
-  const htmlDir = path4.dirname(htmlPath);
-  const assetsDir = path4.join(htmlDir, "assets");
+  const htmlDir = path5.dirname(htmlPath);
+  const assetsDir = path5.join(htmlDir, "assets");
   let html = fs4.readFileSync(htmlPath, "utf8");
   const refs = scanHtmlAssets(html);
   let copiedCount = 0;
   const missing = [];
   for (const ref of refs) {
-    const absolutePath = path4.resolve(htmlDir, ref);
+    const absolutePath = path5.resolve(htmlDir, ref);
     if (!fs4.existsSync(absolutePath)) {
       missing.push(ref);
       continue;
@@ -16828,14 +17441,14 @@ function groupBy7(items, keyFn) {
 
 // src/formatters/astro-assets.ts
 import * as fs5 from "fs";
-import * as path5 from "path";
+import * as path6 from "path";
 var SKIP_PREFIXES = ["http://", "https://", "data:", "#"];
 function isLocalPath(src) {
   const trimmed = src.trim();
   if (SKIP_PREFIXES.some((prefix) => trimmed.startsWith(prefix))) {
     return false;
   }
-  return !path5.posix.isAbsolute(trimmed) && !path5.win32.isAbsolute(trimmed);
+  return !path6.posix.isAbsolute(trimmed) && !path6.win32.isAbsolute(trimmed);
 }
 function stripCodeContent(markdown) {
   let result = markdown.replace(/^[ \t]*(`{3,}|~{3,})[^\n]*\n[\s\S]*?^[ \t]*\1\s*$/gm, "");
@@ -16929,7 +17542,7 @@ function copyMarkdownAssets(options) {
   const pathMap = /* @__PURE__ */ new Map();
   const missing = [];
   for (const ref of refs) {
-    const absPath = path5.resolve(markdownDir, ref);
+    const absPath = path6.resolve(markdownDir, ref);
     if (!fs5.existsSync(absPath)) {
       if (!allowMissing) {
         throw new Error(`Asset not found: ${absPath}`);
@@ -17954,24 +18567,24 @@ function pickleStepArgumentToDocs(ps) {
 
 // src/utils/git-info.ts
 import * as fs6 from "fs";
-import * as path6 from "path";
+import * as path7 from "path";
 function readGitSha(cwd = process.cwd()) {
   const envSha = process.env.GITHUB_SHA || process.env.GIT_COMMIT || process.env.CI_COMMIT_SHA;
   if (envSha) return envSha;
   const gitDir = findGitDir(cwd);
   if (!gitDir) return void 0;
   try {
-    const headPath = path6.join(gitDir, "HEAD");
+    const headPath = path7.join(gitDir, "HEAD");
     const head = fs6.readFileSync(headPath, "utf8").trim();
     if (!head.startsWith("ref:")) {
       return head;
     }
     const refPath = head.replace("ref:", "").trim();
-    const refFile = path6.join(gitDir, refPath);
+    const refFile = path7.join(gitDir, refPath);
     if (fs6.existsSync(refFile)) {
       return fs6.readFileSync(refFile, "utf8").trim();
     }
-    const packedRefs = path6.join(gitDir, "packed-refs");
+    const packedRefs = path7.join(gitDir, "packed-refs");
     if (fs6.existsSync(packedRefs)) {
       const content = fs6.readFileSync(packedRefs, "utf8");
       for (const line of content.split("\n")) {
@@ -17988,19 +18601,19 @@ function readGitSha(cwd = process.cwd()) {
 function findGitDir(start) {
   let current = start;
   while (true) {
-    const candidate = path6.join(current, ".git");
+    const candidate = path7.join(current, ".git");
     if (fs6.existsSync(candidate)) {
       const stat = fs6.statSync(candidate);
       if (stat.isFile()) {
         const content = fs6.readFileSync(candidate, "utf8").trim();
         const match = content.match(/^gitdir: (.+)$/);
         if (match) {
-          return path6.resolve(current, match[1]);
+          return path7.resolve(current, match[1]);
         }
       }
       return candidate;
     }
-    const parent = path6.dirname(current);
+    const parent = path7.dirname(current);
     if (parent === current) return void 0;
     current = parent;
   }
@@ -18011,7 +18624,7 @@ function readBranchName(cwd = process.cwd()) {
   const gitDir = findGitDir(cwd);
   if (!gitDir) return void 0;
   try {
-    const headPath = path6.join(gitDir, "HEAD");
+    const headPath = path7.join(gitDir, "HEAD");
     const head = fs6.readFileSync(headPath, "utf8").trim();
     if (head.startsWith("ref:")) {
       const refPath = head.replace("ref:", "").trim();
@@ -18050,7 +18663,7 @@ function nanosecondsToMs(ns) {
 
 // src/utils/metadata.ts
 import * as fs7 from "fs";
-import * as path7 from "path";
+import * as path8 from "path";
 var versionCache = /* @__PURE__ */ new Map();
 function readPackageVersion(root) {
   if (versionCache.has(root)) {
@@ -18061,9 +18674,9 @@ function readPackageVersion(root) {
   return version;
 }
 function findPackageVersion(startDir) {
-  let current = path7.resolve(startDir);
+  let current = path8.resolve(startDir);
   while (true) {
-    const pkgPath = path7.join(current, "package.json");
+    const pkgPath = path8.join(current, "package.json");
     try {
       if (fs7.existsSync(pkgPath)) {
         const raw = fs7.readFileSync(pkgPath, "utf8");
@@ -18072,7 +18685,7 @@ function findPackageVersion(startDir) {
       }
     } catch {
     }
-    const parent = path7.dirname(current);
+    const parent = path8.dirname(current);
     if (parent === current) {
       return void 0;
     }
@@ -19030,7 +19643,8 @@ var FORMAT_EXTENSIONS = {
   junit: ".junit.xml",
   "cucumber-json": ".cucumber.json",
   "cucumber-messages": ".ndjson",
-  confluence: ".adf.json"
+  confluence: ".adf.json",
+  "story-report-json": ".story-report.json"
 };
 var TEST_EXTENSIONS = [
   ".test.ts",
@@ -19057,11 +19671,11 @@ function computeOutputPath(sourceFile, format, mode, colocatedStyle, baseOutputD
   const ext = FORMAT_EXTENSIONS[format];
   const effectiveName = outputName + (outputNameSuffix ?? "");
   if (mode === "aggregated") {
-    return toPosix(path8.join(baseOutputDir, `${effectiveName}${ext}`));
+    return toPosix(path9.join(baseOutputDir, `${effectiveName}${ext}`));
   }
   const normalizedSource = toPosix(sourceFile);
-  const dirOfSource = path8.posix.dirname(normalizedSource);
-  let baseName = path8.posix.basename(normalizedSource);
+  const dirOfSource = path9.posix.dirname(normalizedSource);
+  let baseName = path9.posix.basename(normalizedSource);
   for (const testExt of TEST_EXTENSIONS) {
     if (baseName.endsWith(testExt)) {
       baseName = baseName.slice(0, -testExt.length);
@@ -19070,9 +19684,9 @@ function computeOutputPath(sourceFile, format, mode, colocatedStyle, baseOutputD
   }
   const fileName = `${baseName}.${effectiveName}${ext}`;
   if (colocatedStyle === "adjacent") {
-    return toPosix(path8.posix.join(dirOfSource, fileName));
+    return toPosix(path9.posix.join(dirOfSource, fileName));
   }
-  return toPosix(path8.posix.join(baseOutputDir, dirOfSource, fileName));
+  return toPosix(path9.posix.join(baseOutputDir, dirOfSource, fileName));
 }
 function groupTestCasesByOutput(testCases, format, options, logger, outputNameSuffix) {
   const groups = /* @__PURE__ */ new Map();
@@ -19141,7 +19755,7 @@ var ReportGenerator = class {
       exclude: options.exclude ?? [],
       includeTags: options.includeTags ?? [],
       excludeTags: options.excludeTags ?? [],
-      formats: options.formats ?? ["cucumber-json"],
+      formats: options.formats ?? ["html"],
       outputDir: options.outputDir ?? "reports",
       outputName: options.outputName ?? "index",
       outputNameTimestamp: options.outputNameTimestamp ?? false,
@@ -19155,6 +19769,9 @@ var ReportGenerator = class {
       cucumberJson: {
         pretty: options.cucumberJson?.pretty ?? false
       },
+      storyReportJson: {
+        pretty: options.storyReportJson?.pretty ?? true
+      },
       cucumberMessages: {
         uriStrategy: options.cucumberMessages?.uriStrategy ?? "sourceFile",
         includeSynthetics: options.cucumberMessages?.includeSynthetics ?? true,
@@ -19270,8 +19887,8 @@ var ReportGenerator = class {
       if (astroPaths) {
         for (const mdPath of astroPaths) {
           const content = await fsPromises.readFile(mdPath, "utf8");
-          const mdDir = path8.dirname(mdPath);
-          const assetsDir = path8.resolve(this.options.astro.assetsDir);
+          const mdDir = path9.dirname(mdPath);
+          const assetsDir = path9.resolve(this.options.astro.assetsDir);
           const result = copyMarkdownAssets({
             markdown: content,
             markdownDir: mdDir,
@@ -19302,9 +19919,9 @@ var ReportGenerator = class {
     if (groups.size === 0 && this.options.output.mode === "aggregated") {
       const ext = FORMAT_EXTENSIONS[format];
       const effectiveName = this.options.outputName + (outputNameSuffix ?? "");
-      const outputPath = toPosix(path8.join(this.options.outputDir, `${effectiveName}${ext}`));
+      const outputPath = toPosix(path9.join(this.options.outputDir, `${effectiveName}${ext}`));
       const content = await this.formatContent(run, format);
-      const dir = path8.dirname(outputPath);
+      const dir = path9.dirname(outputPath);
       await fsPromises.mkdir(dir, { recursive: true });
       await this.deps.writeFile(outputPath, content);
       return [outputPath];
@@ -19316,7 +19933,7 @@ var ReportGenerator = class {
         testCases
       };
       const content = await this.formatContent(groupRun, format);
-      const dir = path8.dirname(outputPath);
+      const dir = path9.dirname(outputPath);
       await fsPromises.mkdir(dir, { recursive: true });
       await this.deps.writeFile(outputPath, content);
       writtenPaths.push(outputPath);
@@ -19423,6 +20040,12 @@ var ReportGenerator = class {
         });
         return formatter.format(run);
       }
+      case "story-report-json": {
+        const formatter = new StoryReportJsonFormatter({
+          pretty: this.options.storyReportJson.pretty
+        });
+        return formatter.format(run);
+      }
       default:
         throw new Error(`Unknown format: ${format}`);
     }
@@ -19439,7 +20062,7 @@ async function generateRunComparison(args) {
   await fsPromises.mkdir(outputDir, { recursive: true });
   for (const format of args.formats) {
     const ext = format === "html" ? ".html" : ".md";
-    const outputPath = toPosix(path8.join(outputDir, `${outputName}${ext}`));
+    const outputPath = toPosix(path9.join(outputDir, `${outputName}${ext}`));
     const content = format === "html" ? new RunDiffHtmlFormatter({ title: args.title }).format(diff) : new RunDiffMarkdownFormatter({ title: args.title }).format(diff);
     await fsPromises.writeFile(outputPath, content, "utf8");
     files.push(outputPath);
@@ -19464,6 +20087,8 @@ export {
   CucumberHtmlFormatter,
   CucumberJsonFormatter,
   CucumberMessagesFormatter,
+  ES_THEME_TOKENS_CSS,
+  ES_THEME_TOKEN_VALUES,
   HtmlFormatter,
   JUnitFormatter,
   MIN_FLAKINESS_SAMPLES,
@@ -19474,6 +20099,9 @@ export {
   RunDiffHtmlFormatter,
   RunDiffMarkdownFormatter,
   STORY_META_KEY,
+  STORY_REPORT_SCHEMA_MAJOR,
+  STORY_REPORT_SCHEMA_VERSION,
+  StoryReportJsonFormatter,
   adaptJestRun,
   adaptPlaywrightRun,
   adaptVitestRun,
@@ -19530,6 +20158,7 @@ export {
   stripAnsi,
   toCIInfo,
   toRawCIInfo,
+  toStoryReport,
   tryGetActiveOtelContext,
   updateHistory,
   validateCanonicalRun