Open Bug 1884282 Opened 1 year ago Updated 2 months ago

WebGL video is broken

Categories

(Core :: Graphics: CanvasWebGL, defect)

Firefox 123
All
Android
defect

Tracking

()

Tracking Status
firefox124 --- affected
firefox125 --- affected
firefox126 --- affected

People

(Reporter: git, Unassigned, NeedInfo)

Details

(Whiteboard: [qa-triaged])

Attachments

(2 files)

Steps to reproduce:

Using Videos as Textures has been fully broken for years now on the Firefox Android App ( Google Pixel 6 Pro, fully updated Android 14 ). I always assumed I did something wrong, but no, it seems fully busted, whereas Firefox on Windows, Chrome on Android are fine.

Even the official Mozilla WebGL demo is broken:
Steps to reproduce:

Here are more examples. This article from my blog: https://blog.frost.kiwi/WebGL-LUTS-made-simple/ and my WebApp regarding 360 perspective transformations, when any video sample is selected: https://mirrorball.frost.kiwi/

Actual results:

The texture upload to GPU fails, even on the official basic Mozilla WebGL + Video demo: https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial/Animating_textures_in_WebGL

I drilled down in the WebGL debug messages and found the fail reason being error 1285 OUT_OF_MEMORY. Not sure why. This happens even with tiny resolution videos.

Finally, sometimes, super rarely, a video frame does make it through before the subsequent ones all fail. But only on calls to texImage2D and never texSubImage2D. This success of one frame happens 1 out of 50 reloads maybe.
But in general, it always fails.

Expected results:

WebGL texture is supposed

Here is a video showing both Firefox Android and Chrome Android on the most newly updated Android 14, on a Pixel 6 Pro.
Both Firefox's and Chrome's versions are shown.

Uploaded a Screencapture in the previous comment, showing off both the official https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial/Animating_textures_in_WebGL WebGL+Video Sample from Mozilla failing and another example from a blog post failing as well.

The severity field is not set for this bug.
:bclark, could you have a look please?

For more information, please visit BugBot documentation.

Flags: needinfo?(brclark)

Thank you for the report!

I will confirm this issue, because I was able to reproduce it on Fenix Nightly 126.0a1, Beta 125.0b7, and RC 124.2.0, with Xiaomi Mi8 Lite (Android 10), and on Google Pixel 6 (Android 14).

Severity: -- → S3
Status: UNCONFIRMED → NEW
Ever confirmed: true
Flags: needinfo?(brclark)
Whiteboard: [qa-triaged]
Component: General → Graphics: CanvasWebGL
Product: Fenix → Core

This issue has been tagged for versions 124-126, however, it is still ongoing today with 129.0 (Build #2016035991) on all devices, as tested on my Pixel 9 Pro XL Android 14.

We are finding Unity users being affected by this issue. It would be awesome if there are cycles to tend to this, as it would have a positive impact to Unity3D produced web sites in the wild on Firefox on Android.

Still broken for v133.0

It has been years already, so I set texImage2D & friends as not fully supported in the mdn webdocs for Firefox Android: https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texImage2D now has a compatibility notice.

This was done in this PR: https://github.com/mdn/browser-compat-data/pull/24849

Any insight as to what could cause this?

Flags: needinfo?(jgilbert)

As of 2025-10-12, the example Frost Kiwi linked above is working for me. See attached screen recording.

I took it from the same sample but on GitHub pages, which just saves a few clicks.

This is with Firefox Android stable v143.0.4, on Android 13, my device is a Fairphone 4.

Apologies if this is too off topic, but what is still not working for me (on Firefox Android) is capturing a video frame using the VideoFrame constructor or CanvasRenderingContext2D.drawImage. Both of these approaches worked for me on Firefox Linux, the former worked on Chrome Android stable on the same phone.

For my application I wrote a workaround to capture the frame using WebGLRenderingContext.texImage2D.

Here's a demo of this workaround: https://fluffysquirrels.github.io/web-demo/2025-10-12_video-frame-webgl-ff-android-workaround/

The workaround fully works for me on Firefox Linux, mostly works on Firefox Android stable (source video vanishes on play, output videos do not display when Android Screen Recorder is enabled), doesn't work on Chrome Android stable (output videos do not display). I don't need to fix those bugs for my application so I haven't chased them down yet.


Actions

I propose the browser compatibility tables are updated to reflect these new experiments as described above. Although it may be useful to confirm Frost Kiwi (or someone else) can reproduce them.

The changes would be for the compatibility tables for these methods:

I would add a link to this bug (as Frost Kiwi originally did), and if agreed a link to my workaround example (perhaps with the bugs fixed!).

Redirect a needinfo that is pending on an inactive user to the triage owner.
:ahale, since the bug has recent activity, could you have a look please?

For more information, please visit BugBot documentation.

Flags: needinfo?(jgilbert) → needinfo?(ahale)
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: