executable-stories-react 0.2.0 → 0.2.1

package/dist/index.d.cts

@@ -223,6 +223,14 @@ declare function MermaidDiagram({ entry, load }: {
     load?: MermaidLoader;
 }): react.JSX.Element;
 
+/**
+ * A screenshot that's still an absolute local filesystem path by the time it
+ * reaches this component means the report's asset bundler couldn't find the
+ * file to inline/copy it (deleted, moved, or never captured — see
+ * inlineScreenshotIfPossible in executable-stories-playwright). `<img src>`
+ * would 404 against a path from the machine that generated the report, so
+ * show a placeholder instead of a broken image.
+ */
 declare function DocScreenshot({ entry }: {
     entry: ReportDocScreenshot;
 }): react.JSX.Element;
@@ -232,6 +240,10 @@ declare function DocScreenshot({ entry }: {
  * a URL or a path that resolves alongside the report. Both `path` and `poster`
  * are adapter-supplied, so they go through the same scheme allow-list as the
  * DocHtml iframe src (no `javascript:`/`data:` URLs reach the DOM).
+ *
+ * An absolute local filesystem path means the report's asset bundler
+ * couldn't find/copy the file — a `<video src>` pointed at a runner-local
+ * path would just fail to load, so show a placeholder instead.
  */
 declare function DocVideo({ entry }: {
     entry: ReportDocVideo;

package/dist/index.d.ts

@@ -223,6 +223,14 @@ declare function MermaidDiagram({ entry, load }: {
     load?: MermaidLoader;
 }): react.JSX.Element;
 
+/**
+ * A screenshot that's still an absolute local filesystem path by the time it
+ * reaches this component means the report's asset bundler couldn't find the
+ * file to inline/copy it (deleted, moved, or never captured — see
+ * inlineScreenshotIfPossible in executable-stories-playwright). `<img src>`
+ * would 404 against a path from the machine that generated the report, so
+ * show a placeholder instead of a broken image.
+ */
 declare function DocScreenshot({ entry }: {
     entry: ReportDocScreenshot;
 }): react.JSX.Element;
@@ -232,6 +240,10 @@ declare function DocScreenshot({ entry }: {
  * a URL or a path that resolves alongside the report. Both `path` and `poster`
  * are adapter-supplied, so they go through the same scheme allow-list as the
  * DocHtml iframe src (no `javascript:`/`data:` URLs reach the DOM).
+ *
+ * An absolute local filesystem path means the report's asset bundler
+ * couldn't find/copy the file — a `<video src>` pointed at a runner-local
+ * path would just fail to load, so show a placeholder instead.
  */
 declare function DocVideo({ entry }: {
     entry: ReportDocVideo;

package/dist/index.js

@@ -208,6 +208,15 @@ function safeUrl(value) {
   if (scheme && !/^https?$/i.test(scheme[1] ?? "")) return void 0;
   return trimmed;
 }
+function safeImageUrl(value) {
+  if (!value) return void 0;
+  const trimmed = value.trim();
+  if (/^data:image\//i.test(trimmed)) return trimmed;
+  return safeUrl(trimmed);
+}
+function isLocalFsPath(value) {
+  return /^(?:[/\\]|[A-Za-z]:[/\\])/.test(value);
+}
 
 // src/components/doc/DocSection.tsx
 import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
@@ -263,11 +272,19 @@ function DocMermaid({ entry }) {
 // src/components/doc/DocScreenshot.tsx
 import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
 function DocScreenshot({ entry }) {
+  const src = isLocalFsPath(entry.path) ? void 0 : safeImageUrl(entry.path);
+  if (!src) {
+    return /* @__PURE__ */ jsxs6("figure", { className: "my-3 rounded-md border border-dashed border-border p-3 text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsx10("div", { className: "font-medium", children: "Screenshot unavailable" }),
+      /* @__PURE__ */ jsx10("div", { className: "mt-1 break-all font-mono text-xs", children: entry.path }),
+      entry.alt ? /* @__PURE__ */ jsx10("figcaption", { className: "mt-1.5 text-xs", children: entry.alt }) : null
+    ] });
+  }
   return /* @__PURE__ */ jsxs6("figure", { className: "my-3", children: [
     /* @__PURE__ */ jsx10(
       "img",
       {
-        src: entry.path,
+        src,
         alt: entry.alt ?? "",
         loading: "lazy",
         className: "max-w-full rounded-md border border-border"
@@ -280,6 +297,13 @@ function DocScreenshot({ entry }) {
 // src/components/doc/DocVideo.tsx
 import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
 function DocVideo({ entry }) {
+  if (isLocalFsPath(entry.path)) {
+    return /* @__PURE__ */ jsxs7("figure", { className: "my-3 rounded-md border border-dashed border-border p-3 text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsx11("div", { className: "font-medium", children: "Video unavailable" }),
+      /* @__PURE__ */ jsx11("div", { className: "mt-1 break-all font-mono text-xs", children: entry.path }),
+      entry.caption ? /* @__PURE__ */ jsx11("figcaption", { className: "mt-1.5 text-xs", children: entry.caption }) : null
+    ] });
+  }
   const src = safeUrl(entry.path);
   const poster = safeUrl(entry.poster);
   return /* @__PURE__ */ jsxs7("figure", { className: "my-3", children: [