fix(preview): rewrite sub-composition asset urls in styles (#174)

mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-03 04:38:33 +00:00

## Summary
- rewrite CSS `url(...)` asset paths from sub-compositions before styles are hoisted into bundled/master preview output
- rewrite standalone sub-composition preview HTML so `src`/`href` paths keep resolving correctly under the preview root `<base>`
- add regression tests for bundled CSS asset rewriting and standalone sub-composition preview rewriting

## Root cause
Standalone composition previews reused the project `<head>` with a preview-root `<base href="/api/projects/:id/preview/">`, but the sub-composition body still contained `../...` asset references. Those escaped the preview route and 404ed. Separately, bundled preview already rewrote `<img src="../...">` paths but left hoisted CSS asset references like `@font-face src: url("../font.woff2")` untouched.

## Validation
- `pnpm --filter @hyperframes/core exec vitest run src/compiler/htmlBundler.test.ts src/studio-api/helpers/subComposition.test.ts`
- `pnpm --filter @hyperframes/core exec tsc --noEmit`
- `pnpm --filter @hyperframes/producer exec tsc --noEmit` *(blocked by pre-existing `packages/producer/src/services/deterministicFonts.ts` importing missing generated file `./fontData.generated.js` in the worktree install)*
- browser verification with `agent-browser` against the local preview server using `/Users/miguel07code/dev/test-hyperframes/heygen-promo`

## Browser proof
Verified the fixed preview routes in-browser after seeking to visible frames:
- standalone composition preview
- bundled master preview

This commit is contained in:

Miguel Ángel

2026-04-01 18:13:38 +02:00

committed by

GitHub

parent 1a5badc803

commit 1681350ac4

25 changed files with 1923 additions and 34 deletions

									
										packages/producer/package.json
									
		+1
		
												View File
												
				@@ -61,6 +61,7 @@

				    "@hyperframes/engine": "workspace:^",

				    "hono": "^4.6.0",

				    "linkedom": "^0.18.12",

				    "postcss": "^8.4.0",

				    "puppeteer": "^24.0.0",

				    "puppeteer-core": "^24.39.1"

				  },