Fulfilled promise stored rather than the request body - reactjs

Question

The following code sends a post request to an API and then stores the API's response. The object stored is a fulfilled promise, rather than the body. I though I was using the .then properly, as something similar works for a get request.
The following saga is called every time a post request is made. It contains everything from the post to the call to the call to the reducer.
function* setData(action) {
const url = action.payload.url;
const data_obj = action.payload.data;
console.log(action);
try {
const json = fetch(url, {
method: "post",
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify(data_obj)
})
.then(statusHelper)
.then(response => response.json());
yield put({ type: "DATA_SENT", payload: json });
}
catch (e)
{
yield put({ type: ERROR_OCCURED, payload: { error : {message: "An Error occured sending HIT data. Please try again later"}}});
}
}
Below is the statusHelper function. It came from another SO answer (I'll edit in the link).
function statusHelper (response) {
if (response.status >= 200 && response.status < 300) {
return Promise.resolve(response)
} else {
return Promise.reject(new Error(response.statusText))
}
}

Answer 1

I think your issue is here
.then(response => response.json());
response.json() also returns a promise.
You need to .then off the json() call and return the data.

Answer 2

I was missing a yield after the fetch. This wound up being the solution for me
function* setData(action) {
const url = action.payload.url;
const data_obj = action.payload.data;
let json;
try {
const response = yield fetch(url, {
method: "post",
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify(data_obj)
});
//const resp = statusHelper(response);
console.log('Response: ', response, response.status)
if(response.status >= 200 && response.status < 300)
{
json = yield response.json();
}
console.log("JSON: ", json);
}
catch (e)
{
yield put({ type: ERROR_OCCURED, payload: { error : {message: "An Error occured sending HIT data. Please try again later"}}});
return;
}
yield put({ type: "DATA_SENT", payload: json });
}