Builder "removes" with alpha channel transparency for webm video when uploaded to site assets

Builder content link

Builder public api key
32d4e2c82f21445595f3161539e86035

Detailed steps to reproduce the bug

  • Get a video (webm) with transparent background.
  • Upload the video to the assets folder.
  • Try to use this video any way you please. I have tried video embed, passing asset url to component etc.
  • Notice how the alpha layer/transparency no longer works

Screenshots or video link

The first video, has the transparency removed. I suspect this to do with optimisations applied at the time of upload

Code stack you are integrating Builder with
NextJS, Chrome

Hey @Simon could you please share this video with me to test it out?

Hi @sheema , thanks for the response.
You should be able to download from here.: https://2steps-staging.netlify.app/home-hero.webm.

Please note: when you click on this link, you’ll need to then download. You will also see this video with a black background. This is the body bg colour, not the video - confused me for a moment :slight_smile:

You can see the issue in action here: https://2steps-staging.netlify.app/video-test.

a tool i use to validate alpha etc is here: https://rotato.app/tools/transparent-video.

Please also note you need to test this in desktop chrome. I use a different video format for mobile/safari etc.

@Simon I was able to replicate the issue. It looks like a bug. We are working on it and will update you soon.

Thanks for the update. Looking forward to a solution :slight_smile:

Hey @Simon upon further investigation, it has been determined that the matter is considered more of a feature request than a bug. The development team has established a dedicated platform for users to propose ideas and garner support through upvotes.

To proceed, kindly submit your request on the following link: Builder.io Ideas. This platform enables our community to actively participate in the decision-making process by expressing their support through upvoting.

Hi,

Thanks for the response.

How can it be a feature request when you are “changing” the video I am uploading? If builder didn’t optimise, and then break my video, it wouldn’t be an issue.

With this response i am unable to use builder to manage videos on my client’s hero (or elsewhere). I’ll now have to a) use a different provider to host videos or hard-code the video and have the client call me each time they want to change it (for all their pages).

I am now curious how to log the “feature” request: Don’t break my video by stripping the alpha channel and removing transparent backgrounds?

This is very frustrating.

-Simon.

1 Like

Hi Simon,

Thank you for your patience, Sheema and I have had further internal conversations and the removal of alpha channel is due to how Builder handles and optimises video content. I can see why this should be considered a bug.
I wanted to highlight that no other customers have reported this as an issue meaning that this is unlikely to be addressed in the short/medium term.
I appreciate this is not the answer you were expecting but wanted to give you some background to help your decision in term of options available.

I confirm the issue and yes I think it’s a bug. We cannot have transparent videos via Builder. So Simon, you are not alone :wink:

1 Like

I can also confirm this issue. We are unable to have videos with transparent backgrounds which is causing us to need to find workarounds for Builder styles. It would be great if this was fixed.

2 Likes

Hi @Stephane - is there any update on this? Will Builder fix this issue and stop removing transparent backgrounds on videos? Or do you have a workaround solution you can suggest? We previously made our video a .gif but that has much worse performance and bandwidth so we’re hoping to find another solution.

Thanks!