GIF badge on an image that is not a GIF

[Half-Shot]

Steps to reproduce

1. View message containing an image (a PNG)

Outcome

What did you expect?

The image shouldn't have a GIF badge overlay

What happened instead?

It does. The mimetype is a image/png

Operating system

No response

Application version

No response

How did you install the app?

No response

Homeserver

No response

Will you send logs?

Yes

[Half-Shot]

So https://github.com/vector-im/riot-web/blob/69ee8fd96a49f7008a6b16813ffbcc74a0872821/src/utils/Image.ts#L11-L14 marks image/png as animated because I suppose there might be some apng's out there with the wrong mimetype. We get around this with matrix-org/matrix-spec-proposals#4230, but not all clients support that.

So really I suppose a solution here is to ensure sending clients send this metadata too.

EDIT: Should have read ahead, 😓 https://github.com/vector-im/riot-web/blob/e662c1959b45c2fcc2c55e6fba71d5a87fdc6383/src/components/views/messages/MImageBody.tsx#L313-L317

[t3chguy]

out there with the wrong mimetype.

Yeah because browsers are dumb and often just base their mime type on the file extension, e.g. #7370 Firefox identifies audio file as video due to extension - so EW will have sent many an image/png event for Animated PNG files.

For PNG we do actually check the blob to see if it has the animation metadata block:

element-web/src/utils/Image.ts

Lines 79 to 104 in 69ee8fd

	case "image/png":
	case "image/apng": {
	// Based on https://stackoverflow.com/a/68618296
	const arr = await blob.arrayBuffer();
	if (
	arrayHasDiff([0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a], Array.from(arrayBufferRead(arr, 0, 8)))
	) {
	return false;
	}
	for (let i = 8; i < blob.size; ) {
	const length = arrayBufferReadInt(arr, i);
	i += 4;
	const type = arrayBufferReadStr(arr, i, 4);
	i += 4;
	switch (type) {
	case "acTL":
	return true;
	case "IDAT":
	return false;
	}
	i += length + 4;
	}
	break;
	}

So this sounds like #24015 or #26467

[Half-Shot]

I'm asking about the user's client now, I suspect it might be the latter one. Looking at the file, I don't see any animated magic bytes in there.

[Half-Shot]

I can't reproduce this by uploading the same bytes inside the same client session...