Possible Unhandled Promise Rejection with async / await

Question

In a ReactNative component, when I press a button I got the "Possible Unhandled Promise Rejection" error when I execute this function:

async onAdd(item) {
    try {
        const response = await fetch('url', {
            method: 'POST',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                event_id: item.id,
                event_type: item.event_type,
            })
        });
        const responseJson = await response.json();
    } catch (error) {
        error(error);
    }
}

I do not know why since its in a try / catch block.

UPDATED
This is the error function:

function error(value) {
    if (console) {
        console.error(value)
    }
}

Well `error(error)` is most likely throwing an exception, as `error` is not a function. — Bergi, Mar 24 '18 at 20:49
What is your 'error()' method doing? If it throws an error, so will onAdd. — Holy Joe, Mar 24 '18 at 20:49
Possible duplicate of https://stackoverflow.com/questions/38842499/react-native-possible-unhandled-promise-rejection — Bruno Mazzardo, Mar 24 '18 at 20:55
Is your code supposed to do something with `responseJson`? Like return it? — jfriend00, Mar 25 '18 at 00:30

jfriend00 · Accepted Answer · 2018-03-25T00:41:42.837

The problem is you are redefining the symbol error here with the catch argument:

} catch (error) {
    error(error);
}

so that hides your error() function. Change to this (with different names for the two symbols):

} catch (err) {
    error(err);
}

So, when you try to call error(error) you're trying to execute a non-function which throws which causes onAdd() to reject the promise that the async function returns and you don't have a .catch() handler on that function call (because you didn't think it could reject). And, as long as your catch() handler is written so that it doesn't throw itself, then your promise won't reject, but your coding error was causing it to throw.

score -1 · Answer 2 · answered Mar 24 '18 at 20:57

-1

The method that calls this function should handle the error too, probably on your React Class

answered Mar 24 '18 at 20:57

Bruno Mazzardo

1,586
1
15
27

I call the function on onpress attribute, onPress={() => this.onAdd(item)} – Giacomo M Mar 24 '18 at 21:01

Possible Unhandled Promise Rejection with async / await

2 Answers2

Linked