# バッチ設計書 22-test:browser

## 概要

本ドキュメントは、CoffeeScriptプロジェクトにおけるCakefile `test:browser` タスクの設計仕様を記載したものである。このタスクは、ヘッドレスブラウザ（Puppeteer）を使用して、モダンブラウザコンパイラがブラウザ環境で正常に動作することを検証する。

### 本バッチの処理概要

このバッチは、CoffeeScriptのモダンブラウザ向けコンパイラ（ESモジュール形式）をヘッドレスブラウザ上で実行し、全テストスイートが正常に動作することを検証する。Puppeteerを使用してChromiumベースのブラウザを起動し、テストページを自動的に実行する。

**業務上の目的・背景**：CoffeeScriptはNode.js環境だけでなく、Webブラウザ上でも動作することを保証する必要がある。特にモダンブラウザはESモジュール（`<script type="module">`）をサポートしており、この形式のコンパイラが正常に動作することを検証することが重要である。Node.jsとブラウザでは実行環境が異なるため、ブラウザ固有の問題を検出するためにこのテストが必要となる。

**バッチの実行タイミング**：`build:browser:full`タスクの一部として自動実行される。また、`release`タスクの一部としても実行される。開発者が手動でブラウザテストを実行したい場合にも使用される。

**主要な処理内容**：
1. 簡易HTTPサーバーの起動（ポート8080）
2. テストHTMLページ（`docs/vX/test.html`）の提供
3. モダンブラウザコンパイラ（ESモジュール）の提供
4. Puppeteerによるヘッドレスブラウザの起動
5. テストページへのナビゲーション
6. テスト結果要素の待機（最大60秒）
7. テスト結果の抽出と評価
8. ブラウザとサーバーのクリーンアップ

**前後の処理との関連**：このタスクを実行する前に、`build:browser`タスクまたは`doc:test`タスクが実行され、テストHTMLページとブラウザコンパイラが生成されている必要がある。`build:browser:full`タスクでは、`build:browser`の後にこのテストが実行される。

**影響範囲**：テスト実行のみで、ソースコードやビルド成果物への変更は行わない。テスト失敗時はプロセスがエラーコード1で終了する。ポート8080を一時的に使用するため、他のサービスと競合する可能性がある。

## バッチ種別

品質検証 / ブラウザテスト

## 実行スケジュール

| 項目 | 内容 |
|-----|------|
| 実行頻度 | 随時（手動または自動） |
| 実行時刻 | 任意 |
| 実行曜日 | 任意 |
| 実行日 | 任意 |
| トリガー | 手動実行 / 他タスクからの呼び出し（build:browser:full, release） |

## 実行条件

### 前提条件

| 条件 | 説明 |
|-----|------|
| Node.js環境 | Node.js v6以上がインストールされていること |
| Puppeteer | devDependencyとしてpuppeteerがインストールされていること |
| ビルド済みブラウザコンパイラ | `docs/vX/browser-compiler-modern/coffeescript.js`が存在すること |
| テストHTML | `docs/vX/test.html`が生成されていること |
| ポート8080 | ポート8080が使用可能であること |

### 実行可否判定

特別な実行可否判定ロジックはない。前提条件が満たされていない場合は実行時エラーとなる。

## 入力仕様

### 入力パラメータ

| パラメータ名 | 型 | 必須 | デフォルト値 | 説明 |
|-------------|-----|-----|-------------|------|
| なし | - | - | - | Cakefileタスクとして定義されており、追加パラメータは受け付けない |

### 入力データソース

