diff --git a/src/marketing/blogPlugin.test.ts b/src/marketing/blogPlugin.test.ts index daafac97..c3caeb8c 100644 --- a/src/marketing/blogPlugin.test.ts +++ b/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 = [ - '', - '', - 'Watch the video', - 'Read the docs', - ].join('') + const html = [ + '', + '', + 'Watch the video', + 'Read the docs', + ].join('') - expect(makeBlogAssetUrlsMountSafe(html)).toBe( + it('uses the developers mount in production', () => { + expect(makeBlogAssetUrlsMountSafe(html, 'production')).toBe( [ - '', - '', - 'Watch the video', + '', + '', + 'Watch the video', + 'Read the docs', + ].join(''), + ) + }) + + it('uses root blog paths in previews', () => { + expect(makeBlogAssetUrlsMountSafe(html, 'preview')).toBe( + [ + '', + '', + 'Watch the video', 'Read the docs', ].join(''), ) diff --git a/src/marketing/blogPlugin.ts b/src/marketing/blogPlugin.ts index fae55990..1a8d952c 100644 --- a/src/marketing/blogPlugin.ts +++ b/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 +// 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']