Uncaught ReferenceError: remaining is not defined

[CreativeTransmissions]

Hi there, this error occurs on load.

Installed using npm, using with a svelte project.

Fix should be just a case of defining the variable "remaining" before use.

Uncaught ReferenceError: remaining is not defined
at LZWEncoder.encode (canvas-capture.js:3402:14556)
at GIFEncoder.writePixels (canvas-capture.js:3402:12864)
at GIFEncoder.addFrame (canvas-capture.js:3402:7599)
at renderFrame (canvas-capture.js:3402:28769)
at self.onmessage (canvas-capture.js:3402:29314)

[amandaghassaei]

oof, this error is coming from a pre-compiled dependency. I've added a fix to the dev branch, can you test this by running:

npm install https://github.com/amandaghassaei/canvas-capture#dev

If that works, I'll merge it into main.

thanks!

[symetryn]

@amandaghassaei Hello there, thank you for the amazing library. I encountered the same error and after running
npm install https://github.com/amandaghassaei/canvas-capture#dev
I seem to have another similar error on the dev branch:

    gif.js:2 Uncaught ReferenceError: curPixel is not defined
    at LZWEncoder.encode (gif.js:2:14878)
    at GIFEncoder.writePixels (gif.js:2:13164)
    at GIFEncoder.addFrame (gif.js:2:7898)
    at renderFrame (gif.js:2:29069)
    at self.onmessage (gif.js:2:29615)```

[amandaghassaei]

@symetryn ok I fixed curPixel in the dev branch, but I'd imagine there are other issues.

• Do you have a test project that I can attempt to build to reproduce this?
• Or if you wouldn't mind submitting a PR with the fixed issues? All I did was search for curPixel in gif.js and add a "var" in front of the first place it was called. It seems like a lot of variables in gif.js that are not properly defined.

This is not a great solution overall, I know, but until I can find time to rip out and redo some of the CCapture internals, it will have to do.

thanks!

[amandaghassaei]

ok I took a look at https://github.com/jnordberg/gif.js/blob/92d27a02841339e202c75150dcf6fe5f4fa42ec5/src/LZWEncoder.js

and realized that remaining and curPixel should be defined in the root of LZWEncoder, rather than inside a function. I also found another variable n_bits that needed to be defined. I've just commited the latest to the dev branch, let me know if that's working!

[symetryn]

@amandaghassaei Thank you for your work.
After looking further I found that this issue didn't occur in incognito mode. I tried disabling extensions one by one and it seems some how this issue only occurs when the official react dev tools extension is enabled. It probably declares the variables in same scope as gif.js. So, this seems to be a non issue altogether.

[amandaghassaei]

@symetryn sounds good, thanks for looking into that.

@CreativeTransmissions does the current dev branch fix the svelte issue? or do you have a project that I can take a look at to resolve this? thanks!

[Paolino95]

Sorry, @amandaghassaei , do you have merge this last 4 commits into main branch?

Because in the main branch I have the same issue;

[amandaghassaei]

@Paolino95 I don't think I ever did because I was waiting to hear back if the changes I made had any effect. Can you import the dev branch and test it?

npm install git+https://github.com/amandaghassaei/canvas-capture.git#dev

thanks

[junekuhn]

I had the same problem and the dev branch fixed it for me