beauticode-dsh 1.0.18 → 1.0.20

package/client.js

@@ -16,8 +16,10 @@
   const IMAGE_ATTEMPT_TIMEOUT_MS = 3_000;
   const IMAGE_MAX_ATTEMPTS = 2;
   const VIDEO_STARTUP_TIMEOUT_MS = CLIENT_APPLY_DEADLINE_MS;
+  const VIDEO_PROBE_TIMEOUT_MS = 2_000;
   const DSH_STRUCTURE_TIMEOUT_MS = CLIENT_APPLY_DEADLINE_MS;
   const FRAME_FALLBACK_MS = 120;
+  const VIDEO_FIRST_FRAME_PROGRESS_SEC = 0.03;
   const VIDEO_STABLE_FRAMES = 3;
   const VIDEO_STABLE_PROGRESS_SEC = 0.18;
   const CROSSFADE_MS = 180;
@@ -81,8 +83,11 @@ html[data-bc-fish="true"] #beauticode-bg-stage::after{background:transparent!imp
 #beauticode-bg-stage[data-bc-transitioning="true"] .beauticode-media-slot[data-bc-role="current"]{opacity:0}
 #beauticode-bg-stage[data-bc-transitioning="true"] .beauticode-media-slot[data-bc-role="candidate"]{opacity:1}
 #beauticode-bg-stage .beauticode-media-slot img,#beauticode-bg-stage .beauticode-media-slot video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;transition:opacity 120ms ease}
-#beauticode-bg-stage .beauticode-media-slot img{z-index:0;opacity:1}
-#beauticode-bg-stage .beauticode-media-slot video{z-index:1;opacity:0}
+#beauticode-bg-stage .beauticode-media-slot img{z-index:2;opacity:1}
+/* Keep cold candidate video paintable. Chromium may defer decoding media that
+   is nearly transparent, which deadlocks the first-frame gate. The poster
+   covers it until data-bc-video-ready is committed. */
+#beauticode-bg-stage .beauticode-media-slot video{z-index:1;opacity:1}
 #beauticode-bg-stage .beauticode-media-slot[data-bc-video-ready="true"] img{opacity:0}
 #beauticode-bg-stage .beauticode-media-slot[data-bc-video-ready="true"] video{opacity:1}
 @media (prefers-reduced-motion:reduce){#beauticode-bg-stage .beauticode-media-slot,#beauticode-bg-stage .beauticode-media-slot img,#beauticode-bg-stage .beauticode-media-slot video{transition:none!important}}
@@ -496,7 +501,65 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
     }
   }
 
