## バグ症状整理

| 項目         | 内容                           |
| ------------ | ------------------------------ |
| **症状**     | [ユーザーが報告した問題]       |
| **期待動作** | [正常に動作すべき方式]         |
| **実際動作** | [現在発生している問題]         |
| **深刻度**   | Critical / High / Medium / Low |

# キーワードで関連ファイル検索
Grep "<keyword>" src/ --type ts --type tsx

# 特定画面/機能の関連ファイル確認 (Feature-First構造)
Glob src/features/<feature>/components/
Glob src/features/<feature>/hooks/

[UI Event] → [Custom Hook] → [API Call] → [Response]
     ↓            ↓              ↓            ↓
   確認        状態変更       fetch実行    データ処理

### 仮説リスト

| #   | 仮説    | 検証方法   | 結果  |
| --- | ------- | ---------- | ----- |
| 1   | [仮説1] | [検証方法] | OK/NG |
| 2   | [仮説2] | [検証方法] | OK/NG |
| 3   | [仮説3] | [検証方法] | OK/NG |

## 根本原因

**位置**: `src/features/<feature>/hooks/<file>.ts:123`

**原因**: [具体的な原因説明]

**影響範囲**: [他の機能への影響]

// tests/unit/features/<feature>/<file>.test.ts

describe('BUG: [バグタイトル]', () => {
  it('should [正常動作] when [条件]', async () => {
    // Arrange - バグ発生条件設定
    // Act - バグトリガー
    // Assert - 正常動作確認 (現時点では失敗)
  });
});

# テスト失敗確認 (Red) - 必ず失敗してから進行
npm test -- tests/unit/features/<feature>/<file>.test.ts

// 修正前
// [問題のあるコード]

// 修正後
// [修正されたコード]

# テスト通過確認
npm test -- tests/unit/features/<feature>/<file>.test.ts

npm run lint

npm test

## バグ修正完了

### バグ要約

| 項目         | 内容                  |
| ------------ | --------------------- |
| **症状**     | [症状]                |
| **根本原因** | [原因]                |
| **修正位置** | `<ファイルパス>:<行>` |

### 変更履歴

| ファイル    | 変更タイプ | 説明       |
| ----------- | ---------- | ---------- |
| `src/...`   | 修正       | [説明]     |
| `tests/...` | 追加       | 回帰テスト |

### 検証結果

- 回帰テスト追加・通過
- 全体テスト通過
- npm run lint 通過

### 次のステップ

→ コミット準備完了

## エラーログ分析

**エラータイプ**: [Exception/Error タイプ]
**発生位置**: [スタックトレースから抽出]
**発生条件**: [ログから把握した条件]

SPEC修正が必要

**問題**: SPECの[セクション]に明示された動作が実際の要件と異なる

**提案**:

1. SPEC修正: `/feature-spec-updater <機能ID>`
2. その後バグ修正を進行

/** データ取得 */
async function fetchData(id: string): Promise<DataModel | null> {
  try {
    const response = await fetch(`/api/data/${id}`);
    if (!response.ok) {
      throw new Error(`HTTP ${response.status}`);
    }
    return (await response.json()) as DataModel;
  } catch (error) {
    logger.error('fetchData', `Error fetching data: ${error}`);
    return null;
  }
}

/** データ取得Hook */
function useData(id: string) {
  const [data, setData] = useState<DataModel | null>(null);
  const [error, setError] = useState<string | null>(null);

  useEffect(() => {
    const load = async () => {
      try {
        const result = await fetchData(id);
        if (result === null) {
          setError(MESSAGES.ERROR.DATA_NOT_FOUND);
          return;
        }
        setData(result);
      } catch (e) {
        logger.error('useData', `Error: ${e}`);
        setError(MESSAGES.ERROR.LOAD_FAILED);
      }
    };
    load();
  }, [id]);

  return { data, error };
}

## CONTEXT.json 更新内容

1. Read `docs/features/<id>/CONTEXT.json`
2. Edit:
   - quick_resume.current_state → "BugFixing"
   - quick_resume.current_task → "バグ分析: [症状]"
   - quick_resume.next_actions → ["根本原因把握", "回帰テスト作成", "修正実装"]
   - quick_resume.last_updated_at → 現在時刻
   - history[] += 状態遷移記録

{
  "quick_resume": {
    "current_state": "SyncingStatus",
    "current_task": "バグ修正完了、状態同期待ち",
    "next_actions": ["feature-status-sync 実行", "index.md 状態反映"],
    "last_updated_at": "2026-02-11T15:30:00+09:00"
  },
  "decisions": [
    {
      "at": "2026-02-11T15:30:00+09:00",
      "summary": "バグ根本原因: [原因要約]",
      "rationale": "[修正方針選択理由]"
    }
  ],
  "history": [
    {
      "at": "2026-02-11T15:30:00+09:00",
      "from_state": "BugFixing",
      "to_state": "SyncingStatus",
      "triggered_by": "bug-fix",
      "note": "バグ修正完了 - [症状] → [修正内容]"
    }
  ]
}

Read(".claude/wisdom/common-errors.md")
Read(".claude/wisdom/project-patterns.md")

## {エラー名}

**症状**: {バグ発生状況}
**根本原因**: {なぜ発生したか}
**解決方法**: {どう修正したか}

\`\`\`typescript
// 修正前
{問題コード}

// 修正後
{解決コード}
\`\`\`

**再発防止**: {同一バグ予防策}
**テスト**: {回帰テスト追加}

## {パターン名}

**状況**: {いつ使用するか}
**実装**: \`\`\`typescript
{コード例}
\`\`\`
**根拠**: {なぜこの方法が良いか}

# 直接呼び出し
/bug-fix "説明パネルでストリーミングが途中で止まる"

# エラーログと共に
/bug-fix "クイズ回答時にNull エラー発生" --log "<エラーログ>"

# 特定ファイル指定
/bug-fix "Diff表示が崩れる" --file src/features/diff-view/components/DiffViewPanel.tsx