From 858b288f80aed64cb12b26a558eb803437b070ba Mon Sep 17 00:00:00 2001
From: Johannes Odland <johannes.odland@gmail.com>
Date: Thu, 4 Jan 2024 19:51:49 +0100
Subject: [PATCH] Update timeline and animations when children of source
 element are resized

---
 src/scroll-timeline-base.js | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/scroll-timeline-base.js b/src/scroll-timeline-base.js
index c0b97125..d234a1ac 100644
--- a/src/scroll-timeline-base.js
+++ b/src/scroll-timeline-base.js
@@ -243,7 +243,8 @@ function updateMeasurements(source) {
 }
 
 function updateSource(timeline, source) {
-  const oldSource = scrollTimelineOptions.get(timeline).source;
+  const timelineDetails = scrollTimelineOptions.get(timeline);
+  const oldSource = timelineDetails.source;
   if (oldSource == source)
     return;
 
@@ -267,7 +268,7 @@ function updateSource(timeline, source) {
       }
     }
   }
-  scrollTimelineOptions.get(timeline).source = source;
+  timelineDetails.source = source;
   if (source) {
     let details = sourceDetails.get(source);
     if (!details) {
@@ -282,10 +283,13 @@ function updateSource(timeline, source) {
       // Use resize observer to detect changes to source size
       const resizeObserver = new ResizeObserver((entries) => {
         for (const entry of entries) {
-          updateMeasurements(entry.target)
+          updateMeasurements(timelineDetails.source)
         }
       });
       resizeObserver.observe(source);
+      for (const child of source.children) {
+        resizeObserver.observe(child)
+      }
 
       // Use mutation observer to detect updated style attributes on source element
       const mutationObserver = new MutationObserver((records) => {