例外が発生したら画面(react-error-overlay)に出るだろうと期待している状況で、画面に出なかったので問題に気づくのが遅れた。

観測事実 ts

console.log("will report");
throw new TypeError("report");

これでwill reportがコンソールに出るが、画面にもコンソールにもTypeErrorのエラーメッセージが表示されない

原因

  • このコードはPromiseの中にあった
    • サーバ上のデータを取得するところなのでこれは自然
  • そのPromiseの.catchで、問題をSentryに報告するようにしていた ts
     console.log("report1");
     throw new TypeError("report");
...
})
.catch((error: unknown) => {
  Sentry.captureException(error);
});
  • つまり例外をReactが捕捉する前に処理してしまっている
  • throwすると期待通りに表示されるようになった diff
- Sentry.captureException(error);
+ throw error;
- ![image](https://gyazo.com/c70223995aa6073814fb6b4bf4905aa7/thumb/1000)
  • ということはつまりそもそも.catch(...)を書くべきではなかったのでは
    • 単にレポートするだけのcatchに意味はない
  • Sentryのユーザフィードバックダイアログを出すようにした