React-query: React Native throws fullscreen error when promises are rejected in useMutation

[longprao]

Describe the bug
When a promise from fetch is rejected (via Promise.reject() or throw new Error(), React Native debug throws a fullscreen red log box, even with try/catch and throwOnError: true/false

To Reproduce
Steps to reproduce the behavior:

I call a mutation like this:

try {
  const { token, ...rest } = await mutate(form);
  ....
} catch (e) {
  console.log('page error', e);
}

My mutation hook is like this:

useMutation<any, LoginInput>(({ email, password }) => {
    return post(`auth/login`, {
      email,
      password,
    });
  });

post function is just a simple fetch:

export const post = async (url: string, data?: any) => {
  const res = await fetch(`${Config.API_URL}${url}`, {
    method: 'POST',
    body: JSON.stringify(data),
    headers: {
      Accept: 'application/json, text/plain, */*',
      'Content-Type': 'application/json',
      'Accept-encoding': 'gzip, deflate, br',
      'Accept-language': 'en',
    },
  });
  if (!res.ok) {
    const body = await res.json();
    throw new Error(parseError(res.status, body));
  }
  return res.json();
};

catch (e) is able catch the error and display this to the UI, same with the { error } object from useMutation, BUT the red logbox also displays fullscreen and I have to hit ESC to hide it every time.

Expected behavior
Shouldn't trigger red logbox.

Smartphone (please complete the following information):
react: 16.11.0
react-native: 0.62.2
iOS simulator (13.6)

Additional context
I have found a workaround to temporarily fix this, using this code in index.js:

import { setConsole } from 'react-query';

setConsole({
  error: console.info,
});

So it seems the problems was console.error call. Any advice please?

[tannerlinsley]

https://react-query.tanstack.com/docs/api#setconsole Use that to proxy all console.error calls to console.log.

[longprao]

Yes it is what I'm doing but it took me a lot of time to find out, so it might be helpful for others if you put a note for react native in the docs.

[Daniel-Griffiths]

I ran into this too, glad I found this issue! :slightly_smiling_face: