Skip to content

Make nested composition data-playback-start also shift descendant media #3245

Closed

Description

@valeriangalliat

Problem

data-playback-start on a nested composition slot seeks the child GSAP timeline. Nested <video> / <audio> still play from local t=0 / their own data-media-start. Preview (startResolver) and render (parseSubCompositions) agree.

Docs treat a nested composition’s data-playback-start as which moment of the child GSAP timeline shows first, not as a trim of media inside that scene.

The gap: start-trimming a nested scene (NLE-style) does not move media inside it.

I'm not sure whether that split is the intentional contract, or whether a slot in-point should also shift descendant media.

➡️ I have code ready for this here (outline below) - happy to make a PR with this if that's a welcome addition.

Proposed solution

If a nested composition’s data-playback-start should also trim media inside that scene (NLE-style):

<div
  data-composition-id="scene"
  data-composition-src="compositions/scene.html"
  data-start="1"
  data-duration="2"
  data-playback-start="1.5"
></div>

A nested <video data-start="0"> would appear at t=1, playing from 1.5s into the file, not from the start of the file.

  • Descendant media is shifted by the slot offset (master = hostStart − playbackStart + local)
  • Clips that end entirely before that offset never appear
  • Clips that overlap it start at the slot and skip the overlap in the file
  • Same behavior in preview and in render extract
  • On the slot, data-media-start stays an alias of data-playback-start. On <video> / <audio>, data-media-start stays a source-file offset for that element only.

Alternatives considered

  • Leave as-is (GSAP only). Authors set data-media-start on each nested <video> / <audio>. Awkward for “trim this nested scene,” and wrong for media that is not at local t=0.
  • Rewrite child attributes when inlining so extract never sees a slot offset. Preview still has to apply hostStart − playbackStart, so the two paths can drift.
  • Docs only. Spell out that composition data-playback-start never applies to nested media. No code change.

Additional context

Repro (any clip.mp4 at least 4s):

<!-- index.html -->
<div data-composition-id="main" data-start="0" data-duration="4" data-width="1920" data-height="1080">
  <div
    data-composition-id="scene"
    data-composition-src="compositions/scene.html"
    data-start="1"
    data-duration="2"
    data-playback-start="1.5"
  ></div>
</div>
<!-- compositions/scene.html -->
<template id="scene-template">
  <div data-composition-id="scene" data-width="1920" data-height="1080">
    <video id="clip" src="clip.mp4" data-start="0" data-duration="4" muted></video>
  </div>
</template>

On current main (0.7.107): GSAP on scene starts 1.5s into that timeline; the <video> starts at the beginning of the file.

Studio preview, CLI preview, and render capture all use the same runtime seek for nested-comp GSAP, so that half is consistent. Nested media is also consistent: all paths ignore the slot’s data-playback-start.

Activity

  1. added
    triage/needs-designEvidence is adequate; desired behavior or scope needs a maintainer decision.
    difficulty/mediumBounded work requiring subsystem knowledge, related paths, or additional regression fixtures.
    and removed
    triage/needs-triageNeeds current-behavior, related-work, and scope evaluation.
    on Oct 10, 2026
  2. jrusso1020 commented on Oct 24, 2026

    @jrusso1020
    Collaborator

    Closing as implemented: nested composition data-playback-start now shifts descendant media in preview/timeline (#5413) and in render export (#5454).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    difficulty/mediumBounded work requiring subsystem knowledge, related paths, or additional regression fixtures.enhancementNew feature or requesttriage/needs-designEvidence is adequate; desired behavior or scope needs a maintainer decision.

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions