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.
fix(saveGif): Resolve black frames and add 'reset' option
This PR addresses a long-standing bug in
saveGif()
that caused the initial frames of a generated GIF to be black. It also introduces a new feature, as suggested by the @davepagurek , to provide users with more control over the recording process.🐛 The Bug
When calling
saveGif()
, the first few frames of the output GIF were often black. This was caused by a race condition:saveGif
function manually callsthis.redraw()
to render a single frame.redraw()
is asynchronous and only schedules a paint. The pixel capture was happening before the browser had a chance to complete the rendering, resulting in a capture of a blank (black) canvas.✨ The Solution
This PR implements a two-part solution to fix the bug while preserving the function's intended design.
1. Synchronized Frame Capture
The core timing bug is resolved by
await
-ing arequestAnimationFrame
promise immediately afterthis.redraw()
is called. This ensures that thewhile
loop pauses until the frame is fully rendered on the canvas before capturing the pixels. This completely eliminates the black frames.2. New
reset
OptionAs per the @davepagurek feedback, the intentional resetting of
frameCount
is crucial for recording animations from their start. This behavior has been preserved as the default.A new
reset
option has been added to theoptions
object to give users the choice to either reset the animation or record from the current state of the sketch.🚀 Usage
The
saveGif
function now accepts areset
boolean in itsoptions
object, which defaults totrue
.Default Behavior (Resetting the animation)
This will reset
frameCount
to0
and record the animation from the beginning.