@brianteeman Could you update the branch of this PR to latest 4.0-dev of upstream so we get rid of the unrelated javascript-cs errors in drone? Alternatively let me know if I shall do that for you. Thanks in advance.

done

I get the following error with crop/resize:

@Quy I can not replicate that

Open browser's console.
Resize/crop.
Click Save button.
See console.

I understand what you said but I cannot replicate it

It must be my local setup then. I will try again on a hosting site. Thanks.

Same issue on cloudaccess.host. Hopefully, someone can test and confirm.

can anyone else replicate the issue @Quy reported

@brianteeman , I was able to replicate what @Quy experiences

This issue occurs though regardless of the patch. Seems like something else is going on.

Please fix conflicts so I can retest to see I can reproduce the issue. Thanks.

Here is the json response after saving the resized/cropped webp image. I don't know media manager to see how it handles the saved file.

{"success":false,"message":"Unable to upload file.","messages":{"error":["Illegal mime type detected: application/octet-stream"]},"data":null}

can you please confirm the settings in com_media options

@brianteeman The problem seems to be the MIME type. @Quy 's JSON response shows Illegal mime type detected: application/octet-stream. Your PR adds "image/webp" to the default value for the field "Allowed MIME types" (or so), but it doesn't add "application/octet-stream". I'm not sure if that MIME type should be added because I have no idea what else uses that and if it can be dangerous.

@Quy Can you check if it works after you've added "application/octet-stream" to the allowed MIME types in media manager config?

it shouldnt add application/octet-stream.

I think I know the cause - just checking

Possibly we need to update some library used for MIME type detection because it doesn't know webp yet?

no - thats not it - please wait

So the problem sounds the same as the issue with pdf files back with a change in 3.7
Can you confirm if fileinfo is enabled in php
Can you change this setting and see if it works

Can you confirm if fileinfo is enabled in php

Enabled.

Can you change this setting and see if it works

PHP Notice: exif_imagetype(): Read error! in \libraries\src\Helper\MediaHelper.php on line 74

The saved file no longer has the image/webp MIME type.

Folder
    local-images:/
Type
    File
Date Created
    2021-05-25 15:32
Date Modified
    2021-05-25 15:32
Dimensions
    - 
Size
    287.95 KB 
MIME Type
    application/octet-stream
Extension
    webp

Works in Chrome v91.0.4472.7 but not in Firefox v9.0 on Windows 10 Pro.

@Quy can you please confirm the version of Firefox you are using?

Firefox 89.0.1

Still cannot replicate your problem

So you can crop/resize/rotate and save & close/open the image again? I will test again shortly and let you know.

ah I see - its failing at the save part

Wondering if the save in the crop/resize plugin is actually saving it as a jpg but keeping the extension as webp which chrome has no problem with but firefox does??

See #33481 (comment)

Its an upstream problem with the cropper.js library

fengyuanchen/cropperjs#800 (comment)

Could you please retest. I found and fixed an error in the js which I have now fixed and it would appear to resolve the issue.

Note that if it doesnt then this js correction is still needed

It is still an issue with crop.

Edit an image.
Crop the image.
Click Save & Close button.
See browser's console.

are rotate and resize fixed?

Same error for all 3 actions.

Ok so the conclusion is that it is not a bug in the js here or the cropper library. Firefox does not identify webp images when used with the HTMLCanvasElement.toDataURL() method and it just falls back to png

Reference MDN
Tests Tests

Reference MDN says:

If the requested type is not image/png, but the returned value starts with data:image/png, then the requested type is not supported.

I have no words. That seems to me like if my function returns a "Successfully completed the xyz task." message for the "abc" task, the task has failed.

Closed as image editing for webp doesnt work with cropperjs and firefox windows