Uploading of video file fails due to JS error

I know that generally speaking Discourse is not meant for video uploading, that being said, I have run into an issue I was hoping someone could point me in the right direction to figure out.

Some video files that are uploaded will get stuck at “Uploading 100%” indefinitely. The only option left to a user is to refresh the page or close the post. regardless of how long one waits or how small the file is.

It is clear there is code doing some form of validation or check that the file is getting stuck in, I’m pretty new to Ruby On Rails / Discourse development so I haven’t figured out yet where in the pathway the file is getting stuck. I have, however, figured out a way to by-pass the problem and upload the file without any issue albeit in a not very user friendly way.

If I take that exact same file, rename the filename extension from .mp4 to .pdf the file uploads without any problem and in fact is added with the proper extension as well.

e.g.
If I upload PXL_12234563421LS.mp4 the file will get stuck indefinitely, if I upload it as: PXL_12234563421LS.pdf the upload completes and even puts the proper video markdown in the post:

![PXL_20200811_12234563421LS|video](upload://sxVpgLrc3L2MukaD5eS5QOgPY7j.mp4)

Is anyone familiar enough with this pathway to explain what is going on and is there a way for me to disable this somewhere? I am also happy to figure out exactly where the problem is and perhaps file a bug with some guidance.

Thank you.

4 Likes

Perhaps this is an internet issue.
But usually, a reload of the page does the trick and the video can upload?

I appreciate the response but this is not an internet issue. It happens from every computer and across browsers. I am uploading this on the same network the discourse instance is running from so it isn’t going out to the internet.

The changing of the extension leading to a successful upload, even in the same post where the original file is still “uploading” definitely points at some code in discourse running for video files that is choking on certain files indefinitely.

1 Like

Is there an error that shows up in the console?

Can you upload the video to try.discourse.org?

1 Like

How large is the file? I believe the max filesize is 30MB.

I also would’ve asked if this is via mobile or PC, but you mention a computer below.

I did try to do this on try.discourse.org but .mp4 files are not allowed there, sorry I should have put that in my original post.

Also, this is a small file, it is only 8 megs. I’ve found the file size does not matter.

When you say whether or not errors happen in the console, I am looking at the logs and I see the upload start and then nothing else is displayed for that event, is there somewhere else you are referring to as the console that I should look at?

Mobile and PC both display the same issue, it is definitely specific to the files that are produced, if I re-encode the file with ffmpeg the problem also goes away. Also, i’ve tried Chrome and Firefox and both display the same issue.

Just to be clear, all I am doing is changing the filename from “movie.mp4” to “movie.pdf” and then it suddenly uploads without getting stuck at “Uploading 100%.”

The file size is 8MB, any of the movies file that display this issue can range from any size. If I could determine and trace the pathway that this is going through while being uploaded I could probably narrow down where it is getting stuck.

Try now, I just added it.

I mean the browser console - does anything show there or in the server logs (/logs)?

Alright I can reproduce it there, I had to find a slightly smaller example but I have plenty :slight_smile:

First picture shows me uploading the file with a .mp4 extension and stuck at “Uploading 100%” regardless of how long I wait. I waited 5 minutes before taking the screenshot.

I left the post open and stuck on “Uploading 100%” state on try.discourse.org, user: testdub. If that helps on your end. I’ll leave it open until I hear back.

You don’t allow PDFs but TXT so I just renamed the file to .txt and the upload completed.

When I upload the same file with the .txt extension it completes in seconds and shows up as video markdown.

Just for completeness here are the md5s of the files I uploaded:

62b865b29c47acbce859c27246c0d7c3  PXL_20240812_174504425.LS.mp4
62b865b29c47acbce859c27246c0d7c3  PXL_20240812_174504425.LS.txt

Here’s the error I see in the browser console trying to upload that file:

Uncaught IndexSizeError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source width is 0.
    at composer-video-thumbnail-uppy.js:80:31

8998f3f964284f7e0ab4007836dbddd736757617.mp4.gz (3.3 MB)

This is something on the client side we’ll need to fix.

2 Likes

Yep, awesome thank you Michael!

I was in the middle of replying with something similar:


When I look at the console for firefox I see something like this:

Media resource blob:https://devsite.net/77e697fe-2ebc-489c-bef3-036d45b9908b could not be decoded, error: Error Code: NS_ERROR_DOM_MEDIA_METADATA_ERR (0x806e0006)

On Chrome I get a different and perhaps a better error for what might be going on here:

Uncaught DOMException: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source width is 0.
    at https://devsite.net/assets/chunk.d340137c92abde91812c.d41d8cd9.js:74:3649
3 Likes

I’ve had similar issue, on WordPress. And then MP4 was broken. I just uploaded short MP4 without problems and if it works perhaps MP4 itself, or that process that created it, should check?

Já conseguiu resolver?

We have someone looking at a fix, yes.

3 Likes

Fix for this issue is now up:

3 Likes

Hi Blake, thank you for such a quick turnaround! I tested this out and it works great on Chrome but it does not work in Firefox, I still get stuck at “Uploading 100%” and the following error in the console:

Media resource blob:https://devsite.net/a2deff66-3376-4c6e-9cca-f18275c312ce could not be decoded.
Media resource blob:https://devsite.net/a2deff66-3376-4c6e-9cca-f18275c312ce could not be decoded, error: Error Code: NS_ERROR_DOM_MEDIA_METADATA_ERR (0x806e0006)

I tested this with Firefox 129.0.2.

Let me know if there is any other information I can provide.

1 Like

This fix should do the trick. In this case a video thumbnail won’t be created for the video, but it won’t prevent it from actually uploading this time.

3 Likes

Thank you, I was able to successfully upload with Firefox. I really appreciate the quick response and follow ups!

2 Likes

This topic was automatically closed 3 days after the last reply. New replies are no longer allowed.