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']