How to get axios error response INTO the redux saga catch method

The code with axios is:

export const createBlaBla = (payload) => {
  return axios.post('/some-url', payload)
    .then(response => response)
    .catch(err => err);
}

And then I’m using this with redux-saga like this:

function* createBlaBlaFlow(action) {
  try {
    const response = yield call(createBlaBla, action.payload);
    if (response) {
      yield put({
        type: CREATE_BLA_BLA_SUCCESS
      });
    }
  } catch (err) {
    // I need the error data here ..
    yield put({
      type: CREATE_BLA_BLA_FAILURE,
      payload: 'failed to create bla-bla'
    });
  }
}

In case of some error on the backend - like invalid data send to the backend - it returns a 400 response with some useful data:

{
  "code":"ERR-1000",
  "message":"Validation failed because ..."
  "method":"POST",
  "errorDetails":"..."
}

But I don’t receive this useful data in the catch statement inside the saga. I can console.log() the data in the axios catch statement, also I can get it inside the try statement in the saga, but it never arrives in the catch.

Probably I need to do something else? … Or the server shouldn’t return 400 response in this case?

[shinima]

You are catching errors in your createBlaBla, so the error does not bubble to the generator. Just replace you createBlaBla as follows:

export const createBlaBla = (payload) => {
  return axios.post('/some-url', payload)
}

[BenNeighbour]

@rajat-np I am trying that and it isn’t working for me? Could I have some clarity on this please?