diff --git a/packages/runtime-playground/src/browser-visual-compare.ts b/packages/runtime-playground/src/browser-visual-compare.ts index df9d3aa79..f09597349 100644 --- a/packages/runtime-playground/src/browser-visual-compare.ts +++ b/packages/runtime-playground/src/browser-visual-compare.ts @@ -414,6 +414,10 @@ function stringFileRef(value: unknown): string | undefined { return undefined } +export function visualCompareWordPressUrl(server: PlaygroundCliServer): string { + return server.wordpressUrl ?? server.serverUrl +} + export async function runVisualCompareCommand({ artifactRoot, runtimeSpec, @@ -496,7 +500,7 @@ async function runVisualComparePairCommand({ const candidatePath = artifactSession.absolutePath("candidate.png") const diffPath = artifactSession.absolutePath("diff.png") const startedAt = now() - const preview = browserPreviewRouting(args, runtimeSpec, server.serverUrl) + const preview = browserPreviewRouting(args, runtimeSpec, visualCompareWordPressUrl(server)) const sourceTargetUrl = sourceUrl ? resolveBrowserPreviewUrl(sourceUrl, preview.effectiveOrigin) : undefined const candidateTargetUrl = candidateUrl ? resolveBrowserPreviewUrl(candidateUrl, preview.effectiveOrigin) : undefined let finalSourceUrl = sourceTargetUrl @@ -844,7 +848,7 @@ function visualCompareMatrixArtifact( artifactType: "visual-compare", requestedUrl: expectedEntries.map((entry) => entry.name).join(","), url: firstArtifact?.url ?? "visual-compare-matrix", - preview: firstArtifact?.preview ?? browserPreviewRouting(args, runtimeSpec, server.serverUrl), + preview: firstArtifact?.preview ?? browserPreviewRouting(args, runtimeSpec, visualCompareWordPressUrl(server)), files: { summary: matrixSummary.files.summary, ...(matrixSummary.files.blocksEngineVisualParity ? { blocksEngineVisualParity: matrixSummary.files.blocksEngineVisualParity } : {}), @@ -1170,7 +1174,7 @@ async function writeVisualCompareMatrixSummary( blocksEngineVisualParity: "files/browser/visual-compare/blocks-engine-visual-parity-report.json", }, ...(!matrixComplete ? { - preview: entries[0]?.artifact.preview ?? browserPreviewRouting(args, runtimeSpec, server.serverUrl), + preview: entries[0]?.artifact.preview ?? browserPreviewRouting(args, runtimeSpec, visualCompareWordPressUrl(server)), limitations: ["visual compare matrix was interrupted or an expected input was missing before all comparisons completed; recovered comparisons contain complete per-entry evidence for finished viewports and structured diagnostics for incomplete entries"], } : {}), } diff --git a/tests/browser-visual-compare-contract.test.ts b/tests/browser-visual-compare-contract.test.ts index a77e82b37..dcee6a209 100644 --- a/tests/browser-visual-compare-contract.test.ts +++ b/tests/browser-visual-compare-contract.test.ts @@ -4,11 +4,13 @@ import { join } from "node:path" import { PNG } from "pngjs" import { commandRegistry } from "../packages/runtime-core/src/command-registry.js" -import { runVisualCompareCommand } from "../packages/runtime-playground/dist/browser-visual-compare.js" +import { runVisualCompareCommand, visualCompareWordPressUrl } from "../packages/runtime-playground/dist/browser-visual-compare.js" import { withTempDir } from "../scripts/test-kit.js" const visualCompare = commandRegistry.find((definition) => definition.id === "wordpress.visual-compare") assert.ok(visualCompare, "wordpress.visual-compare is registered") +assert.equal(visualCompareWordPressUrl({ serverUrl: "http://preview.test", wordpressUrl: "http://wordpress.test" } as never), "http://wordpress.test") +assert.equal(visualCompareWordPressUrl({ serverUrl: "http://preview.test" } as never), "http://preview.test") const acceptedArgs = visualCompare.acceptedArgs const maxElements = acceptedArgs.find((arg) => arg.name === "max-explanation-elements")