PNG preview got ugly black backround

Troubleshooting
1

Summary
When I attach a PNG image to my message, the semi-transparent parts become black on the thumbnail preview and on the image viewer. I can still download the original picture, but that’s quite annoying.

Steps to reproduce
I had this issue with Mattermost 5.37.0 and I upgraded today to Mattermost 5.38.0 and still have the same bug. Before 5.37.0, I didn’t had this issue. I’m using Ubuntu Server 18.04.5 LTS.

To reproduce it, you just have to upload a PNG image with semi-transparent zone (any window screenshot from the macOS native Capture.app for example)

Expected behavior

image
image2288×1836 500 KB

Observed behavior

image
image1920×1201 130 KB

2

Hi, @Zlitus

Can you confirm which version of Mattermost desktop you are on and the theme that you are using? Is it also reproducible on the web browser too?

I tested this on the following environment and verified that the PNG image preview (from screen capture) looks like this:

  • Mac OS Big Sur 11.4
  • Mattermost Server 5.38.0
  • Mattermost Mac OS app 4.7.1

image
image1920×1148 131 KB

Are you looking at having only the full image appearing on the screen minus the black background?

3

Hello,

Yes I do have the same issue with the native client and with the web version into the browser. On your screenshot, you don’t have the issue because your PNG do not have a semi-transparent (alpha) area, can you please try with this PNG for example?

Thank you very much.

4

We have a ticket for this here: https://mattermost.atlassian.net/browse/MM-36295

2 Likes
5

Amazing, thank you very much.
As a way to fix it and to improve the display and to reduce the bandwidth, I would suggest to stop to convert all PNG to JPEG, but to convert all PNGs to webP.

Why?

6

The ticket seems to have been marked as “unscheduled”? And it seems that there is basically no action on this.

Is there anyway to kick this up in priority a bit? We copy paste images from jupyter notebooks all the time into our chat, and since august, they now always get ugly, nearly unreadable fonts due to the transparency aliasing…

image
image557×536 41.2 KB

1 Like
7

It is rather unsightly. Pasting screenshots on macOS is no longer simple and seamless. One can press Option key while clicking on selected area or on space bar, to remove the shadow, but that’s an extra step.

Another vote to add pressure to maybe have it fixed sooner.

8

It looks like it’s fixed on 7.5 server version:

* Fixed an issue where the transparency for PNG images in image previews and thumbnails was not preserved.

9

Thanks for the hint, @benito !
Wondering if the OP or others in this thread can confirm that their problem has been solved when upgrading to 7.5+.