ONLY Firefox downloading recompressed webp instead of png

[Sabin]

Hello,

My son noticed an odd behaviour with one particular website, and I fail to find what may be prompting it, may I ask for an opinion or an advice, please?

Here's the thing: when you right click to download any image present on https://minecraft.fandom.com/wiki/Minecraft_Earth , with Firefox, you're downloading a webp.
Whereas, with Edge or Chrome, you're downloading a .png - AKA (son confirming) the original, non-recompressed file.

My son was adamant on that aspect, it's only Firefox that is affected, the other browsers (with a Chromium engine, I don't have an Apple device to test with Safari's) allow to download the original, genuine pages. Unlike the webp versions that have minor compression artifacts. And against the loss of information stemming from excessive compression, no "webp to PNG" extension will do the job.

I tested it on 3 computers, at home, all using Windows 10, from an ethernet connexion using a fiber line (either ethernet > fiber or wifi > fiber), so I think I can rule out AMP versions and network optimizations.

So... what, then O_o

I wondered if the server would send different HTML to different browsers, let's check it out

Sent to Firefox

Code: Select all

<img alt="MCE key art.webp" src="https://static.wikia.nocookie.net/minecraft_gamepedia/images/d/d3/MCE_key_art.webp/revision/latest/scale-to-width-down/200?cb=20210910124918" decoding="async" data-image-name="MCE key art.webp" data-image-key="MCE_key_art.webp" data-src="https://static.wikia.nocookie.net/minecraft_gamepedia/images/d/d3/MCE_key_art.webp/revision/latest/scale-to-width-down/200?cb=20210910124918" class=" lazyloaded" width="200" height="310">

Sent to Edge, what, it's just the "lazyload" par that differs

Code: Select all

<img alt="MCE key art.webp" src="https://static.wikia.nocookie.net/minecraft_gamepedia/images/d/d3/MCE_key_art.webp/revision/latest/scale-to-width-down/200?cb=20210910124918" decoding="async" width="200" height="310" data-image-name="MCE key art.webp" data-image-key="MCE_key_art.webp" data-src="https://static.wikia.nocookie.net/minecraft_gamepedia/images/d/d3/MCE_key_art.webp/revision/latest/scale-to-width-down/200?cb=20210910124918" class=" ls-is-cached lazyloaded">

And here, I saw the oddest thing of all, THE VERY SAME URL yields a webp in Firefox and a png in Edge/Chrome: https://static.wikia.nocookie.net/minec ... 0910124918

At this point, I'm out of leads. Every search I run ends up in people recommending an extension to convert from webp to png, and missing on the entire file format discrimination among browsers, but my google-fu sucks, I must admit.

Would someone have an idea, please? Thanks a lot if you can help!

[jscher2000]

And here, I saw the oddest thing of all, THE VERY SAME URL yields a webp in Firefox and a png in Edge/Chrome: https://static.wikia.nocookie.net/minec ... 0910124918

The site is sending both Firefox and Edge a WebP file in response to that request. Firefox offers to save the file in the format served. Edge does not, but instead automatically converts it to PNG for saving. It's not clear why you don't get a choice in Edge; maybe there's a "flag" for that. (Chrome is similar to Edge, if I recall correctly.)

Since Firefox doesn't have a built-in converter, there are a couple possible workarounds:

(1) Discourage sites from substituting WebP images for JPEG and PNG images (if they choose the format on the fly) -- this would be for the main page, and not for a link such as the above that already specifies a .webp file

(2) Use the Page Info dialog Save As button to re-request the image without signalling explicit support for WebP

(3) Use an extension to save in your choice of format

For #1:

