Services Plugins FAQs

Issue with AVIF File Selection and Conversion in Image Compressor and Uploader Plugin

Plugins
#1

Hi Zeroqode team,

I’m using the Image Compressor and Uploader plugin and noticed an issue when users select .avif image files. The plugin allows these files to be selected, but the output is not working as expected.

When an AVIF file is selected:

  • The original image preview is blank.
  • The compressed .webp output is a nearly white image (#E6E6E6 ), about 2.1kb in size.
  • There are no error messages, which creates a confusing experience for users. It appears as though the upload worked, but in reality, the image is lost.

I tested this on the plugin’s demo page , and the behavior is the same:

  • AVIF files can be selected
  • The original image shows up blank
  • The output image is a “Zero Code” splash image
  • No errors are surfaced during the process

I understand that AVIF is not be supported by the plugin for compression/conversion, but this silent failure poses a real problem.

I’m looking for one of two possible solutions:

  1. Prevent AVIF files from being selected during file input (ideal if conversion isn’t supported).
  2. Or, if possible, add AVIF support so that it can be properly converted to .webp .

Right now, because there’s no error handling or validation, users think their upload worked when it didn’t—which causes broken images in our app.

Would appreciate any help or a patch to prevent AVIF file selection until proper support can be added.

Thanks!
Chuck

#2

Hey @chuckyte ,

Thanks for reaching out about the AVIF file issue with the Image Compressor and Uploader plugin—I really appreciate the detailed description! I’m sorry this is causing a confusing experience for your users, and I’m here to help get to the bottom of it.

You mentioned that when users select AVIF files, the original preview is blank, the compressed .webp output is a nearly white image (around 2.1KB), and there’s no error message, making it seem like the upload worked when it didn’t. You also saw this behavior on our demo page, with the output showing a “Zero Code” splash image.

I tested this on our demo page using an AVIF file, and I actually found that it worked as expected—the image was compressed successfully, and the output was correct, without any blank previews or splash images. I’ve attached screenshots of my test for reference, showing a successful compression. This is a bit puzzling since you’re seeing a different result. The plugin documentation at Image Compressor and Uploader notes that converting images to WEBP isn’t supported on iOS devices or Safari browsers, which might be related to the issue you’re experiencing. Could you let me know which browser and device you’re testing on? If you’re using Safari or an iOS device, that could explain the discrepancy, as AVIF support can vary across browsers.

image
image879×187 4.21 KB

image
image1334×741 66.1 KB

The plugin supports formats like PNG, JPEG, SVG, WEBP, and HEIC, but AVIF isn’t explicitly listed as supported for compression or conversion. However, since it worked in my test, it’s possible AVIF is partially supported depending on the environment. The lack of error handling for cases where it fails, like in your setup, is definitely causing the silent failure you described. Let’s explore your two proposed solutions:

  • Prevent AVIF Files from Being Selected: To avoid confusion in cases where AVIF fails, we can block these files from being selected. The plugin’s file input doesn’t have a built-in filter for file types, but you can add a custom validation in Bubble. For example, when a file is selected, use a workflow to check the file’s extension. If it’s “.avif,” display a message like, “AVIF files may not work on all devices—please use PNG, JPEG, or WEBP for best results.” This will prevent the silent failure and give users clear feedback.
  • Add AVIF Support: Since AVIF worked in my test, it seems there’s some level of support, but it’s inconsistent across browsers or devices. Adding full, reliable AVIF support for compression and conversion to WEBP would require a plugin update to ensure consistency. I can pass this feedback to our development team for consideration in a future update.

For now, I’d suggest implementing the validation workaround to block AVIF files on devices where it’s failing, while we investigate further. If you can share your browser and device details, I’d be happy to dig deeper and figure out why it’s not working in your setup.

Looking forward to hearing from you!

Best regards,
Support Team

Browse all Zeroqode Plugins for bubble

Banner_Last3