From 96764c8c1bf99059abb0eea916c2a66768ec81cb Mon Sep 17 00:00:00 2001
From: Dotta <bippadotta@protonmail.com>
Date: Mon, 10 Aug 2026 07:59:30 +0000
Subject: [PATCH] test(paperclip-runner): keep mockup captures in sync

Co-Authored-By: Paperclip <noreply@paperclip.ing>
---
 .../mockups/phase-7-issue-thread.test.mjs     | 34 +++++++++++++++++++
 1 file changed, 34 insertions(+)
 create mode 100644 packages/paperclip-runner/docs/design/mockups/phase-7-issue-thread.test.mjs

diff --git a/packages/paperclip-runner/docs/design/mockups/phase-7-issue-thread.test.mjs b/packages/paperclip-runner/docs/design/mockups/phase-7-issue-thread.test.mjs
new file mode 100644
index 00000000000..a876027e239
--- /dev/null
+++ b/packages/paperclip-runner/docs/design/mockups/phase-7-issue-thread.test.mjs
@@ -0,0 +1,34 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import test from "node:test";
+
+const mockupUrl = new URL("./phase-7-issue-thread.html", import.meta.url);
+const captureUrl = new URL("./capture-issue-thread-mockup.mjs", import.meta.url);
+
+test("the capture recipe covers implemented mockup states and contract viewports", async () => {
+  const [mockup, capture] = await Promise.all([
+    readFile(mockupUrl, "utf8"),
+    readFile(captureUrl, "utf8"),
+  ]);
+
+  const capturedStates = [
+    ...capture.matchAll(/\?state=([a-z-]+)/g),
+  ].map((match) => match[1]);
+
+  assert.deepEqual(
+    [...new Set(capturedStates)],
+    ["pending", "baseline", "resolved", "streaming", "replay"],
+  );
+  for (const state of capturedStates) {
+    if (state === "pending") {
+      assert.match(mockup, /id="pendingcard"/);
+      continue;
+    }
+    assert.match(mockup, new RegExp(`state === '${state}'`));
+  }
+
+  assert.match(capture, /desktop: \{ width: 1440, height: 900 \}/);
+  assert.match(capture, /mobile: \{ width: 390, height: 844 \}/);
+  assert.match(mockup, /data-thread-state="pending"/);
+  assert.match(mockup, /dataset\.threadState = 'settled'/);
+});