-  function describeVideoState(video, phase) {
+  function safeOrigin(value) {
+    try {
+      return new URL(value, globalThis.location?.href).origin;
+    } catch {
+      return "unknown";
+    }
+  }
+
+  function videoRequestContext(url) {
+    return `页面Origin=${safeOrigin(globalThis.location?.href)}；媒体Origin=${safeOrigin(url)}；页面=${document.visibilityState || "unknown"}`;
+  }
+
+  async function probeVideoSource(url, signal, timeoutMs = VIDEO_PROBE_TIMEOUT_MS) {
+    throwIfAborted(signal);
+    const controller = new AbortController();
+    const parentAborted = () => controller.abort();
+    signal?.addEventListener?.("abort", parentAborted, { once: true });
+    let timedOut = false;
+    const timer = setTimeout(() => {
+      timedOut = true;
+      controller.abort();
+    }, Math.max(1, timeoutMs));
+    try {
+      const response = await fetch(url, {
+        method: "GET",
+        headers: { Range: "bytes=0-1" },
+        cache: "no-store",
+        credentials: "omit",
+        mode: "cors",
+        signal: controller.signal,
+      });
+      if (response.status !== 206) {
+        if (response.body) {
+          await response.body.cancel().catch(() => {});
+        }
+        throw new Error(`视频媒体 Range 探针返回 HTTP ${response.status}`);
+      }
+      const bytes = await response.arrayBuffer();
+      if (bytes.byteLength !== 2) {
+        throw new Error(`视频媒体 Range 探针返回 ${bytes.byteLength} 字节`);
+      }
+    } catch (error) {
+      if (signal?.aborted) throw abortError();
+      const context = videoRequestContext(url);
+      if (timedOut || isAbortError(error)) {
+        throw new Error(`视频媒体 Range 探针超时；${context}`);
+      }
+      const detail = error instanceof Error ? error.message : String(error);
+      if (error instanceof TypeError) {
+        throw new Error(`视频媒体不可达或被 CORS 拒绝；${context}；${detail}`);
+      }
+      throw new Error(`${detail}；${context}`);
+    } finally {
+      clearTimeout(timer);
+      signal?.removeEventListener?.("abort", parentAborted);
+    }
+  }
+
+  function describeVideoState(video, phase) {
     const mediaErrorNames = {
       1: "MEDIA_ERR_ABORTED",
       2: "MEDIA_ERR_NETWORK",
@@ -505,7 +568,8 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
     };
     const code = Number(video?.error?.code) || 0;
     const mediaError = code ? mediaErrorNames[code] || `MEDIA_ERR_${code}` : "none";
-    return `${phase}；mediaError=${mediaError}；readyState=${video?.readyState ?? -1}；networkState=${video?.networkState ?? -1}；paused=${Boolean(video?.paused)}`;
+    const src = video?.currentSrc || video?.src || "";
+    return `${phase}；mediaError=${mediaError}；readyState=${video?.readyState ?? -1}；networkState=${video?.networkState ?? -1}；paused=${Boolean(video?.paused)}；${videoRequestContext(src)}`;
   }
 
   function waitForVideo(video, signal, timeoutMs = VIDEO_STARTUP_TIMEOUT_MS) {
@@ -581,6 +645,89 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
     });
   }
 
