Skip to content

Commit

Permalink
Fix form submissions that wait for uploads to complete (#2865)
Browse files Browse the repository at this point in the history
This fixes an issue we discovered at Felt, which was introduced in #2490.

The symptoms were as follows:

- Given a form with an image upload, if you waited until the upload completed before submitting the form, the submission would work as expected.
- However, if you submitted before the upload completed, you'd see the submission correctly wait until the upload hit 100%, then you'd get a JavaScript crash and the app would go dead.

The JavaScript console produced an error like this in release:

```
TypeError: r.hasAttribute is not a function. (In 'r.hasAttribute("name")', 'r.hasAttribute' is undefined)
```

The error in dev, of course, was more descriptive:

```
submitter.hasAttribute is not a function
Call Stack
 serializeForm  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:2402:30
 pushFormSubmit  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:3308:35
 push  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:3293:29
 triggerAwaitingSubmit  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:3236:7
 pushInput/  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:3223:18
 uploadFiles/  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:3325:11
 initAdapterUpload/this._entries  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:895:16
 onDone/this._onDone  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:769:7
 progress/<  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:745:16
 finish  node_modules/phoenix_live_view/priv/static/phoenix_live_view.esm.js:3034:18
```

Inspecting the code, it looks like the argument order got swapped in the case where uploads are in progress at form submission time.

I'm not sure how to write an adequate test to cover this, but I can confirm that the fix when applied to my codebase does indeed fix the issue.
  • Loading branch information
s3cur3 authored Oct 17, 2023
1 parent ca151c2 commit 60da4d5
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion assets/js/phoenix_live_view/view.js
Original file line number Diff line number Diff line change
Expand Up @@ -995,7 +995,7 @@ export default class View {
let cid = this.targetComponentID(formEl, targetCtx)
if(LiveUploader.hasUploadsInProgress(formEl)){
let [ref, _els] = refGenerator()
let push = () => this.pushFormSubmit(formEl, submitter, targetCtx, phxEvent, opts, onReply)
let push = () => this.pushFormSubmit(formEl, targetCtx, phxEvent, submitter, opts, onReply)
return this.scheduleSubmit(formEl, ref, opts, push)
} else if(LiveUploader.inputsAwaitingPreflight(formEl).length > 0){
let [ref, els] = refGenerator()
Expand Down

0 comments on commit 60da4d5

Please sign in to comment.