| データソース | 形式 | 説明 |
|-------------|------|------|
| docs/vX/test.html | HTML | テスト実行用HTMLページ |
| docs/vX/browser-compiler-modern/coffeescript.js | JavaScript (ESモジュール) | モダンブラウザ向けCoffeeScriptコンパイラ |
| test/*.coffee | CoffeeScript | HTMLに埋め込まれたテストコード |

## 出力仕様

### 出力データ

| 出力先 | 形式 | 説明 |
|-------|------|------|
| 標準出力 | テキスト | テスト結果（成功/失敗メッセージ） |
| プロセス終了コード | 数値 | 成功時: 0、失敗時: 1 |

### 出力ファイル仕様

ファイル出力は行わない。

## 処理フロー

### 処理シーケンス

```
1. HTTPサーバーの作成
   └─ ポート8080で待ち受け開始
   └─ ルートパス（/）でtest.htmlを提供
   └─ /browser-compiler-modern/coffeescript.jsでモダンコンパイラを提供

2. サーバー起動完了コールバック
   └─ Puppeteerモジュールの読み込み
   └─ ヘッドレスブラウザの起動

3. ブラウザ操作
   └─ 新規ページの作成
   └─ http://localhost:8080/へナビゲーション
   └─ #result要素の出現を待機（タイムアウト60秒）
   └─ 結果テキストの抽出

4. 結果評価
   └─ テスト結果に"failed"が含まれるかチェック
   └─ 成功時は緑色で結果を出力
   └─ 失敗時は赤色で結果を出力し、exit code 1

5. クリーンアップ
   └─ ブラウザの終了
   └─ HTTPサーバーの停止
```

### フローチャート

```mermaid
flowchart TD
    A[バッチ開始] --> B[HTTPサーバー作成]
    B --> C[ポート8080で起動]
    C --> D[Puppeteer読み込み]
    D --> E[ヘッドレスブラウザ起動]
    E --> F[新規ページ作成]
    F --> G[テストページへナビゲーション]
    G --> H[#result要素待機]
    H --> I{タイムアウト?}
    I -->|タイムアウト| J[エラー出力]
    I -->|要素検出| K[結果テキスト抽出]
    K --> L{failedを含む?}
    L -->|含む| M[失敗メッセージ出力]
    L -->|含まない| N[成功メッセージ出力]
    J --> O[ブラウザ終了]
    M --> O
    N --> O
    O --> P[サーバー停止]
    P --> Q{テスト成功?}
    Q -->|成功| R[バッチ終了]
    Q -->|失敗| S[exit code 1で終了]
```

## データベース操作仕様

### 操作別データベース影響一覧

データベース操作は行わない。

## エラー処理

### エラーケース一覧

| エラーコード | エラー種別 | 発生条件 | 対処方法 |
|------------|----------|---------|---------|
| - | タイムアウトエラー | 60秒以内に#result要素が出現しない | ブラウザコンパイラまたはテストコードの問題を調査 |
| - | ナビゲーションエラー | テストページへのアクセス失敗 | HTTPサーバーの起動状態とポート競合を確認 |
| - | テスト失敗 | テスト結果に"failed"が含まれる | 失敗したテストケースを特定し修正 |
| - | Puppeteer起動エラー | Chromiumの起動失敗 | Puppeteerの依存関係を確認 |

### リトライ仕様

| 項目 | 内容 |
|-----|------|
| リトライ回数 | なし |
| リトライ間隔 | - |
| リトライ対象エラー | - |

### 障害時対応

エラー発生時は、try-catchブロックでエラーをキャッチし、赤色でエラーメッセージを出力する。その後、finallyブロックでブラウザとサーバーのクリーンアップを確実に行う。

## トランザクション仕様

| 項目 | 内容 |
|-----|------|
| トランザクション範囲 | なし（データベース操作なし） |
| コミットタイミング | - |
| ロールバック条件 | - |

## パフォーマンス要件

| 項目 | 内容 |
|-----|------|
| 想定処理件数 | 1回のブラウザテスト実行 |
| 目標処理時間 | 60秒以内（タイムアウト設定） |
| メモリ使用量上限 | Puppeteer/Chromiumの標準使用量 |

## 排他制御

ポート8080を使用するため、同時に複数のテストプロセスを実行することはできない。ポート競合が発生した場合はサーバー起動時にエラーとなる。

## ログ出力

| ログ種別 | 出力タイミング | 出力内容 |
|---------|--------------|---------|
| 開始ログ | なし | - |
| 進捗ログ | build:browser:full実行時 | "built ... running browser tests:" |
| 終了ログ | テスト完了時 | テスト結果文字列 |
| エラーログ | エラー発生時 | エラー内容（赤色出力） |

## 監視・アラート

| 監視項目 | 閾値 | アラート先 |
|---------|-----|----------|
| 終了コード | 0以外 | CI/CDパイプライン |
| 処理時間 | 60秒 | タイムアウトエラー |

## 備考

- このテストはモダンブラウザ向けのESモジュール形式コンパイラを対象としている
- レガシーブラウザコンパイラ（IIFE形式）のテストには`test:browser:node`タスクを使用する
- Puppeteerはdevdependencyとして`~13.6.0`が指定されている
- テストHTMLは`doc:test`タスクで生成され、全テストファイルが`<script>`タグとして埋め込まれている
- ESモジュールとして読み込むため、MIMEタイプは`text/javascript`で提供される
