fix: use production prefix for blog media

src/marketing/blogPlugin.test.ts

@@ -2,19 +2,30 @@ import { describe, expect, it } from 'vitest'
 import { makeBlogAssetUrlsMountSafe } from './blogPlugin'
 
 describe('makeBlogAssetUrlsMountSafe', () => {
-  it('keeps blog media under the current mount path', () => {
-    const html = [
-      '<img src="/blog/example.png">',
-      '<video><source src="/blog/example.mp4"></video>',
-      '<a href="/blog/example.mp4">Watch the video</a>',
-      '<a href="/docs">Read the docs</a>',
-    ].join('')
+  const html = [
+    '<img src="/blog/example.png">',
+    '<video><source src="/blog/example.mp4"></video>',
+    '<a href="/blog/example.mp4">Watch the video</a>',
+    '<a href="/docs">Read the docs</a>',
+  ].join('')
 
-    expect(makeBlogAssetUrlsMountSafe(html)).toBe(
+  it('uses the developers mount in production', () => {
+    expect(makeBlogAssetUrlsMountSafe(html, 'production')).toBe(
       [
-        '<img src="./example.png">',
-        '<video><source src="./example.mp4"></video>',
-        '<a href="./example.mp4">Watch the video</a>',
+        '<img src="/developers/blog/example.png">',
+        '<video><source src="/developers/blog/example.mp4"></video>',
+        '<a href="/developers/blog/example.mp4">Watch the video</a>',
+        '<a href="/docs">Read the docs</a>',
+      ].join(''),
+    )
+  })
+
+  it('uses root blog paths in previews', () => {
+    expect(makeBlogAssetUrlsMountSafe(html, 'preview')).toBe(
+      [
+        '<img src="/blog/example.png">',
+        '<video><source src="/blog/example.mp4"></video>',
+        '<a href="/blog/example.mp4">Watch the video</a>',
         '<a href="/docs">Read the docs</a>',
       ].join(''),
     )

src/marketing/blogPlugin.ts

@@ -45,9 +45,14 @@ function inlineSvgImages(html: string): string {
 }
 
 // Blog pages are mounted at /developers/blog in production and /blog in
-// previews. Relative media URLs preserve the active mount path in both places.
-export function makeBlogAssetUrlsMountSafe(html: string): string {
-  return html.replace(/(\b(?:src|href)=["'])\/blog\//g, '$1./')
+// previews. Use explicit paths because the marketing page's <base href="/">
+// makes relative media URLs resolve from the domain root.
+export function makeBlogAssetUrlsMountSafe(
+  html: string,
+  vercelEnv = process.env.VERCEL_ENV,
+): string {
+  const base = vercelEnv === 'production' ? '/developers/blog/' : '/blog/'
+  return html.replace(/(\b(?:src|href)=["'])\/blog\//g, `$1${base}`)
 }
 
 const CATEGORY_SLUGS = ['network-upgrades', 'events', 'technical', 'case-studies']