+  function waitForPresentedFrame(video, signal, timeoutMs) {
+    return new Promise((resolve, reject) => {
+      const startedAt = performance.now();
+      const initialTime = Number.isFinite(video.currentTime) ? video.currentTime : 0;
+      let frameSeen = false;
+      let playingSeen =
+        !video.paused && video.readyState >= HTMLMediaElement.HAVE_CURRENT_DATA;
+      let settled = false;
+      let frameRequest = null;
+      const hasFrameCallback = typeof video.requestVideoFrameCallback === "function";
+
+      const cleanup = () => {
+        clearInterval(timer);
+        video.removeEventListener("playing", onPlaying);
+        video.removeEventListener("timeupdate", check);
+        video.removeEventListener("loadeddata", check);
+        video.removeEventListener("canplay", check);
+        video.removeEventListener("error", failed);
+        video.removeEventListener("abort", aborted);
+        signal?.removeEventListener?.("abort", aborted);
+        if (frameRequest != null && typeof video.cancelVideoFrameCallback === "function") {
+          video.cancelVideoFrameCallback(frameRequest);
+        }
+      };
+      const finish = (error) => {
+        if (settled) return;
+        settled = true;
+        cleanup();
+        if (error) reject(error);
+        else resolve();
+      };
+      const failed = () => {
+        finish(new Error(describeVideoState(video, "视频解码器报告失败")));
+      };
+      const aborted = () => {
+        finish(signal?.aborted ? abortError() : new Error(describeVideoState(video, "视频播放已中止")));
+      };
+      const check = () => {
+        if (settled) return;
+        if (video.error) {
+          failed();
+          return;
+        }
+        if (!video.paused && video.readyState >= HTMLMediaElement.HAVE_CURRENT_DATA) {
+          playingSeen = true;
+        }
+        const current = Number.isFinite(video.currentTime) ? video.currentTime : initialTime;
+        const progressed = current >= initialTime + VIDEO_FIRST_FRAME_PROGRESS_SEC;
+        if (
+          video.readyState >= HTMLMediaElement.HAVE_CURRENT_DATA &&
+          !video.paused &&
+          playingSeen &&
+          (frameSeen || progressed)
+        ) {
+          finish();
+          return;
+        }
+        if (performance.now() - startedAt >= timeoutMs) {
+          finish(new Error(describeVideoState(video, "视频未在首帧窗口内完成呈现")));
+        }
+      };
+      const onPlaying = () => {
+        playingSeen = true;
+        check();
+      };
+      const onFrame = () => {
+        frameSeen = true;
+        check();
+      };
+      const timer = setInterval(check, 80);
+      video.addEventListener("playing", onPlaying);
+      video.addEventListener("timeupdate", check);
+      video.addEventListener("loadeddata", check);
+      video.addEventListener("canplay", check);
+      video.addEventListener("error", failed, { once: true });
+      video.addEventListener("abort", aborted, { once: true });
+      signal?.addEventListener?.("abort", aborted, { once: true });
+      if (hasFrameCallback) frameRequest = video.requestVideoFrameCallback(onFrame);
+      if (signal?.aborted) aborted();
+      check();
+    });
+  }
+
   function waitForStablePlayback(video, signal, timeoutMs) {
     return new Promise((resolve, reject) => {
       const startedAt = performance.now();
@@ -839,8 +986,8 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
     if (!slot || slot !== mountedCurrentSlot() || slot.dataset.bcMedia !== payload.media) {
       return false;
     }
-    if (slot.dataset.bcImageUrl !== payload.imageUrl) return false;
     if (payload.media !== "video") {
+      if (slot.dataset.bcImageUrl !== payload.imageUrl) return false;
       const image = slot.querySelector?.("img");
       return Boolean(
         image?.isConnected === true &&
@@ -861,11 +1008,10 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
     ) {
       return false;
     }
-    const requestedStartAt = Number(payload.startAt);
-    const normalizedStartAt =
-      Number.isFinite(requestedStartAt) && requestedStartAt >= 0 ? requestedStartAt : 0;
-    const appliedStartAt = Number(slot.dataset.bcStartAt);
-    return Number.isFinite(appliedStartAt) && Math.abs(appliedStartAt - normalizedStartAt) < 0.25;
+    // A local re-import can keep the exact same video handle while producing a
+    // new poster token and resetting startAt. Reuse the live decoder; the
+    // caller updates the poster metadata and seeks in place when needed.
+    return true;
   }
 
   function updateCommittedDom(payload) {
@@ -1055,7 +1201,23 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
     let reusable = slotMatchesPayload(currentSlot, payload);
     if (reusable && payload.media === "video") {
       try {
-        await waitForStablePlayback(activeVideo(), signal, Math.min(750, remaining()));
+        const reusableVideo = activeVideo();
+        const requestedStartAt = Number(payload.startAt);
+        const normalizedStartAt =
+          Number.isFinite(requestedStartAt) && requestedStartAt >= 0 ? requestedStartAt : 0;
+        const appliedStartAt = Number(currentSlot.dataset.bcStartAt);
+        if (
+          !Number.isFinite(appliedStartAt) ||
+          Math.abs(appliedStartAt - normalizedStartAt) >= 0.25
+        ) {
+          const nextStartAt = seekVideo(reusableVideo, normalizedStartAt);
+          currentSlot.dataset.bcStartAt = String(nextStartAt);
+          await waitForSeek(reusableVideo, signal, remaining());
+          await waitForVideo(reusableVideo, signal, remaining());
+          await waitForPresentedFrame(reusableVideo, signal, remaining());
+        } else {
+          await waitForStablePlayback(reusableVideo, signal, Math.min(750, remaining()));
+        }
       } catch (error) {
         if (isAbortError(error) || signal?.aborted) throw error;
         reusable = false;
@@ -1064,6 +1226,8 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
     if (reusable) {
       committedPayload = payload;
       currentSlot.dataset.bcGeneration = String(payload.generation);
+      currentSlot.dataset.bcImageUrl = payload.imageUrl;
+      if (payload.videoUrl) currentSlot.dataset.bcVideoUrl = payload.videoUrl;
       updateCommittedDom(payload);
       syncGallery(payload);
       await acknowledgeRender(payload, true, true);
@@ -1106,11 +1270,20 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
       candidateVideo = video;
       video.src = payload.videoUrl;
       video.load();
+      // Start the real media request before the diagnostic Range probe. During
+      // a cold Chromium/decoder start, serial probing used part of the same
+      // eight-second budget without advancing the frame that users can see.
+      const sourceProbe = probeVideoSource(
+        payload.videoUrl,
+        signal,
+        Math.min(VIDEO_PROBE_TIMEOUT_MS, remaining()),
+      );
       const imageReady = loadImage(candidate, payload.imageUrl, signal, remaining());
       // play() is deliberately started alongside media readiness. Chromium is
       // allowed to ignore preload=auto for hidden/background media; waiting for
       // canplay before play() creates a circular stall at readyState=0.
       await Promise.all([
+        sourceProbe,
         imageReady,
         waitForVideo(video, signal, remaining()),
         startCandidatePlayback(video, signal, remaining()),
@@ -1120,7 +1293,10 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
       candidate.dataset.bcStartAt = String(appliedStartAt);
       await waitForSeek(video, signal, remaining());
       await waitForVideo(video, signal, remaining());
-      await waitForStablePlayback(video, signal, remaining());
+      // Transaction success means one frame was actually presented. Longer
+      // three-frame stability remains useful for reusing an existing slot, but
+      // must not turn a healthy cold decoder into a false first-frame failure.
+      await waitForPresentedFrame(video, signal, remaining());
       throwIfAborted(signal);
       candidate.dataset.bcVideoReady = "true";
       await commitCandidate(payload, candidate, signal, remaining);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "beauticode-dsh",
-  "version": "1.0.18",
+  "version": "1.0.20",
   "description": "Cordis plugin: image/video backgrounds for DeepSeek Harness web.",
   "type": "module",
   "main": "./index.mjs",

package/vendor/adapter-dsh/bridge.js

@@ -13,6 +13,18 @@ export function normalizeDshBaseUrl(value) {
     url.pathname = url.pathname.replace(/\/+$/, "") || "/";
     return url;
 }
+export function dshTrustedOrigins(value) {
+    const baseUrl = normalizeDshBaseUrl(String(value));
+    const port = baseUrl.port ? `:${baseUrl.port}` : "";
+    return [
+        ...new Set([
+            baseUrl.origin,
+            new URL(`http://127.0.0.1${port}`).origin,
+            new URL(`http://localhost${port}`).origin,
+            new URL(`http://[::1]${port}`).origin,
+        ]),
+    ];
+}
 function delay(ms) {
     return new Promise((resolve) => setTimeout(resolve, ms));
 }

package/vendor/adapter-dsh/index.js

@@ -1,4 +1,4 @@
-export { DshHostApplier, normalizeDshBaseUrl, } from "./bridge.js";
+export { DshHostApplier, dshTrustedOrigins, normalizeDshBaseUrl, } from "./bridge.js";
 export { DSH_HOST_DESCRIPTOR } from "./host-descriptor.js";
 export { DshSession } from "./session.js";
 export { DSH_BRIDGE_TOKEN_FILE, bridgeTokenPath, ensureBridgeToken, } from "./token.js";

package/vendor/adapter-dsh/session.js

@@ -1,7 +1,7 @@
 import path from "node:path";
 import { fileURLToPath } from "node:url";
 import { ApplyTransaction, BackgroundStore, MediaServerController, buildHostApplyPayload, defaultDataRoot, isLocalBackgroundSource, resolveSessionBundledThemes, resolveBackgroundImagePath, } from "../core/index.js";
-import { DshHostApplier, normalizeDshBaseUrl } from "./bridge.js";
+import { DshHostApplier, dshTrustedOrigins, normalizeDshBaseUrl } from "./bridge.js";
 import { DSH_HOST_DESCRIPTOR } from "./host-descriptor.js";
 import { acquireDshInjectorLock } from "./injector-lock.js";
 import { ensureBridgeToken } from "./token.js";
@@ -54,7 +54,7 @@ export class DshSession {
         });
         this.media = new MediaServerController({
             enabled: true,
-            trustedOrigins: [this.baseUrl.origin],
+            trustedOrigins: dshTrustedOrigins(this.baseUrl),
         });
         this.onError = opts.onError ?? null;
         this.onStatus = opts.onStatus ?? null;