I am trying to send a POST request, containing an array, but the array is appearing as empty in the payload. When logging the array to the console it shows as having a length of 2 (expected) and I can see the values.

I don't understand what I am doing wrong, all the articles I have read have been about an array not showing the expected values or returning undefined; I can clearly see the values are in the array when they are output to the console. Why is this not mirrored in the POST request? I am also receiving undefined if I try to console.log a specific value.

i.e. console.log(items[0]); //returns undefined

Code snippet:

function callPHP(items) {
    console.log(items);
    var xhr = new XMLHttpRequest();
    var data = items;
    var postUrl = *link*;
    xhr.open('POST', postUrl, true);
    xhr.send(data);
    xhr.onreadystatechange = function() { 
        if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
            console.log("Got response 200!");
        }
    };  
}

function getUserInfo(aCallback){
    var items = [];
    chrome.identity.getProfileUserInfo({'accountStatus': 'ANY'}, function(info) {
        email = info.email;
        items.push(email);
        items.push("test");
    });
        
    aCallback(items);   
}

document.onreadystatechange = function () {
    if (document.readyState === "interactive") {
        getUserInfo(callPHP);
    }       
};

I would really appreciate any help as I have been stuck on this for hours and I feel I may be missing something super obvious. If you need any more clarification on my code or its context, please let me know!