fix: enforce canonical preview boundaries

Author: chubes4

package.json

@@ -178,7 +178,7 @@
     "test:native-agent-task-interruption": "node tests/execute-native-agent-task-interruption.test.mjs",
     "test:native-agent-task-playground-e2e": "tsx tests/execute-native-agent-task-playground-e2e.test.ts",
     "test:bench-command-step-behavior": "tsx tests/bench-command-step-behavior.test.ts",
-    "test:generic-primitives": "npm run test:artifact-path-primitives && npm run test:browser-callback-materialization-contracts && npm run test:source-package-compiler-primitives && npm run test:bench-command-step-behavior && npm run test:generic-ability-runtime-run",
+    "test:generic-primitives": "npm run test:artifact-path-primitives && npm run test:browser-callback-materialization-contracts && npm run test:browser-canonical-preview-origin && npm run test:source-package-compiler-primitives && npm run test:bench-command-step-behavior && npm run test:generic-ability-runtime-run",
     "test:browser-artifact-session": "tsx tests/browser-artifact-session.test.ts",
     "test:browser-environment-matrix": "tsx --test tests/browser-environment-matrix.test.ts tests/browser-environment-matrix.browser.test.ts",
     "test:browser-diagnostic-providers": "tsx tests/browser-diagnostic-providers.test.ts",

packages/runtime-playground/src/browser-actions-runner.ts

