Add browser evidence capture control

README.md

@@ -22,6 +22,8 @@ Direct app URL: https://mike0021-browser-speak.static.hf.space
 
 After benchmark or real-mic runs, use **Download JSON** to save the evidence file locally. The export includes the hosted Space commit when the static host exposes it, a concise evidence-readiness summary, and the raw benchmark rows. The Runtime panel also shows the served build.
 
+In the browser UI, **Run evidence capture** is the guided validation path. It captures a hardware WebGPU row when the browser exposes a real GPU adapter, runs the 3-row real-mic series, then leaves **Download JSON** enabled for saving the evidence file.
+
 From the source workspace, the one-command hosted evidence path is:
 
 ```bash
@@ -35,7 +37,7 @@ Known testing notes:
 - Use Chrome or another browser with WebGPU/WASM support and microphone permission enabled.
 - The app automatically falls back to WASM if hardware WebGPU is unavailable.
 - Initial load can be large because STT, LLM, TTS, and voice embeddings are all browser-side assets.
-- For validation evidence, run **Run benchmark suite**, **Run 3 real-mic series**, then **Download JSON**.
+- For validation evidence, run **Run evidence capture**, then **Download JSON**.
 - The Latency panel shows separate real-mic and hardware-WebGPU validation cards. On hardware browsers, **Run WebGPU evidence row** captures a fast row for the downloaded JSON.
 - The exported `hostMetadata.hfSpaceCommit` identifies the exact static Space revision served to the browser.
 - Hosted smoke validation passed on May 28, 2026: TTS, identity, and loopback rows completed with zero benchmark-phase network requests, zero benchmark errors, and zero server-inference suspects.

app.js

@@ -11,6 +11,7 @@ const elements = {
   loopbackButton: $("loopbackButton"),
   bargeInButton: $("bargeInButton"),
   gpuBenchmarkButton: $("gpuBenchmarkButton"),
+  evidenceCaptureButton: $("evidenceCaptureButton"),
   micBenchmarkButton: $("micBenchmarkButton"),
   micSeriesButton: $("micSeriesButton"),
   copyResultsButton: $("copyResultsButton"),
@@ -210,6 +211,7 @@ const state = {
   benchmarkTimeout: null,
   pendingPlaybackSchedules: 0,
   suiteRunning: false,
+  evidenceCaptureRunning: false,
   micSeries: {
     active: false,
     target: 3,
@@ -478,7 +480,7 @@ function setSessionControls(mode) {
 }
 
 function setBenchmarkControlsDisabled(disabled) {
-  const locked = disabled || state.micSeries.active;
+  const locked = disabled || state.micSeries.active || state.evidenceCaptureRunning;
   elements.suiteButton.disabled = locked;
   elements.benchmarkButton.disabled = locked;
   elements.chatBenchmarkButton.disabled = locked;
@@ -488,6 +490,7 @@ function setBenchmarkControlsDisabled(disabled) {
   elements.micBenchmarkButton.disabled = locked;
   elements.micSeriesButton.disabled = locked;
   updateGpuEvidenceButton();
+  updateEvidenceCaptureButton();
 }
 
 function resetMetrics() {
@@ -599,6 +602,7 @@ function updateGpuValidationStatus() {
   elements.gpuValidationDetail.textContent = detail;
   elements.gpuValidationProgressBar.style.width = `${Math.round(Math.max(0, Math.min(1, progress)) * 100)}%`;
   updateGpuEvidenceButton();
+  updateEvidenceCaptureButton();
 }
 
 function updateGpuEvidenceButton() {
@@ -607,6 +611,7 @@ function updateGpuEvidenceButton() {
   const busy =
     state.modelsLoading ||
     state.suiteRunning ||
+    state.evidenceCaptureRunning ||
     state.micSeries.active ||
     Boolean(state.activeBenchmark);
   const hardwareRows = evidenceSummaryForRows(state.benchmarkResults).hardwareWebgpu.hardwareRows ?? 0;
@@ -615,6 +620,30 @@ function updateGpuEvidenceButton() {
     hardwareRows > 0 ? "Run another WebGPU evidence row" : "Run WebGPU evidence row";
 }
 
+function updateEvidenceCaptureButton() {
+  if (!elements.evidenceCaptureButton) return;
+  const busy =
+    state.modelsLoading ||
+    state.suiteRunning ||
+    state.evidenceCaptureRunning ||
+    state.micSeries.active ||
+    Boolean(state.activeBenchmark);
+  elements.evidenceCaptureButton.disabled = busy;
+  elements.evidenceCaptureButton.textContent = state.evidenceCaptureRunning
+    ? "Capturing evidence..."
+    : "Run evidence capture";
+}
+
+function evidenceCaptureBusy() {
+  return (
+    state.activeBenchmark ||
+    state.suiteRunning ||
+    state.micSeries.active ||
+    state.modelsLoading ||
+    state.evidenceCaptureRunning
+  );
+}
+
 function resetTurnState() {
   state.messages = initialMessages();
   state.currentAssistant = "";
@@ -860,6 +889,7 @@ async function unloadModels({ quiet = false } = {}) {
   state.modelLoadStartedAt = null;
   state.loadedStack = null;
   state.suiteRunning = false;
+  state.evidenceCaptureRunning = false;
   resetTurnState();
   resetMetrics();
   resetConversationUi();
@@ -2023,6 +2053,7 @@ function interruptForBargeIn({ preserveLoopbackFeed = false, cancelTts = true, l
 
 function stopAll() {
   state.suiteRunning = false;
+  state.evidenceCaptureRunning = false;
   cancelMicSeries();
   interruptForBargeIn();
   cancelActiveBenchmark();
@@ -2370,6 +2401,81 @@ async function runHardwareWebGpuEvidenceBenchmark() {
   return runBenchmark();
 }
 
+async function runEvidenceCaptureSequence() {
+  if (evidenceCaptureBusy()) {
+    logEvent("Finish the current run before starting evidence capture.");
+    return false;
+  }
+  state.evidenceCaptureRunning = true;
+  setBenchmarkControlsDisabled(true);
+  logEvent("Starting evidence capture: hardware WebGPU row when available, then 3 real-mic rows.");
+  try {
+    await supportsWebGPU();
+    const hasHardwareWebGpu = state.webgpuAvailable === true && state.webgpuSoftwareAdapter !== true;
+    if (!state.modelsLoaded) {
+      if (hasHardwareWebGpu) {
+        applyHardwareWebGpuEvidenceStack();
+        logEvent("Hardware WebGPU available; loading the default WebGPU evidence stack.");
+      } else {
+        logEvent("Loading the selected stack for real-mic evidence capture.");
+      }
+      updateRuntimeStatus();
+      await loadModels({ ttsWarmup: false });
+      if (!state.modelsLoaded) throw new Error("Model load did not complete.");
+    }
+
+    const beforeGpuEvidence = evidenceSummaryForRows(state.benchmarkResults).hardwareWebgpu;
+    if (hasHardwareWebGpu && beforeGpuEvidence.hardwareRows === 0) {
+      if (currentBenchmarkStack().device === "webgpu") {
+        const previousCount = state.benchmarkResults.length;
+        const started = await runHardwareWebGpuEvidenceBenchmark();
+        if (!started) throw new Error("Hardware WebGPU evidence row did not start.");
+        await waitForBenchmarkRow(previousCount, "Hardware WebGPU evidence", {
+          timeoutMs: 150000,
+          isActive: () => state.evidenceCaptureRunning,
+        });
+      } else {
+        logEvent("Hardware WebGPU is available, but the loaded stack is not WebGPU; hardware evidence still needs a WebGPU row.");
+      }
+    } else if (!hasHardwareWebGpu) {
+      logEvent("Hardware WebGPU is not exposed; evidence capture will collect real-mic rows only.");
+    }
+
+    const realMicEvidence = evidenceSummaryForRows(state.benchmarkResults).realMic;
+    if (!realMicEvidence.passed) {
+      const started = await runMicSeriesBenchmark();
+      if (!started) throw new Error("Real-mic series did not start.");
+      await waitForAutomationCondition(
+        () => !state.micSeries.active && !state.activeBenchmark,
+        420000,
+        "Evidence real-mic series",
+      );
+    } else {
+      logEvent("Real-mic evidence is already complete.");
+    }
+
+    const evidence = evidenceSummaryForRows(state.benchmarkResults);
+    const missing = [];
+    if (!evidence.realMic.passed) missing.push("real mic");
+    if (!evidence.hardwareWebgpu.passed) missing.push("hardware WebGPU");
+    logEvent(
+      missing.length === 0
+        ? "Evidence capture complete; use Download JSON to save the proof."
+        : `Evidence capture finished; still missing ${missing.join(" and ")} evidence. Use Download JSON to save current rows.`,
+    );
+    return true;
+  } catch (error) {
+    if (state.micSeries.active) cancelMicSeries();
+    logEvent(`Evidence capture stopped: ${error.message}`);
+    return false;
+  } finally {
+    state.evidenceCaptureRunning = false;
+    if (state.modelsLoaded && !state.suiteRunning) setBenchmarkControlsDisabled(false);
+    updateEvidenceCaptureButton();
+    updateMicValidationStatus();
+  }
+}
+
 function applyHardwareWebGpuEvidenceStack() {
   elements.deviceSelect.value = HARDWARE_WEBGPU_EVIDENCE_STACK.device;
   elements.llmModelSelect.value = HARDWARE_WEBGPU_EVIDENCE_STACK.llm;
@@ -2467,7 +2573,11 @@ async function runSuiteStep(label, runner) {
   await waitForBenchmarkRow(previousCount, label);
 }
 
-function waitForBenchmarkRow(previousCount, label) {
+function waitForBenchmarkRow(
+  previousCount,
+  label,
+  { timeoutMs = 135000, isActive = () => state.suiteRunning } = {},
+) {
   return new Promise((resolve, reject) => {
     const startedAt = performance.now();
     const timer = window.setInterval(() => {
@@ -2476,12 +2586,12 @@ function waitForBenchmarkRow(previousCount, label) {
         resolve();
         return;
       }
-      if (!state.suiteRunning) {
+      if (!isActive()) {
         window.clearInterval(timer);
         reject(new Error(`${label} benchmark was cancelled.`));
         return;
       }
-      if (performance.now() - startedAt > 135000) {
+      if (performance.now() - startedAt > timeoutMs) {
         window.clearInterval(timer);
         reject(new Error(`${label} benchmark did not finish.`));
       }
@@ -2547,6 +2657,7 @@ function automationSnapshot() {
     },
     activeBenchmark: state.activeBenchmark ? { ...state.activeBenchmark } : null,
     suiteRunning: state.suiteRunning,
+    evidenceCaptureRunning: state.evidenceCaptureRunning,
     micSeries: { ...state.micSeries, timer: Boolean(state.micSeries.timer) },
     ttsChunking: { ...state.ttsChunking },
     stack: state.loadedStack ? currentBenchmarkStack() : null,
@@ -2771,6 +2882,11 @@ function installAutomationApi() {
     runLoopback: (options) => runSingleAutomationBenchmark(runLoopbackBenchmark, options),
     runBargeIn: (options) => runSingleAutomationBenchmark(runBargeInBenchmark, options),
     runWebGpuEvidence: (options) => runSingleAutomationBenchmark(runHardwareWebGpuEvidenceBenchmark, options),
+    async runEvidenceCapture() {
+      const started = await runEvidenceCaptureSequence();
+      if (!started) throw new Error("Evidence capture did not start.");
+      return automationSnapshot();
+    },
     runMic: (options) => runSingleAutomationBenchmark(runMicBenchmark, options),
     runMicSeries: runAutomationMicSeries,
     synthesizeAudio: synthesizeAutomationAudio,
@@ -2818,6 +2934,9 @@ elements.bargeInButton.addEventListener("click", runBargeInBenchmark);
 elements.gpuBenchmarkButton.addEventListener("click", () => {
   runHardwareWebGpuEvidenceBenchmark().catch((error) => logEvent(`WebGPU evidence failed: ${error.message}`));
 });
+elements.evidenceCaptureButton.addEventListener("click", () => {
+  runEvidenceCaptureSequence().catch((error) => logEvent(`Evidence capture failed: ${error.message}`));
+});
 elements.micBenchmarkButton.addEventListener("click", runMicBenchmark);
 elements.micSeriesButton.addEventListener("click", runMicSeriesBenchmark);
 elements.copyResultsButton.addEventListener("click", () => {

index.html

@@ -191,6 +191,7 @@
             <button id="loopbackButton" type="button" disabled>Run voice loopback</button>
             <button id="bargeInButton" type="button" disabled>Run barge-in check</button>
             <button id="gpuBenchmarkButton" type="button" disabled>Run WebGPU evidence row</button>
+            <button id="evidenceCaptureButton" type="button" disabled>Run evidence capture</button>
             <button id="micBenchmarkButton" type="button" disabled>Benchmark real mic</button>
             <button id="micSeriesButton" type="button" disabled>Run 3 real-mic series</button>
           </section>

styles.css

@@ -427,6 +427,7 @@ h2 {
 #loopbackButton,
 #bargeInButton,
 #gpuBenchmarkButton,
+#evidenceCaptureButton,
 #micBenchmarkButton,
 #micSeriesButton {
   width: 100%;
@@ -438,6 +439,7 @@ h2 {
 #loopbackButton,
 #bargeInButton,
 #gpuBenchmarkButton,
+#evidenceCaptureButton,
 #micBenchmarkButton,
 #micSeriesButton {
   margin-top: 8px;