I created an extension (Don't "Accept" image/webp), but this preference change gives a similar result:

(A) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button accepting the risk.

(B) In the search box on the page, type or paste image.http.accept and pause while the list is filtered

(C) Double-click the preference to display to display an editing field, and change the value to */* then press Enter or click the blue check mark button to save the change.

(While that sounds like "give me everything" it omits "image/webp" from the header sent by Firefox, so WebP is not explicitly requested.)

For #2:

(A) right-click the image > View Image Info*
(B) if Firefox didn't select the image from the list of images in the page, select it in the URL list
(C) click the Save As... button -- Firefox re-requests the image with the classic Accept header

* Note: in recent versions of Firefox, you need to toggle browser.menu.showViewImageInfo to true in about:config to see this option

For #3:

In case the site insists on sending Firefox a WebP image... I created an extension (Save webP as PNG or JPEG (Converter)), and there is an even more popular one as well.

[jscher2000]

P.S. I submitted a suggestion to add conversion to Firefox's Save Image As... process, but who knows whether it will get any traction. Feel free to vote for it:

Save WebP files to Original Format Easily

[Sabin]

Hello Jscher,

I reported your answer to my son, and it would seem you're starting on a mistaken basis here. Avoiding making things confusing isn't my forte, my apologies!
I'll try going with a bullet list:

(1) it's true that, judging from the URL, the website is attempting to send a webp file format

(2) and yet, originally, the website is "owning" png files
For instance, this URL: https://minecraft.fandom.com/wiki/File: ... _(MCE).png# ----> the title says "file name.png" ("Experience Reward old (MCE).png")

(3) more conclusive evidence, after I told him, my son insisted: in the case of that wiki, of which he is a contributor, when he personally uploads a .png file, the wiki remembers that file as "file name.png" in its image description (cf. the link above), but then the website will "serve" it as either webp (Firefox) or png (Edge, Chrome)

(4) experimental evidence, an image my son contributed himself.
The image is a .png on his hard drive.
He uploads it to the wiki.
In the page's text description, there is "image file.png"
From Firefox, he can only download it as webp.
From Edge/Chrome, he can only download it as png.

(5) These are not not just a png with the wrong file extension, I tested, the webp images are, indeed, damaged from recompression.
I tested, that very same image my son uploaded, zoomed in at 2000%

- https://imgur.com/a/dxHOBnL (the original png, and if I ask Edge/Chromium to download it, that will be exactly the same file, zero difference)
- https://imgur.com/a/2B1B4bh (the webp version offered to Firefox users)

***

At this point, would that mean the issue would be server-side, with the Minecraft Eart website recognizing the browser and deciding not to serve him with original png files?

(gotta run, that will have to be the conclusion for now, have a good day everyone!)

[jscher2000]

Saving a file doesn't tell the whole story -- in this case it disguises the true source of the difference:

* Server farms are indeed re-compressing PNG and JPG files with WebP compression to save on bandwidth. But not only for Firefox, for all modern browsers.

* To verify what was actually sent, you can compare the records of what each browser received using its developer tools Network panel (F12 key, Network tab): if you open the panel and then load or reload an image, then click its file name, the browser shows the headers sent by the server, which will indicate "Content-Type: image/webp".

* When saving the image, by default, Firefox re-requests the image in the same way, while it seems that Edge/Chrome either request a non-WebP version or perform a conversion on their own (however, since the image has less damage after saving, a re-request to the server seems more likely). Browsers are not very transparent about how they save images so it's difficult to be sure what is happening in Edge/Chrome.

[Grumpus]

@js2000 - You added the image.http.accept but . . .Is this necessary for https?

Also in about:config 3 of the webp items have trash cans for deletion of the items
browser.download.viewableInternally.previousHandler.alwaysAskBeforeHandling.webp True
browser.download.viewableInternally.previousHandler.preferredAction.webp 2
browser.download.viewableInternally.typeWasRegistered.webp True

The ask before handling is also set in the /edit/settings/general/Applications list

[jscher2000]

@js2000 - You added the image.http.accept but . . .Is this necessary for https?

It is used for both.

Also in about:config 3 of the webp items have trash cans for deletion of the items
browser.download.viewableInternally.previousHandler.alwaysAskBeforeHandling.webp True
browser.download.viewableInternally.previousHandler.preferredAction.webp 2
browser.download.viewableInternally.typeWasRegistered.webp True

The ask before handling is also set in the /edit/settings/general/Applications list

I don't have those. The trash can indicate preferences that aren't part of the standard list and were added either by Firefox or by the user.

[Grumpus]

@jscher2000 - Thanks, was having some display issues on some sites, no images showing.
The three items are probably from the Mint people.
Even with the */* in the additional about:config items some sites did not display the Webp images.
Changed setting from always ask to Firefox and no image, changed to system default and the images showed up.
After change to system default */* appears to work, webp site images show.