@@ -12,7 +12,7 @@ import { browserAssertionsSummary, browserStepRecord, executeBrowserInteractionS
 import { browserCommandLivenessPolicy, isBrowserCommandLivenessError, withBrowserCommandLiveness } from "./browser-liveness.js"
 import { serializeBrowserError } from "./browser-metrics.js"
 import { executeBrowserObservationAssertion } from "./browser-observation-assertions.js"
-import { browserPreviewNetworkPolicyIsActive, browserPreviewNetworkPolicySummary, browserPreviewNeedsContextRouting, browserPreviewTopology, resolveBrowserPreviewUrl, routeBrowserPreviewContextNetwork } from "./browser-preview-routing.js"
+import { browserPreviewNetworkPolicyIsActive, browserPreviewNetworkPolicySummary, browserPreviewNeedsContextRouting, browserPreviewReadinessError, browserPreviewTopology, resolveBrowserPreviewUrl, routeBrowserPreviewContextNetwork } from "./browser-preview-routing.js"
 import { BROWSER_PROBE_STATE_INIT_SCRIPT, browserProbeReplayability, browserProbeViewport } from "./browser-probe.js"
 import { runBrowserProbeCommand, type BrowserProbeRunPlan } from "./browser-probe-runner.js"
 import { browserActionTargetUrls, browserAuthRequest, browserProbeWaterfallArtifact, browserProbeWebSocketArtifact, browserProbeWebSocketSummary, browserRedirectDiagnosticsArtifact, browserRequestCoverageArtifact, browserStorageStateAuthSummary, browserStorageStateImportFromArgs, browserWordPressDiagnosticsArtifact, createBrowserProbeProgressTracker, fileSha256, installBrowserWordPressDiagnostics, installWordPressAdminAuthCookies, livenessRemainingWallTimeMs, normalizeBrowserProbeScriptCheckpoint, type BrowserCommandProgressEvent, type BrowserStorageStateImport } from "./browser-probe-support.js"
@@ -144,6 +144,10 @@ export async function runBrowserActionsCommand({
   let adaptiveExplorationSummary: BrowserArtifact["summary"]["adaptiveExploration"] | undefined
 
   try {
+    const previewReadinessError = browserPreviewReadinessError(preview)
+    if (previewReadinessError) {
+      throw previewReadinessError
+    }
     const context = browserPreviewNeedsContextRouting(networkPolicy) || !!storageStateImport ? await browser.newContext({
       ...topology.contextOptions(),
       ...(storageStateImport ? { storageState: storageStateImport.storageState } : {}),
@@ -410,6 +414,9 @@ export async function runBrowserActionsCommand({
         }
       }
     }
+  } catch (error) {
+    pendingError = error instanceof Error ? error : new Error(String(error))
+    errors.push(serializeBrowserError("probe-error", error))
   } finally {
     await settleBrowserNetworkTasks(networkTasks, livenessPolicy.networkSettleTimeoutMs)
     await browser.close()

packages/runtime-playground/src/browser-multi-actor-scenario-runner.ts

@@ -6,7 +6,7 @@ import { BrowserCommandArtifactError } from "./browser-command-artifact-error.js
 import { attachBrowserCaptureListeners, launchChromiumBrowser, settleBrowserNetworkTasks } from "./browser-capture-session.js"
 import { executeBrowserInteractionStep } from "./browser-interactions.js"
 import { browserProbeReplayability } from "./browser-probe.js"
-import { browserPreviewTopology, routeBrowserPreviewContextNetwork } from "./browser-preview-routing.js"
+import { browserPreviewReadinessError, browserPreviewTopology, routeBrowserPreviewContextNetwork } from "./browser-preview-routing.js"
 import { installWordPressAdminAuthCookies } from "./browser-probe-support.js"
 import { bootstrapPhpCode } from "./php-bootstrap.js"
 import { assertPlaygroundResponseOk, type PlaygroundRunResponse } from "./playground-command-errors.js"
@@ -36,6 +36,10 @@ export async function runBrowserMultiActorScenarioCommand(input: {
   let failure: Error | undefined
 
   try {
+    const previewReadinessError = browserPreviewReadinessError(topology.preview)
+    if (previewReadinessError) {
+      throw previewReadinessError
+    }
     const clientEntries: Array<[string, BrowserMultiActorClient]> = []
     const actorPages: Array<{ actor: string; page: Pick<Page, "goto"> }> = []
     // Playground PHP commands share one runtime endpoint, so provision identities

packages/runtime-playground/src/editor-command-runners.ts

@@ -550,6 +550,10 @@ export async function runEditorOpenCommand({
   let artifact: BrowserArtifact | undefined
 
   try {
+    const previewReadinessError = browserPreviewReadinessError(preview)
+    if (previewReadinessError) {
+      throw previewReadinessError
+    }
     const context = browserPreviewNeedsContextRouting(networkPolicy) ? await browser.newContext(topology.contextOptions()) : null
     if (context) {
       await routeBrowserPreviewContextNetwork(context, networkPolicy, topology.origins.localProxyOrigin)
@@ -626,6 +630,9 @@ export async function runEditorOpenCommand({
       })
       screenshotSha256 = await fileSha256(screenshotPath)
     }
+  } catch (error) {
+    pendingError = error instanceof Error ? error : new Error(String(error))
+    errors.push(serializeBrowserError("probe-error", error))
   } finally {
     await browser.close()
     if (capture.has("steps")) {
@@ -833,6 +840,10 @@ export async function runEditorActionsCommand({
   let artifact: BrowserArtifact | undefined
 
   try {
+    const previewReadinessError = browserPreviewReadinessError(preview)
+    if (previewReadinessError) {
+      throw previewReadinessError
+    }
     const context = browserPreviewNeedsContextRouting(networkPolicy) ? await browser.newContext(topology.contextOptions()) : null
     if (context) {
       await routeBrowserPreviewContextNetwork(context, networkPolicy, topology.origins.localProxyOrigin)
@@ -938,6 +949,9 @@ export async function runEditorActionsCommand({
       await artifactSession.writeGenerated("screenshot", "editor-action-screenshot.png", (path) => page.screenshot({ path, fullPage: true }).then(() => undefined))
       screenshotSha256 = await fileSha256(screenshotPath)
     }
+  } catch (error) {
+    pendingError = error instanceof Error ? error : new Error(String(error))
+    errors.push(serializeBrowserError("probe-error", error))
   } finally {
     await browser.close()
     if (capture.has("steps")) {
@@ -1931,6 +1945,10 @@ export async function runEditorValidateBlocksCommand({
   let artifact: BrowserArtifact | undefined
 
   try {
+    const previewReadinessError = browserPreviewReadinessError(preview)
+    if (previewReadinessError) {
+      throw previewReadinessError
+    }
     const context = browserPreviewNeedsContextRouting(networkPolicy) ? await browser.newContext(topology.contextOptions()) : null
     if (context) {
       await routeBrowserPreviewContextNetwork(context, networkPolicy, topology.origins.localProxyOrigin)

packages/runtime-playground/src/preview-server.ts

@@ -161,6 +161,7 @@ function createPreviewRouteRegistry(): InternalPreviewRouteRegistry {
 
 function proxyPreviewRequest(target: URL, incoming: IncomingMessage, outgoing: ServerResponse): Promise<void> {
   return new Promise((resolve) => {
+    const requestTarget = previewProxyRequestTarget(incoming)
     let settled = false
     let targetResponse: IncomingMessage | undefined
     const settle = () => {
@@ -182,12 +183,12 @@ function proxyPreviewRequest(target: URL, incoming: IncomingMessage, outgoing: S
         hostname: target.hostname,
         port: target.port,
         method: incoming.method,
-        path: previewProxyRequestPath(incoming.url),
-        headers: proxyRequestHeaders(incoming.headers),
+        path: requestTarget.path,
+        headers: proxyRequestHeaders(incoming.headers, requestTarget),
       },
       (response) => {
         targetResponse = response
-        outgoing.writeHead(response.statusCode ?? 502, response.statusMessage, proxyResponseHeaders(response.headers, incoming, target))
+        outgoing.writeHead(response.statusCode ?? 502, response.statusMessage, proxyResponseHeaders(response.headers, requestTarget, target))
         response.on("error", (error) => {
           outgoing.destroy(error)
           settle()
@@ -211,16 +212,31 @@ function proxyPreviewRequest(target: URL, incoming: IncomingMessage, outgoing: S
   })
 }
 
-function previewProxyRequestPath(rawUrl: string | undefined): string {
-  if (!rawUrl) {
-    return "/"
-  }
+interface PreviewProxyRequestTarget {
+  host: string
+  path: string
+  port: string
+  protocol: "http:" | "https:"
+}
+
+function previewProxyRequestTarget(incoming: IncomingMessage): PreviewProxyRequestTarget {
+  const rawUrl = incoming.url ?? "/"
   try {
     const url = new URL(rawUrl)
-    return `${url.pathname}${url.search}`
+    if (url.protocol === "http:" || url.protocol === "https:") {
+      return {
+        host: url.host,
+        path: `${url.pathname}${url.search}`,
+        port: url.port || (url.protocol === "https:" ? "443" : "80"),
+        protocol: url.protocol,
+      }
+    }
   } catch {
-    return rawUrl
+    // Origin-form requests use the proxy listener's HTTP authority.
   }
+  const host = incoming.headers.host ?? "localhost"
+  const authority = new URL(`http://${host}`)
+  return { host: authority.host, path: rawUrl, port: authority.port || "80", protocol: "http:" }
 }
 
 function createPreviewProxyQueue(): (task: () => Promise<void>) => Promise<void> {
@@ -279,28 +295,36 @@ function formatPreviewHost(host: string): string {
   return host.includes(":") && !host.startsWith("[") ? `[${host}]` : host
 }
 
-function proxyRequestHeaders(headers: IncomingHttpHeaders): IncomingHttpHeaders {
+function proxyRequestHeaders(headers: IncomingHttpHeaders, requestTarget: PreviewProxyRequestTarget): IncomingHttpHeaders {
   const forwarded = { ...headers }
   delete forwarded.connection
   delete forwarded["transfer-encoding"]
+  delete forwarded.forwarded
+  delete forwarded["x-forwarded-for"]
+  delete forwarded["x-forwarded-host"]
+  delete forwarded["x-forwarded-port"]
+  delete forwarded["x-forwarded-proto"]
 
   return {
     ...forwarded,
+    host: requestTarget.host,
+    "x-forwarded-host": requestTarget.host,
+    "x-forwarded-port": requestTarget.port,
+    "x-forwarded-proto": requestTarget.protocol.slice(0, -1),
   }
 }
 
-function proxyResponseHeaders(headers: IncomingHttpHeaders, incoming: IncomingMessage, target: URL): IncomingHttpHeaders {
+function proxyResponseHeaders(headers: IncomingHttpHeaders, requestTarget: PreviewProxyRequestTarget, target: URL): IncomingHttpHeaders {
   const forwarded = { ...headers }
   delete forwarded.connection
   delete forwarded["transfer-encoding"]
 
   if (typeof forwarded.location === "string") {
     try {
       const location = new URL(forwarded.location, target)
-      if (location.origin === target.origin && incoming.headers.host) {
-        const protocol = firstHeaderValue(incoming.headers["x-forwarded-proto"]) ?? "http"
-        location.protocol = `${protocol.replace(/:$/, "")}:`
-        const visible = new URL(`${location.protocol}//${incoming.headers.host}`)
+      if (location.origin === target.origin) {
+        location.protocol = requestTarget.protocol
+        const visible = new URL(`${requestTarget.protocol}//${requestTarget.host}`)
         location.hostname = visible.hostname
         location.port = visible.port
         forwarded.location = location.toString()
@@ -313,10 +337,6 @@ function proxyResponseHeaders(headers: IncomingHttpHeaders, incoming: IncomingMe
   return forwarded
 }
 
-function firstHeaderValue(value: string | string[] | undefined): string | undefined {
-  return Array.isArray(value) ? value[0] : value
-}
-
 function writeProxyError(outgoing: ServerResponse, error: Error): void {
   if (outgoing.headersSent) {
     outgoing.destroy(error)

tests/browser-callback-materialization-contracts.test.ts

@@ -21,7 +21,7 @@ import {
   trustedBrowserSessionOrigins,
   verifyBrowserCallbackSignature,
 } from "../packages/runtime-core/src/index.js"
-import { browserPreviewAuthCookieUrls, browserPreviewTopology } from "../packages/runtime-playground/src/browser-preview-routing.js"
+import { browserPreviewAuthCookieUrls, browserPreviewReadinessError, browserPreviewTopology } from "../packages/runtime-playground/src/browser-preview-routing.js"
 import { browserReviewSummary, type BrowserArtifact } from "../packages/runtime-playground/src/browser-artifacts.js"
 import { closeHttpServer, listenLocalHttpServer, withPreviewProxy, type PlaygroundCliServer } from "../packages/runtime-playground/src/preview-server.js"
 
@@ -185,6 +185,7 @@ assert.deepEqual(unsupportedCanonicalTopology.preview.diagnostics[0], {
   message: "The local Playground provider cannot preserve this declared canonical preview protocol.",
   details: { status: "inconclusive", canonicalOrigin: "https://secure.example.test", supportedProtocols: ["http:"] },
 })
+assert.match(browserPreviewReadinessError(unsupportedCanonicalTopology.preview)?.message ?? "", /cannot preserve/)
 
 let activeUpstreamRequests = 0
 let maxActiveUpstreamRequests = 0

tests/browser-canonical-preview-origin.test.ts

@@ -1,15 +1,23 @@
 import assert from "node:assert/strict"
 import { createServer } from "node:http"
 import { launchChromiumBrowser } from "../packages/runtime-playground/src/browser-capture-session.js"
-import { browserPreviewTopology, routeBrowserPreviewContextNetwork } from "../packages/runtime-playground/src/browser-preview-routing.js"
+import { browserPreviewNetworkPolicySummary, browserPreviewTopology, routeBrowserPreviewContextNetwork } from "../packages/runtime-playground/src/browser-preview-routing.js"
 import { closeHttpServer, listenLocalHttpServer, withPreviewProxy, type PlaygroundCliServer } from "../packages/runtime-playground/src/preview-server.js"
 
-const requests: Array<{ host?: string; method?: string; url?: string; body: string }> = []
+const requests: Array<{ host?: string; method?: string; url?: string; body: string; forwardedHost?: string; forwardedPort?: string; forwardedProto?: string }> = []
 const upstream = createServer((request, response) => {
   let body = ""
   request.on("data", (chunk) => { body += chunk.toString() })
   request.on("end", () => {
-    requests.push({ host: request.headers.host, method: request.method, url: request.url, body })
+    requests.push({
+      host: request.headers.host,
+      method: request.method,
+      url: request.url,
+      body,
+      forwardedHost: request.headers["x-forwarded-host"] as string | undefined,
+      forwardedPort: request.headers["x-forwarded-port"] as string | undefined,
+      forwardedProto: request.headers["x-forwarded-proto"] as string | undefined,
+    })
     if (request.url === "/events/redirect/") {
       response.writeHead(302, { location: "http://localhost/events/final/" })
       response.end()
@@ -21,7 +29,7 @@ const upstream = createServer((request, response) => {
       return
     }
     if (request.url === "/events/external-redirect/") {
-      response.writeHead(302, { location: "https://undeclared.example/escape/" })
+      response.writeHead(302, { location: "http://undeclared.example/escape/" })
       response.end()
       return
     }
@@ -52,12 +60,20 @@ const topology = browserPreviewTopology(
 const browser = await launchChromiumBrowser()
 
 try {
-  const context = await browser.newContext(topology.contextOptions())
+  const context = await browser.newContext({
+    ...topology.contextOptions(),
+    extraHTTPHeaders: {
+      "x-forwarded-host": "spoofed.example",
+      "x-forwarded-port": "443",
+      "x-forwarded-proto": "https",
+    },
+  })
   await routeBrowserPreviewContextNetwork(context, topology.networkPolicy, topology.origins.localProxyOrigin)
   const page = await context.newPage()
 
   await page.goto(topology.resolveUrl("/events/"), { waitUntil: "load" })
   assert.equal(new URL(page.url()).origin, "http://localhost")
+  assert(requests.some((request) => request.url === "/events/" && request.host === "localhost" && request.forwardedHost === "localhost" && request.forwardedPort === "80" && request.forwardedProto === "http"))
   assert.deepEqual(await page.evaluate(() => {
     history.pushState({}, "", "http://localhost/events/pushed/")
     history.replaceState({}, "", "http://localhost/events/replaced/")
@@ -87,8 +103,11 @@ try {
   await Promise.all([page.waitForURL("http://localhost/events/subsite/"), page.click("#subsite")])
   assert.equal(page.url(), "http://localhost/events/subsite/")
 
-  await assert.rejects(page.goto("https://undeclared.example/escape/"))
+  await assert.rejects(page.goto("http://undeclared.example/escape/"))
   await assert.rejects(page.goto("http://localhost/events/external-redirect/"))
+  const policyEvidence = browserPreviewNetworkPolicySummary(topology.networkPolicy)
+  assert((policyEvidence.hosts["undeclared.example"]?.blocked ?? 0) >= 1, JSON.stringify(policyEvidence))
+  assert(policyEvidence.blockedRequests >= 1)
 
   assert.deepEqual(topology.origins, {
     localPreviewOrigin: proxy.serverUrl,