transloadit / uppy

The next open source file uploader for web browsers :dog:

Home Page:https://uppy.io

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

@uppy/form crashes browser on v3.1.0 and higher

joostdebruijn opened this issue · comments

Initial checklist

  • I understand this is a bug report and questions should be posted in the Community Forum
  • I searched issues and couldn’t find anything (or linked relevant results below)

Link to runnable example

https://p2l39x.csb.app/

Steps to reproduce

  1. Open the example at: https://p2l39x.csb.app, see code here: https://codesandbox.io/p/sandbox/uppy-dashboard-forked-p2l39x
  2. Select a file
  3. Click the upload button
  4. The browser window will freeze. have a very high CPU-load and eventually crash

I can reproduce this behavior in Chrome v123, Edge v123 and Firefox v124 at Windows 11 23H2.

Expected behavior

The browser window should not crash and the form should be submitted with the relevant metadata in it.

Actual behavior

The browser window crashes and after some research I discovered it was related to the Form-plugin. The last working version of the plugin is v3.0.3, all versions after that contain this bug. One time I was able to create a trace with the Chrome profiler (I wasn't able to do this another time, because when the browser window crashes, the profiler seems to crash at well).

uppy-issue

The problematic code seems to be the function addResultsToForm (at least it consumes a serious amount of CPU-time) . This code has been refactored to Typescript since v3.1.0, so I think there went something wrong during the refactoring of this code.

The Firefox-profiler is working better, I discovered. Even when the tab is crashing, you can view the recording. It shows similar statistics as Chrome:

image

Hi, you've enabled both submitOnSuccess and triggerUploadOnSubmit, which doesn't make sense I think because one triggers the other. If I remove one of them, everything works as expected.

Is there a use case you have for both? Otherwise I'll make a PR to throw when both options are set.

@Murderlon Thanks for the quick response. I've both options set because I would like to trigger the upload on submit and I want the form to be submitted once the upload has been completed. I think I misunderstand the submitOnSuccess, because the form will be actually submitted after the upload has been complete after the upload is being triggered by the form submission.

@Murderlon Hm, I've submitOnSuccess disabled and triggerUploadOnSubmit enabled now. The files are uploaded once I submit the form, however - the form itself is not submitted after the upload completes...

You're right I overlooked something. In that case we just need a check whether the upload already happened.