Edge Upload Test

HTML

<input id="afile" type="file" name="afile" /> <span id="statedisplay"></span><br/>
<progress id="progress" value="0"></progress>
<button id="button">Start uploading</button>
<span id="display"></span>

JavaScript

var fileSelector = document.getElementById("afile"),
  progressBar = document.getElementById("progress"),
  loadBtn = document.getElementById("button"),
  display = document.getElementById("display");
  statedisplay = document.getElementById("statedisplay");

function upload(data) {
  var xhr = new XMLHttpRequest();
//  xhr.addEventListener("progress", updateProgress);
  xhr.onreadystatechange = function(){
  statedisplay.innerText = xhr.readyState;
  }
	
  if (xhr.upload) {
	xhr.upload.onprogress = updateProgress;

    xhr.upload.onloadstart = function(e) {
      progressBar.value = 0;
      display.innerText = '0% -> or display "Uploading..." animation.';
    }
	
    xhr.upload.onloadend = function(e) {
      progressBar.value = e.loaded;
      loadBtn.disabled = false;
      loadBtn.innerHTML = 'Start uploading';
    }
  }
  xhr.open( "POST", "https://zinoui.com/demo/progress-bar/upload.php", true );
  xhr.send( data );
}

function updateProgress(e){
     var oNow = new Date();
     if (e.lengthComputable) {
        progressBar.max = e.total;
        progressBar.value = e.loaded;
        display.innerText = Math.floor((e.loaded / e.total) * 100) + '% ' + oNow.toTimeString();
      }
	 else {
        display.innerText = '???% ' + oNow.toTimeString();
	  }
 }

function buildFormData() {
  var fd = new FormData();
  var file = fileSelector.files[0];
  fd.append("afile", file);
  return fd;
}

loadBtn.addEventListener("click", function(e) {
  this.disabled = true;
  this.innerHTML = "Uploading...";
  upload(buildFormData());
});