Update Commerce Cart using Fetch Hi this is a variation of the question asked here on updating the cart using ajax, instead I'm attempting to use the Fetch API. As a test the form submits properly when submitting in the usual way without using the Fetch request. I've attempted to replicate the synchronous request header that I inspected in the Chrome Network tab but I still get a Bad Request error. 

HTML:

&lt;form method="POST" id="addToCartForm"&gt;
    {{ getCsrfInput() }}
    &lt;input type="hidden" name="action" value="commerce/cart/updateCart"&gt;
    &lt;input type="hidden" name="redirect" value="/cart"&gt;
    &lt;input type="hidden" name="purchasableId" value="{{ product.id }}"&gt;
    &lt;input type="number" name="qty"&gt;
&lt;/form&gt;


JS:

let formElem = document.getElementById('addToCartForm');
let form = new FormData(formElem);
let request = new Request('/', {
  credentials: 'include',
  method: 'post',
  mode: 'same-origin',
  redirect: 'follow',
  headers: new Headers({
    'Content-Type': 'application/x-www-form-urlencoded',
    'Accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8',
    'X-Requested-With': 'XMLHttpRequest' // so craft detects ajax
  }),
  body: form
});

fetch(request).then((response) =&gt; {
  if(response.ok) {
    return response.text();
  }
  throw new Error('Network response was not ok.');
}).then((response) =&gt; {
  console.log('Worked:');
  console.log(response);
}).catch((error) =&gt; {
  console.log(error);
});
The problem was resolved by changing the headers set:

let form = new FormData(this.form);
let request = new Request('/', {
  credentials: 'include',
  method: 'post',
  mode: 'same-origin',
  redirect: 'follow',
  headers: new Headers({
    'Accept': '*/*',
    'X-Requested-With': 'XMLHttpRequest'
  }),
  body: form
});


Instead of declaring the Content-Type in the request, I set the encoding type on the form itself, this step is optional as the request sets as multipart/form data by default I think.

&lt;form method="post" enctype="multipart/form-data"&gt;
..
&lt;/form&gt;