fix(interactions): give factories a live view of the animation - #136
Merged
Conversation
The animation object a hook returns is rebuilt on every render, and the
runner handed factories that object through a getter, so a factory that
kept what it was handed (`const { lottie } = context`) kept that render's
values: `root` stayed `null` when the element mounted after attach, which
on a prerendered page is always.
The context now carries one view per animation whose members are getters
onto the current instance, so keeping or destructuring it is safe and a
value pulled out of it is a copy of that moment, as any value is. The
docs' custom-factory example returns to the natural destructuring form,
and the contract's JSDoc and page say the view is live.
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #136 +/- ##
=======================================
Coverage 99.91% 99.91%
=======================================
Files 47 47
Lines 1223 1232 +9
Branches 361 362 +1
=======================================
+ Hits 1222 1231 +9
Misses 1 1 ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
useInteractionsRunnerhanded every factory the current animation through a getter on the context. The animation object a hook returns is rebuilt on every render, so a factory that kept what it was handed,const { lottie } = context, the natural thing to write, kept that render's values:rootstayednullwhen the element mounted after attach, which on a prerendered page is always. The two shipped factories read the context on every use and were unaffected; the docs' custom-factory example was not, and never armed on a direct load.The context now carries one live view per animation: an object whose members are getters onto the current instance, built from the instance's own keys (the same shape React Hook Form uses for its proxied form state), cached per animation for the runner's life. Keeping or destructuring it is safe; a value pulled out of it is a copy of that moment, as any value is. No public type changes. The custom-factory example returns to the destructuring form, and the contract's JSDoc and the "Writing your own" page say the view is live.
Verified
context.lottienow prove "this context drives that animation" throughsubscribe, one function per animation for its life.pnpm checkgreen: 480 tests, coverage 100 / 97.43 / 100 / 100, budgets unchanged, 34 pages rendered.