title: XMLHttpRequest file upload not working in IE11
body: <p>Hi I have the following JS on my page. It is working fine on chrome and firefox. but its not working on Internet Explorer 11. I'm a salesforce developer and I don't know much javascript. Can you please help me find where the issue is?
  Thanks in advance.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>tests = {
          filereader: typeof FileReader != 'undefined',
          dnd: 'draggable' in document.createElement('span'),
          formdata: !!window.FormData,
          progress: "upload" in new XMLHttpRequest
      },
      support = {
          filereader: document.getElementById('filereader'),
          formdata: document.getElementById('formdata'),
          progress: document.getElementById('progress')
      },
      progress = document.getElementById('uploadprogress'),
      fileupload = document.getElementById('upload');
      
      "filereader formdata progress".split(' ').forEach(
          function (api) {
              if (tests[api] === false) {
                  support[api].className = 'fail';
              } else {
                  support[api].className = 'hidden';
              }
          }
      );
      
      function textBeforeDrag(flag){
          if(flag)
          {
              holder_txt1.className = '';
              holder_txt2.className = 'hidden';
          }else{
              holder_txt1.className = 'hidden';
              holder_txt2.className = '';
          }
      }
      
      function resetAll()
      {
          holder.className = holder_txt1.className = '';
          holder_txt2.className = uploadStatus.className = 'hidden';
      }
      
      function readfiles(files) { 
          
          var goodSize = true;
          var formData = tests.formdata ? new FormData() : null;
          for (var i = 0; i &lt; files.length; i++) {
              size = typeof ActiveXObject !== 'undefined' ?
                          getIEFileSize(files[i])
                          :
                          files[i].fileSize || files[i].size;
              goodSize = 5000000 &gt; size;
              if(!goodSize)
              {
                  alert(files[i].name +' is too large, please choose a file that is 5Mb or less');
                  return;
              }
              goodSize = 26214400 &gt; size+{!allAttSize};
              if(!goodSize)
              {
                  alert(this.files[0].name +' is too large - Total Attachment Size should not exceed 25MB');
                  return;
              }
              uploadStatus.className = '';
              holder.className = 'hidden';
              
              // now post a new XHR request
              if (tests.formdata) {
                  var xhr = new XMLHttpRequest();
                  
                  var sfdcurl = 'https://'+sfdcHostName+'.salesforce.com/services/apexrest/DragAndDrop/v1?FileName='+encodeURIComponent(files[i].name)+'&amp;cType='+encodeURIComponent(files[i].type)+ '&amp;parId={!thisCase.id}';
                  
                  xhr.open('POST','/services/proxy' );
                  
                  xhr.setRequestHeader("Authorization","Bearer {!$Api.Session_ID}");
                  xhr.setRequestHeader('SalesforceProxy-Endpoint', sfdcurl);
                  xhr.setRequestHeader('X-User-Agent', 'DragAndDropAPI v1.0');
                  
                  xhr.onload = function() {
                      progress.value = progress.innerHTML = 100;
                  };
                  
                  if (tests.progress) {
                      xhr.upload.onprogress = function (event) {
                          if (event.lengthComputable) {
                              var complete = (event.loaded / event.total * 100 | 0);
                              progress.value = progress.innerHTML = complete;
                          }
                      }
                  }
                  
                  xhr.onreadystatechange=function()
                  {
                      if (xhr.readyState==4 &amp;&amp; xhr.status != 200)
                      {
                          if(xhr.responseText)
                              alert(xhr.responseText);
                          else
                              alert('Some error occurred while uploading file');
                          
                          console.log(xhr);
                      }else{
                            
                      }
                  }
                  xhr.send(files[i]);
              }
          } 
          setTimeout(function(){addDroppedAttachment();},1000);
      }
      
      if (tests.dnd) {
          holder.ondragover = function () {
              this.className = 'hover';
              textBeforeDrag(false);
              return false;
          };
          holder.ondragend = function () {
              this.className = '';
              textBeforeDrag(true);
              return false;
          };
          holder.ondrop = function (e) {
              textBeforeDrag(true);
              this.className = '';
              e.preventDefault();
              readfiles(e.dataTransfer.files);
              resetAll();
          }
      } else {
          fileupload.className = 'hidden';
          fileupload.querySelector('input').onchange = function () {
              readfiles(this.files);
          };
      }</code></pre>
  </div>
  </div>
  </p>