title: AJAX request's status pending unless async turned off
body: <p>I'm developing a Google Chrome extension and have a function that uploads a file to s3. The majority of the time while I test it, the PUT upload request returns <code>pending</code> status and never resolves. The file also fails to upload when this happens. However when I use <code>async: false</code>, everything works fine, and the pending status turns to a 200 shortly.</p>
  
  <p>I'm wondering if anyone knows the cause of this issue for async requests, as using <code>async: false</code> is not a viable solution for me. We are making the request from the Chrome's event. Here's the code:</p>
  
  <pre class="lang-js prettyprint-override"><code>$.get(url + 'videos/generate_s3_for_chrome', { content_type: 'video/webm' })
    .done(function(data) {
    $.ajax({
      url: data.presigned_url,
      method: "PUT",
      contentType: "video/webm",
      processData: false,
      dataType: "json",
      //async: false,
      beforeSend: function (xhr) {
          xhr.setRequestHeader('Content-Type', 'video/webm');
      },
      data: file,
      success: function (data) {
          console.log('success', data);
      },
      error: function (err) {
          console.log('error', err);
      }
    });
  }
  </code></pre>