デバッグするときにまず目指すのはバグを100%再現させる
ことだが、調べるとっかかりがないと焦って闇雲にコードを変えてしまったりする。焦らないようにするため、注目する観点を整理する。
画面に関するデバッグ
# 前提 「〇〇画面で××したとき▲になりました(□エラーが出ました)」という感じの報告をもらったとき
1. 画面遷移
・2. リロード
で再現する場合、データの取得処理・state関連処理を疑う3. 特定の状態
・4. 特定の要素
の場合、その要素関連コードをリバースエンジニアリングする画面遷移に着目する
- 〇〇画面を開いたときに再現するか
- 〇〇画面を閉じたときに再現するか
- 別画面A → 〇〇画面と遷移したときはどうか
- リロード
- 画面表示 → リロードの操作で再現するか
- 特定の状態
- ステータスに応じた画面制御
- バリデーションチェック
- フォーム入力時 / 入力内容更新時
- 特定の要素
- ボタン
- フォーム
- テーブル
サーバー処理に関するデバッグ
バックエンド処理のデバッグは処理フローに則った操作を繰り返し、再現するか確かめると良い。
- ステータス遷移
- 遷移順
- データ更新順序
- データ更新されたか
- 発生頻度
- 不定期
- 毎回
- 特定の場合
- フラグ切り替え
- ON → OFF
- OFF → ON
- トランザクション処理の有無
- 単体で再現するか
- フロントエンドと結合したとき再現する
- APIリクエストだけで再現する
まずは処理フローを把握し、どんなとき再現するか確認する。
(おまけ)基盤・その他
ミドルウェア以下は設定できていないとそもそも動かない。
- エラーログをひたすら確認する
原因の大半はコンフィグ設定が間違っているため。なのでエラーログをきちんと読む。