Question about an existing feature

What are you trying to achieve?

I am currently trying to overlay text onto an image. I am doing this by generating the text using canvas, converting it to a png, then placing it on the source image. When running my code on my Mac outside of docker, everything works as intended, but as soon as I build the project into a docker container, it gives me this error when trying to overlay the text. The weird thing is, it works when overlaying text the first time, but it errors on the second time. I am not sure why. I would assume it might have to do with the image being corrupted, but if it was corrupted it should fail to work in both environments.

triggerUncaughtException(err, true /* fromPromise */);
[Error: pngload_buffer: out of order read at line 673]

For additional context, here is my docker build file:

FROM node:20-bookworm
RUN apt-get update
RUN apt-get install -y build-essential libcairo2-dev libpango1.0-dev libjpeg-dev libgif-dev librsvg2-dev libvips libvips-tools
COPY . .

RUN yarn install

ENTRYPOINT ["yarn","run","start"]

When you searched for similar issues, what did you find that might be related?

#3600 Had a similar error to mine. The proposed solution there was to set sequentialRead: false when creating a new sharp instance, however trying this gave me a segment fault error on both my Mac environment and docker environment.

Please provide a minimal, standalone code sample, without other dependencies, that demonstrates this question

It's kind of hard to recreate this issue in a standalone example since it's very specific, but here's the link to the code where I am performing the image operations.
https://github.com/DriedSponge/chica/blob/main/src/commands/image/Caption.ts#L24-L77

Here is a quick summary of what is happening

               const captionBackdrop = sharp(buffer, {animated:true})

		const textCanvas: Canvas = new Canvas(width, height);

               // Perform operations on the canvas to create a text overlay.
		

		// Overlay the text
		captionBackdrop.composite([
			{
				input: await textCanvas.toBuffer(),
				tile: true,
				gravity: "northwest"
			}
		]);

Please keep in mind that this error only occurs inside of my docker container, it works perfectly fine on the outside. Also that is the entire error. It did not give me a full stack trace or specific file/line number where the error was occurring.

Please let me know if you need more context, I am happy to provide it. Also even if you can't provide a direct solution, I'm happy to hear any ideas as to why you think this may be happening.

The images were too big to upload to github so here's an imgur link https://imgur.com/a/00dM1iV

Thank you!