XMLHttpRequest Craft Commerce Cart Update Issues

Question

When using XMLHttpRequest to update cart like the following, I get a 500 error for 'lineItems': {[lineitem]: {'qty': value}} (and also {[lineitem]: {'remove': true}}, any other submission works);

var url = document.querySelector('form#cart-form input[name="action"]').value;
var data = {
    'action': 'commerce/cart/update-cart',
    'lineItems': {[lineitem]: {'qty': value}}
}
data[csrfname] = csrfvalue;

atomic(url, {
    method: 'POST',
    data: data,
    headers: {
        "Content-Type": 'application/x-www-form-urlencoded',
        'X-Requested-With': 'XMLHttpRequest',
        'Accept': 'application/json'
    }
}).then(function(response) {
    console.log(response.data);
    console.log(response.xhr);
}).catch(function(error) {
    console.log(error.status);
    console.log(error.statusText);
});

(The code above uses atomic, which is just a small library to wrap XMLHttpRequest into a promise structure similar to using fetch).

The submitted data is (and looks) exactly the same as what I pass through JQuery Ajax, which works;

var url = document.querySelector('form#cart-form input[name="action"]').value;
var data = {
    'action': 'commerce/cart/update-cart',
    'lineItems': {[lineitem]: {'qty': value}}
}
data[csrfname] = csrfvalue;

$.ajax({
    type: "POST",
    dataType: 'json',
    url: '',
    data: data,
    success: function(response){
        console.log(response);
        }
    }
}).fail(function(error) {
    console.log('Error: ' + error);
});

I can't seem to figure out what the issue is, as the POST data being submitted looks EXACTLY the same. Changing the Content-Type to application/json doesn't work either. Anyone run into this issue?