chase-moskal / webp-hero

browser polyfill for the webp image format
https://chasemoskal.com/webp-hero/
MIT License
253 stars 22 forks source link

Polyfill does not seem to work on IceCat 60.7 #43

Closed mossroy closed 2 years ago

mossroy commented 2 years ago

IceCat 60.7 is (unfortunately) the latest version officially provided by the FSF: https://directory.fsf.org/wiki/Gnuzilla There are newer versions on their git https://git.savannah.gnu.org/cgit/gnuzilla.git/ , but 60.7 seems to be the last official one.

The webp-hero demo fails on it, with no error message: image even after disabling all addons of IceCat: image (NB: these screenshot were made with unofficial Windows build from https://github.com/muslayev/icecat-win64, but the same behavior has been reported on Trisquel 9)

IceCat 60.7 is based on the same Gecko version as Firefox 60.7 (that does not natively supports webp either). But webp-hero works fine on Firefox 60.7: image

So it seems to be an issue specific to IceCat (at least in this version) I could test with IceCat 91.5.0esr and webp-hero works on it (after disabling webp support in about:config: image.webp.enabled set to false).

NB: this is a follow-up of https://github.com/kiwix/kiwix-js/issues/835 , where we use webp-hero v0.0.0-dev.27 to display webp images on old browser engines

chase-moskal commented 2 years ago

@mossroy thanks for the bug report 👍

i'll spend some time investigating this soon. hopefully we can resolve it, and improve webp-hero's compatibility. i'll also see about getting the live demo back up and running.

if you'd like to chat, you can find me in this discord group, it's casual 🍻

chase-moskal commented 2 years ago

:tada: @mossroy i believe i've fixed this issue in v0.0.0-dev.28

in icecat, after whitelisting the blocked javascript, the webp-hero demo now works in icecat, when enabling the new useCanvasElements option: https://webp-hero.chasemoskal.com/?force?useCanvasElements

i suspect the root cause of the issue was some kind of anti-fingerprinting measure in icecat that prevents canvas.toDataURL from functioning.

the solution in this case, for icecat, is to use the new useCanvasElements option when instantiating WebpMachine

const webpMachine = new WebpMachine({useCanvasElements: true})