@remotion/studio: Fix premounted timeline thumbnails

[samohovets]

Fixes #7356.

Summary

• Keep video film strip extraction and drawing scoped to the media portion of a timeline item, excluding premount and postmount overlay widths.
• Add a focused regression test for unchanged thumbnail dimensions when only premount width changes.

Testing

• bun run build
• bun test packages/studio/src/test/timeline-video-info.test.ts
• bun run formatting in packages/studio
• bun run lint in packages/studio (passes with existing warnings)
• Playwright verification in packages/example against premounted-remote: temporarily changed the first sequence premountFor from 20 to 110, confirmed the first film strip canvas hash stayed identical, then restored the example source.

premounted_remote_premount_stable.webm
Premount 20 timeline
Premount 110 timeline

Notes

• The local pre-commit hook currently fails with error: ENOENT while running bun run --filter ... format, so the commit was created with --no-verify after running the relevant checks manually.

_{To show artifacts inline, enable in settings.}

  

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
bugs	Ready	Preview, Comment	May 20, 2026 8:22pm
remotion	Ready	Preview, Comment	May 20, 2026 8:22pm

[pullfrog]

ℹ️ Fix is correct; surfacing one out-of-scope observation about audio-only sequences.

Reviewed changes — verified that the film strip and waveform inside TimelineVideoInfo now ignore the premount/postmount overlay portions of a timeline item, and that the canvas dimensions, frame extraction widths, and container offsets all stay consistent.

• Extract media-only widths via getTimelineVideoInfoWidths — clamps visualizationWidth and naturalWidth to the non-premount/postmount span and prevents negatives via Math.max(0, …).
• Filmstrip container now sized + offset to media region — width: mediaVisualizationWidth plus marginLeft: premountWidth aligns it with the audio waveform's existing offset.
• Canvas + frame extraction use mediaVisualizationWidth / mediaNaturalWidth — loopWidth, targetWidth, and the useEffect deps array all rewired consistently.
• Regression test in timeline-video-info.test.ts — asserts widths are invariant to premountWidth and never go negative.

ℹ️ Audio-only sequences likely have the same premount bleed

The fix here is scoped to TimelineVideoInfo, but TimelineSequence.tsx renders audio-only sequences via a bare <AudioWaveform visualizationWidth={width} /> (around line 213) where width already includes premountWidth + postmountWidth from getTimelineSequenceLayout, and there's no marginLeft: premountWidth wrapper.

By the same reasoning that drove this PR, an audio-only clip with a premountFor/postmountFor should have a stretched/misaligned waveform. The cleanest follow-up is to apply the same media-width + offset treatment there (or pull the offset wrapper one level up).

Technical details

# Audio-only sequences likely have the same premount bleed

## Affected sites
- `packages/studio/src/components/Timeline/TimelineSequence.tsx:212-222` — `s.type === 'audio'` branch renders `<AudioWaveform visualizationWidth={width} />` directly. `width` from `getTimelineSequenceLayout` already has `premountWidth + postmountWidth` folded in (see `packages/studio/src/helpers/get-timeline-sequence-layout.ts:111`), and there's no `marginLeft: premountWidth` container wrapping it.

## Required outcome
- An audio sequence with non-zero `premountFor` / `postmountFor` should render its waveform at the media-only width, offset by `premountWidth`, matching the behavior `TimelineVideoInfo` now has for video.

## Suggested approach (optional)
- Extract the offset+sizing pattern shared by `audioStyle` / `filmstripStyle` in `TimelineVideoInfo` into a small wrapper (or hoist it to `TimelineSequence`) so audio-only and video sequences both pick it up — the math is the same `getTimelineVideoInfoWidths` shape.

## Open questions for the human
- Is this worth doing in this PR, or should it land as a separate follow-up scoped to the audio path? The linked issue #7356 only shows the video case.

  ^{｜ Fix it ➔ ｜ View workflow run ｜ Using Claude Opus ｜ 𝕏}

[JonnyBurger]

@pullfrog make a new issue about audio

[pullfrog]

This run was cancelled 🛑

The workflow was cancelled before completion. Please check the link below for details.

  ^{｜ View workflow run ｜ via Pullfrog ｜ 𝕏}