Error never get into catch section after calling an actions

[stefensuhat]

Hi,

At docs I read at the section

Actions that are handled by this middleware return a promise. This gives you the ability to chain actions. A good example of this might be a form. In the form you might dispatch an actions to store the form values. The normal flow of the action into the reducers would not be altered but you can chain a then/catch onto the initial dispatch.

this.props.saveForm(formData)
  .then(() => {
    // router the user away
    this.context.router.push("/my/home/page")
  })
  .catch((response) => {
    //handle form errors
  })

So , I want to tried with my simple form handler to handle error section

handleFormSubmit(data) {
        this.props
            .signIn(data)
            .then((response) => {

            })
            .catch(response => {
                console.log(response);
            });
    }

reducer:

export function signIn({ email, password }) {
    return {
        type: 'LOGIN',
        payload: {
            request: {
                url: 'auth/login',
                method: 'POST',
                data: { email, password },
            },
        },
    };

I want to tried error response to see if its working properly. But it never console it out (422, 401) response.

But If I move my console.log to then section it will print it out properly.

Object {type: "LOGIN_FAIL", error: Error: Request failed with status code 422, meta: Object}

Why It enter to success response instead of catch section (I removed all my response interceptor)?.

[nmaves]

Per the middleware options docs you need to set returnRejectedPromiseOnError to true.

[stefensuhat]

@nmaves hi thanks!! it return at catch.

But I got slight problem with it

here is my interceptor error response function:

function interceptorErrorResponse(dispatch, error) {
    const { data } = error.response;

    const { code, status } = data.meta;

    switch (code) {
        case 401:
            switch (status) {
                case 10:
                    axios.post('token/refresh').then((response) => {
                        cookie.save('_t', response.data.token, {
                            secure: true,
                        });
                    });
                    break;
                default:
                    cookie.remove('_t');
                // window.location.assign('/login');
            }
            break;
        default:
            return Promise.reject(data);
    }

    return Promise.reject(data);
}

the problem is every time it return will always return

HTTP Failure in Axios Object {meta: Object}
 Object {type: "LOGIN_FAIL", error: Object, meta: Object}

it error object:

data:undefined,
status:0

[nmaves]

I am going to close this issue as there as been no interaction for over two months. If this still an issue please reopen the issue.