[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_189":190,"_191":192},"routes/_app.x.$handle.$name",{"_94":93,"_31":42,"_102":84,"_26":103,"_13":14,"_104":-5,"_11":105,"_106":107,"_108":109,"_110":111,"_112":113,"_20":-5,"_114":-5,"_115":-5,"_116":24,"_117":118,"_119":56,"_120":-5,"_121":-5,"_122":123},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_40":41,"_31":42,"_35":43,"_44":-5,"_45":24,"_46":47,"_48":47,"_49":50,"_51":-5,"_18":52,"_53":54,"_55":56,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":77,"_78":79,"_80":81,"_82":24},"version",7,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":-7,"_23":24,"_25":24,"_26":27,"_28":27},"file",{"_29":30,"_31":27,"_32":20,"_33":34,"_35":36,"_37":14,"_38":39,"_23":24},"previous","deleted",false,"deletedHere","path","vcr-plan.md","latestPath","fileId","73b1e19a-a11f-11f1-9183-1607ee4eb77e","name","fileType","content","# Turning request-capture into a VCR-style record/replay tool\n\n## The one thing that has to change\n\n`request-capture` today is **inbound** middleware. `withRequestLogging(handler)`\nsits at the server edge and snapshots requests *coming into* the val. There is no\nresponse in the blob because, at capture time, the handler hasn't run yet — so\nthere is nothing to \"replay\" in the VCR sense.\n\nVCR is **outbound**. A cassette records the requests *your code sends to an\nupstream service* **paired with the responses that service sends back**, then\nshort-circuits future outbound calls to return the stored response without\ntouching the network.\n\nSo this is not a feature to bolt on — it's a mirror-image tool. Different capture\nsite (outbound `fetch`, not the inbound handler), different payload (request +\nresponse, not request only), different injection point (the `fetch` your val\ncalls out with, not the handler it exports).\n\nRecommendation: build it as a **separate module** (`vcr.ts`) alongside the\nexisting inbound capture. Keep `request-capture` as-is — it's still the right tool\nfor reproducing production traffic against a dev deploy. Don't conflate the two.\n\n## 1. Move the capture point: wrap `fetch`, not the handler\n\nInstead of wrapping the exported handler, produce a `fetch`-compatible function\nthat the val injects wherever it calls out:\n\n```ts\nconst fetch = makeCassetteFetch(\"anthropic/messages\");\n// pass `fetch` into your SDK/client, or use it directly\nconst res = await fetch(\"https://api.anthropic.com/v1/messages\", { ... });\n```\n\nThe whole record/replay decision lives inside that wrapped `fetch`.\n\n## 2. Storage model: a cassette is a named collection of interactions\n\nToday: one blob per request, key `captures:`, shape\n`{ id, method, url, timestamp, headers, body? }`.\n\nVCR: one blob per **cassette**, key `cassettes:`, holding an ordered array\nof **interactions**, where an interaction is a matched request/response pair:\n\n```ts\ntype Interaction = {\n request: { method: string; url: string; headers: Record; body?: string };\n response: { status: number; headers: Record; body?: string };\n};\ntype Cassette = { name: string; version: 1; interactions: Interaction[] };\n```\n\nThat \"response paired to request\" is the piece the current capture is missing and\nthe reason replay isn't possible yet.\n\n## 3. The three pieces to build\n\n**a. Recording fetch (cassette absent).** Do the real `fetch`, read the response\nvia `res.clone()` so the caller still gets a live body, append the interaction to\nthe cassette, write the blob, return the real response.\n\n**b. Matcher (cassette present).** Given an outgoing request, find the first\n*unclaimed* interaction whose recorded request matches it. Define request identity\nexplicitly — start with `method + url`; add a canonicalized (key-sorted) JSON body\ncompare when the body is JSON. Mark each interaction claimed once consumed, so\nrepeated identical requests replay their responses **in recorded order** — that's\nwhat makes retries and polling deterministic. Make the matcher pluggable\n(`match?: (incoming, recorded) => boolean`) for volatile fields like timestamps or\nidempotency keys.\n\n**c. Replay / reconstruct (the actual \"replay\" you're missing).** On a match,\nbuild a real `Response` from the stored interaction and return it *without hitting\nthe network*:\n\n```ts\nreturn new Response(interaction.response.body, {\n status: interaction.response.status,\n headers: interaction.response.headers,\n});\n```\n\nThe calling code can't tell it wasn't live. That's the whole trick.\n\nMode is implied by cassette presence: no cassette → record; cassette → replay.\nAdd a CI guard: when `Deno.env.get(\"CI\")`, a missing cassette should **throw**\nrather than silently record (prevents CI making live calls).\n\n## 4. Redaction has to move to both sides — and not break matching\n\nCurrent redaction covers request headers only. Now:\n\n- Redact **response** bodies/headers too — upstream responses routinely contain\n tokens, signed URLs, PII.\n- Redaction runs on **record**. If you redact a field that's also used for\n matching, the matcher has to compare the *redacted* form on both sides, or\n exclude that field from identity. Easiest rule: never match on a redacted field.\n- Keep the existing \"scan before write, fail on unsafe cassette\" instinct — a\n committed cassette with a live key is worse than a broken test.\n\n## 5. What to keep unchanged\n\n- Blob storage as the backing store — fine. Cassettes are just bigger, fewer blobs.\n- `req.clone()` / `res.clone()` body discipline — same principle, now on both ends.\n- The redaction option surface — extend it, don't replace it.\n- `listCaptures` / `pruneCaptures` style helpers — mirror as\n `listCassettes` / `removeCassette`.\n\n## 6. Decisions you need to make\n\n- **Cassette granularity.** One cassette per test (VCR default, most reviewable\n diffs) vs one per upstream. Per-test is the better default.\n- **Refresh semantics.** effect-http-recorder deliberately has *no overwrite mode*\n — you delete the cassette and re-record, so the refresh is visible in the diff.\n Worth copying; it's a good constraint.\n- **Where `fetch` gets injected.** If your outbound calls go through an SDK that\n doesn't accept a custom `fetch`, you may need to monkeypatch `globalThis.fetch`\n for the duration of the test scope instead. Uglier, but sometimes the only hook.\n\n## 7. Limitations to accept up front\n\n- Bodies are **buffered** on record and replay, so this won't test streaming\n timing, cancellation, or backpressure. (Same limitation effect-http-recorder\n documents. Fine for provider integration tests.)\n- Binary response bodies need base64 encoding in the cassette; text stays readable.\n- This is a test-time tool. Nothing here belongs in a production request path.\n\n## Reference\n\nPrior art with the same model, worth reading before building: Ruby `vcr`,\nJS `nock` / `polly-js` / `msw`, and `anomalyco/effect-http-recorder` (Effect 4,\ngood cassette-format and matcher design — note it explicitly does **not** run on\nWorkers/Deno, so it's reference only, not a dependency).\n","createdAt",["D",1787729188223],"branchVersion","branchId","3183b296-5847-427a-9a53-e0c005bb1bde","id","e41edbfa-0909-43a5-bb51-c38cadbbeed2","request-capture",["D",1787033924484],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","HTTP middleware that snapshots requests to blob storage","imageUrl","5d1042a9-7b0b-499d-8a72-3a8ac7a4e185","pinnedFileId","aa3d4398-9acc-11f1-9e1b-1607ee4eb77e","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","5f80108f-7ca4-4327-b77b-089dbe4b5a82","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_94":93,"_101":97},"org",{"_94":93,"_95":-5,"_96":97,"_18":52,"_98":99,"_100":24},"branch",{"_13":83,"_31":84,"_40":39,"_85":41,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":42,"_92":93},"isOwned",9,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","nbbaier","handle","displayName","avatar","https://secure.gravatar.com/avatar/0129a541b7b3574e92c4afd06c5e32da&d=identicon","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_40":41,"_31":42,"_35":185,"_44":-5,"_45":24,"_46":47,"_48":47,"_49":50,"_51":-5,"_18":52,"_53":54,"_55":56,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":186,"_78":187,"_80":188,"_82":24},"tree",[168,169,170,171],"files",[168,169,170,171],"counts",{"_158":60,"_159":147,"_160":60,"_161":162,"_163":164},"contents",[124,125,126,127],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_40":151,"_31":152,"_29":153,"_129":-5,"_38":39,"_37":154,"_130":56,"_35":155,"_13":60,"_32":20,"_33":156,"_23":24,"_132":-5,"_26":157},{"_40":142,"_31":143,"_29":144,"_129":-5,"_38":39,"_37":145,"_130":56,"_35":146,"_13":147,"_32":148,"_33":149,"_23":24,"_132":-5,"_26":150},{"_40":134,"_31":135,"_29":54,"_129":-5,"_38":39,"_37":136,"_130":56,"_35":137,"_13":138,"_32":139,"_33":140,"_23":24,"_132":42,"_26":141},{"_40":128,"_31":27,"_29":30,"_129":-5,"_38":39,"_37":14,"_130":24,"_35":131,"_13":60,"_32":20,"_33":34,"_23":24,"_132":-5,"_26":133},"628a114b-cc96-4398-990d-bd7ee27295c0","parentId","latest",["D",1787729188223],"label",[27],"bd4a3c67-220f-4c4a-8734-c7e09e81e5d2","main.ts",5,["D",1787033943812],2,"http","/**\n * Demo HTTP endpoint wired up with withRequestLogging from ./lib.ts.\n *\n * Every request to this endpoint is snapshotted into val blob storage.\n * Visit /log (below) to read back what was captured.\n */\nimport {\n listCaptures,\n pruneCaptures,\n withRequestLogging,\n} from \"./lib.ts\";\n\nexport default withRequestLogging(async (req: Request) => {\n const url = new URL(req.url);\n\n if (url.pathname === \"/log\") {\n const cap = await listCaptures();\n return Response.json(cap);\n }\n\n if (url.pathname === \"/_prune\") {\n const removed = await pruneCaptures(30 * 24 * 60 * 60 * 1000); // >30 days old\n return Response.json({ removed });\n }\n\n return Response.json({\n ok: true,\n path: url.pathname,\n note: \"Request captured to blob storage. See /log to inspect.\",\n });\n}, {\n captureBody: true, // also snapshot request bodies (via clone) in this demo\n});\n",[135],"3167caee-add3-4b20-9e16-e7e9b94ac7c2","lib.ts","b0a8fe84-9acc-11f1-9ce8-1607ee4eb77e",3,["D",1787033937487],1,"script","/**\n * request-capture — HTTP request logging middleware for Val Town.\n *\n * Wrap any HTTP handler and every request it receives is snapshotted\n * into val-scoped blob storage as a serializable object:\n *\n * import { withRequestLogging } from \"https://esm.town/v/nbbaier/request-capture/lib.ts\";\n *\n * export default withRequestLogging(async (req: Request) => {\n * return Response.json({ ok: true, path: new URL(req.url).pathname });\n * });\n *\n * The captured record includes method, url, timestamp, an id, and headers\n * (sensitive ones redacted). The request body is NOT consumed by default so\n * the wrapped handler still gets to read it. Retrieval helpers below.\n */\n\nimport { blob } from \"https://esm.town/v/std/blob/main.ts\";\n\n/** The serializable record persisted per captured request. */\nexport interface CapturedRequest {\n /** Unique id for this capture, in `captures:` blob key form later. */\n id: string;\n method: string;\n url: string;\n /** Unix timestamp in milliseconds. */\n timestamp: number;\n /** ISO datetime string. */\n time: string;\n headers: Record;\n /**\n * The request body, captured iff `options.captureBody` is true.\n * Returns undefined when body wasn't captured (the default).\n */\n body?: string;\n}\n\n/** Headers that commonly hold secrets and are redacted by default. */\nconst SENSITIVE_HEADERS = new Set([\n \"authorization\",\n \"proxy-authorization\",\n \"cookie\",\n \"set-cookie\",\n \"x-api-key\",\n \"api-key\",\n \"x-val-town-user\",\n]);\n\nexport interface RequestLoggingOptions {\n /** Capture the request body? Requires cloning the request; default false. */\n captureBody?: boolean;\n /**\n * Callback invoked with the capture after it's persisted. Use for\n * additional fan-out (log lines, other stores). Errors here don't\n * break the wrapped handler.\n */\n onCaptured?: (capture: CapturedRequest) => Promise | void;\n /** Max body bytes to capture when captureBody is true (default 64 KB). */\n maxBodyBytes?: number;\n /** Key prefix for stored captures (default \"captures\"). */\n keyPrefix?: string;\n}\n\n/** Builds the blob key for a capture id. */\nfunction captureKey(prefix: string, id: string): string {\n return `${prefix}:${id}`;\n}\n\n/** Hash a raw header name to a stable, mostly-readable pseudo-name. */\nfunction redactHeader(name: string): string {\n return `${name}:redacted`;\n}\n\nexport function withRequestLogging(\n handler: (req: Request) => Response | Promise,\n options: RequestLoggingOptions = {},\n): (req: Request) => Promise {\n const {\n captureBody = false,\n maxBodyBytes = 64 * 1024,\n keyPrefix = \"captures\",\n } = options;\n\n return async (req: Request): Promise => {\n const id = crypto.randomUUID();\n const timestamp = Date.now();\n const now = new Date(timestamp);\n\n // Build the serializable snapshot.\n const headers: Record = {};\n req.headers.forEach((value, key) => {\n headers[SENSITIVE_HEADERS.has(key) ? redactHeader(key) : key] = value;\n });\n\n const capture: CapturedRequest = {\n id,\n method: req.method,\n url: req.url,\n timestamp,\n time: now.toISOString(),\n headers,\n };\n\n // Optionally consume the body from a clone, leaving the original intact\n // for the wrapped handler.\n if (captureBody) {\n try {\n const cloned = req.clone();\n const text = await cloned.text();\n capture.body = text.length > maxBodyBytes\n ? text.slice(0, maxBodyBytes)\n : text;\n } catch {\n // Body unreadable (e.g. a streaming body) — skip it, not fatal.\n }\n }\n\n // Serialize once and persist. Punting on the id for anything else to attach.\n await blob.setJSON(captureKey(keyPrefix, id), capture);\n\n if (options.onCaptured) {\n // Fan out without letting a failure affect the handler.\n Promise.resolve(options.onCaptured(capture)).catch((err) => {\n console.error(\"request-capture: onCaptured hook failed\", err);\n });\n }\n\n return handler(req);\n };\n}\n\n/** Read back a single captured request. */\nexport async function readRequest(id: string, prefix = \"captures\"): Promise {\n return await blob.getJSON(captureKey(prefix, id));\n}\n\n/** List all captured request blobs (optionally filtered), newest first. */\nexport async function listCaptures(prefix = \"captures\", limit = 100): Promise {\n const entries = (await blob.list(prefix + \":\")).sort((a, b) =>\n b.key.localeCompare(a.key)\n );\n const out: CapturedRequest[] = [];\n for (const { key } of entries.slice(0, limit)) {\n const cap = await blob.getJSON(key);\n if (cap) out.push(cap);\n }\n return out;\n}\n\n/** Remove captures older than the given age in milliseconds. Returns count removed. */\nexport async function pruneCaptures(olderThanMs: number, prefix = \"captures\"): Promise {\n const nowMs = Date.now();\n const cutoff = nowMs - olderThanMs;\n const entries = await blob.list(prefix + \":\");\n let removed = 0;\n for (const { key, lastModified } of entries) {\n if (new Date(lastModified).getTime() < cutoff) {\n await blob.delete(key);\n removed++;\n }\n }\n return removed;\n}\n",[143],"309161e6-4445-4ef4-8756-5b5733d43d57","README.md","bd30efb8-9acc-11f1-9134-1607ee4eb77e",6,["D",1787033956323],"# request-capture\n\nA drop-in HTTP middleware for Val Town that snapshots every incoming request into\nval-scoped **blob storage** as a serializable object, without disturbing the handler\nyou wrap.\n\n## Usage in your own HTTP val\n\nImport and wrap your handler:\n\n```ts\nimport { withRequestLogging } from \"https://esm.town/v/nbbaier/request-capture/lib.ts\";\n\nexport default withRequestLogging(async (req: Request) => {\n return Response.json({ ok: true });\n});\n```\n\nBy default each request is stored as a blob under `captures:` containing:\n\n```ts\n{\n id: string; // uuid\n method: string;\n url: string;\n timestamp: number; // ms\n time: string; // ISO\n headers: Record;\n body?: string; // only when captureBody is enabled\n}\n```\n\nSensitive headers (`authorization`, `cookie`, `set-cookie`, `x-api-key`, …) are\nredacted to `name:redacted` so secrets never land in storage.\n\n### Options\n\n```ts\nwithRequestLogging(handler, {\n captureBody: true, // snapshot the body via req.clone()\n maxBodyBytes: 64 * 1024, // cap body capture size\n keyPrefix: \"captures\", // blob key prefix\n onCaptured: (cap) => console.log(cap.url), // fan out (fire-and-forget)\n});\n```\n\nThe body is **not consumed** unless `captureBody` is set, so the wrapped handler can\nstill read it. Even with body capture, it reads a clone — the original stays intact.\n\n## Reading captures\n\n```ts\nimport { listCaptures, readRequest, pruneCaptures } from \"https://esm.town/v/nbbaier/request-capture/lib.ts\";\n\nconst all = await listCaptures(); // newest first, capped at `limit`\nconst one = await readRequest(id);\nconst removed = await pruneCaptures(7 * 24 * 60 * 60 * 1000); // delete old ones\n```\n\n## Demo\n\nThe live endpoint wraps its own handler and exposes two inspection routes:\n\n- `GET /log` — list every captured request\n- `GET /_prune` — delete captures older than 30 days\n",[152],"pulls","branches","forks","envVars",{"_165":60,"_167":60},"connections",{"_165":60,"_166":60},"count","unfilledCount","emptyCount",{"_40":151,"_31":152,"_29":153,"_129":-5,"_38":39,"_37":154,"_130":56,"_35":182,"_13":60,"_32":20,"_33":156,"_23":24,"_132":-5,"_173":183,"_26":184},{"_40":142,"_31":143,"_29":144,"_129":-5,"_38":39,"_37":145,"_130":56,"_35":179,"_13":147,"_32":148,"_33":149,"_23":24,"_132":-5,"_173":180,"_26":181},{"_40":134,"_31":135,"_29":54,"_129":-5,"_38":39,"_37":136,"_130":56,"_35":176,"_13":138,"_32":139,"_33":140,"_23":24,"_132":42,"_173":177,"_26":178},{"_40":128,"_31":27,"_29":30,"_129":-5,"_38":39,"_37":14,"_130":24,"_35":172,"_13":60,"_32":20,"_33":34,"_23":24,"_132":-5,"_173":174,"_26":175},["D",1787729188223],"children",[],[27],["D",1787033943812],[],[135],["D",1787033937487],[],[143],["D",1787033956323],[],[152],["D",1787033924484],{"_94":93,"_101":97},{"_94":93,"_95":-5,"_96":97,"_18":52,"_98":99,"_100":24},{"_13":83,"_31":84,"_40":39,"_85":41,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":42,"_92":93},"ctx",{"_76":-5,"_121":222,"_223":224,"_225":226,"_227":24,"_228":24,"_229":24,"_230":56,"_231":-5,"_232":-7,"_233":-7,"_234":60,"_235":24,"_236":24,"_237":-5,"_238":24,"_239":24,"_240":24,"_241":-5},"ENV",{"_193":194,"_195":196,"_197":84,"_198":199,"_200":201,"_202":203,"_204":205,"_206":207,"_208":209,"_210":211,"_212":213,"_214":215,"_216":217,"_218":219,"_220":221},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v7