loaded & progress are not correct when file is upload

[mkszepp]

Steps to reproduce

1. Add two or more files into queue
2. Start upload (the easiest way to reproduce is, to make the upload sequential and throttle network connection to 3G or slow)
3. First file is uploading and progress bar + loaded is increasing
4. After the first file is completed the progress & loaded is decreased

Reason

On loadend event the event.total and event.loaded are taken the Content-Length header from the response (see here).
In my case this bug occures because the uploaded file was 12000 bytes and the Content-Length was 300 bytes, because my i my response body there is a json like { successful: true }

I think, there is not correct to set the Content-Length as file.size, because this is only correct, when i return after the upload the uploaded image.

While debugging, i have found an older issue. In this issue there was tried so fix this problem, by adding a check for total = 0 bytes (#475),
This means, that the progress & loaded works only when i return with status 200 & no body.

Possible fix

• The file.size should only be set in onloadstart event
• In Event onprogress set always only file.loaded
• In event onloadend (when file is uploaded) we should set file.loaded equal to file.size

Actual code parts:

ember-file-upload/ember-file-upload/src/system/upload.ts

Lines 90 to 97 in d2ac4b2

	request.onprogress = function (evt) {
	if (!evt) return;
	if (!evt.lengthComputable || evt.total === 0) return;
	file.loaded = evt.loaded;
	file.size = evt.total;
	file.progress = (evt.loaded / evt.total) * 100;
	};

ember-file-upload/ember-file-upload/src/system/http-request.ts

Lines 85 to 90 in d2ac4b2

	this.request.onloadstart =
	this.request.onprogress =
	this.request.onloadend =
	bind(this, function (evt) {
	this.onprogress?.(evt);
	});

[gilest]

Hey @mkszepp thanks for the detailed rundown. What you've described makes sense and I've suspicious that these progress numbers are not correct myself