Как не получить Uncaught in Promise

promises.md

Как не получить Uncaught in Promise

• Если обрабатываем промис и возвращаем его, в onRejected возвращаем Promise.reject(error) либо не используем onRejected, чтобы в любом случае была возможность обработать reject снаружи.

  const load = () => {
    return fetcher.get('/url')
      .then(
        (data) => {
          // Do something
          return data;
        },
        (error) => {
          // Do something
          return Promise.reject(error);
        }
      );
  }
  load().then(
    (data) => console.log('Done!', data),
    (error) => console.log('Error!', error)
  );

  const load = () => {
    return fetcher.get('/url')
      .then((data) => {
        // Do something
        return data;
      });
  }
  load().then(
    (data) => console.log('Done!', data),
    (error) => console.log('Error!', error)
  );

• Если обрабатываем промис и НЕ возвращаем его, пишем в onRejected console.error, чтобы избежать эксцепшена Uncaught in Promise и при этом узнать об ошибке.

  const load = () => {
    fetcher.get('/url')
      .then(
        (data) => {
          // Do something
        },
        console.error
      );
  }

• Чтобы не усложнять, можно сохранить промис в переменную, на неё навесить then с обработкой, где есть onRejected либо console.error, а вернуть исходный промис.

  const load = () => {
    const promise = fetcher.get('/url');
    promise.then(
      (data) => {
        // Do something
      },
      (error) => {
        // Do something
      }
    );
    return promise;
  }
  load().then(
    (data) => console.log('Done!', data),
    (error) => console.log('Error!', error)
  );

• Не используем catch после then, чтобы эксцепшены из onFilfilled попали в Sentry.