48時間のデバッグ：React Nativeのタッチバグを追い詰めるまで

48時間のデバッグ：React Nativeのタッチバグを追い詰めるまで

アプリが固まった

「ボタンが反応しません」

PRISMアプリのテスト中だった。記事詳細画面で目次ボタンをタップしても何も起きない。戻るボタンも反応しない。言語切り替え、いいねボタン、コメント入力、すべてが動かない。不思議なことにスクロールだけは動く。画面を上下にスワイプすれば動くのに、ボタンをタップすると何も反応しない。

アプリを完全に終了して再起動すれば直る。しかし記事をいくつか行き来すると、また固まる。パターンが見えない。完全にランダムに見えた。

私はテスト自動化を長年やってきた開発者だ。ランダムに見えるバグでも、繰り返しテストすればパターンが見つかることを知っている。

AIでアプリを作っている

PRISMアプリのコードはほぼすべてClaude Codeで書いた。React Nativeの専門家だからではない。AIがあるから作れた。「この機能を作って」と言えばコードが出てきて、ほとんどがちゃんと動いた。4言語対応、プッシュ通知、広告統合、サブスクリプション。以前なら挑戦すらできなかったものばかりだ。

ところがこのタッチバグの前で行き詰まった。「タッチが効かない。なぜだと思う？」と聞くと、AIは複数の仮説を提示して一つずつ検証しようと言った。問題は、AI自身も原因がわからないということだった。

最初の試み：Gesture Handlerの競合

AIの最初の仮説はジェスチャーの競合だった。「目次機能で@gorhom/bottom-sheetを使っていますが、GestureHandlerRootViewがネストしていてジェスチャーが競合している可能性があります」

もっともらしく聞こえた。以前ジェスチャーの競合で目次機能を一時的に無効化したこともあった。Bottom SheetをReact Native標準のModalに置き換えた。結果は失敗。問題はそのままだった。

2回目の試み：広告オーバーレイ

2つ目の仮説は広告だった。「インタースティシャル広告が閉じた後、透明なオーバーレイが残ってタッチをブロックしているのでは？」

Google AdMobを使っており、iOSのネイティブ広告は別のUIWindowを生成する。広告表示後に問題が発生しやすい気もしていた。広告を完全に無効化してテストしたところ、頻度は減ったがまだ発生した。広告は悪化要因かもしれないが、根本原因ではなかった。

パターンを発見：画面遷移14〜15回

ランダムに見えるバグにもパターンはある。何十回もテストを繰り返し、条件を一つずつ変えていった。アプリ起動直後は問題ない。記事を数個見る程度なら大丈夫。しかし画面遷移を14〜15回繰り返すと問題が発生する。画面遷移の回数とバグ発生に相関関係があった。

この発見をもとにAIに聞いた。「前の画面のタッチハンドラが解放されずに残っているのでは？」detachInactiveScreens: trueで非アクティブ画面を切り離してみた。頻度は減ったが、まだ発生する。根本原因ではなく症状の緩和に過ぎなかった。ただし「画面遷移」が鍵だということは確実になった。

転換点：質問を変える

2日目になって、ふと考えが変わった。「コードの問題じゃなかったら？」

それまで自分のコードかライブラリに問題があると仮定していた。しかしReact Native自体にバグがあるとしたら？プロジェクト設定を見直した。

// ios/Podfile.properties.json
{
  "newArchEnabled": "true"
}

New Architecture。Fabricと呼ばれるReact Nativeの新しいレンダリングシステムが、Expo SDK 54でデフォルトで有効になっていた。

「GitHub Issuesで似た事例を探して」とAIに指示したら、見つけてきた。

• #37755 - "Touch events stop working intermittently on iOS with Fabric"
• #38511 - "RCTSurfaceTouchHandler sometimes fails to register touches"

症状が完全に一致した。間欠的に発生。iOSのみ。画面遷移後に頻発。スクロールはできるがタップは効かない。

AIが見つけたが、「GitHubで探せ」という方向転換は私が決めたことだ。AIは指示しなければ自らコミュニティを探しに行かない。

解決：アーキテクチャのロールバック

New Architectureをオフにした。

{
  "newArchEnabled": "false"
}

競合の可能性があるライブラリも削除した。

npm uninstall react-native-reanimated react-native-worklets @gorhom/bottom-sheet

Reanimatedの代わりに標準のAnimated API、Bottom Sheetの代わりに標準のModalを使った。iOSビルドを再生成してテスト。画面遷移50回以上。タッチ問題ゼロ。

学んだこと

1. 間欠的なバグはアーキテクチャを疑え

再現が難しくランダムに発生するバグは、コードレベルの問題ではない可能性が高い。レースコンディション、メモリ問題、フレームワーク自体のバグかもしれない。2日以上詰まったら、一段上を見るべきだ。

2. 依存関係はコストだ

react-native-reanimatedと@gorhom/bottom-sheetは優れたライブラリだ。しかしネイティブコードを含んでいるため、アーキテクチャの変化に弱い。標準APIで十分なら、外部依存の追加は慎重に判断すべきだ。

3. 体系的な記録が答えを導く

仮説→検証→記録→次の仮説というサイクルを繰り返した。間違った仮説も記録に残した。その記録があったから「じゃあ何が残っている？」と問えた。

4. AIは助手だ

AIは仮説を提示し、コードを書き、検証方法を提案する。しかし「質問を変えよう」という転換は私が決めた。AIは強力なツールだが、あくまでツールだ。

おわりに

48時間のデバッグは、AIコーディングの可能性と限界を同時に見せてくれた。専門知識がなくてもアプリは作れる。しかしフレームワークの奥深くに潜むバグは、結局自分で掘り下げるしかない。

AIがコードを代わりに書いてくれる時代でも、開発者が不要になるわけではない。むしろ逆だ。AIは「どうやって」を解決してくれる。しかし「何が問題か」「どこを見るべきか」「いつ方向転換すべきか」は、依然として人間の仕事だ。コードを書く時間は減ったが、判断する能力はより重要になった。

今回のバグでAIは4つの仮説を出した。全部外れた。正解にたどり着いたのは「質問を変えよう」と決めた瞬間だった。その決断はAIにはできない。

同じ状況にいる誰かへ。質問を変えてみろ。一段上を見ろ。コミュニティを探せ。そして記録しろ。

2026年1月