# バッチ設計書 31-e2e-nextjs-10

## 概要

本ドキュメントは、Next.js 10環境でBabelの互換性をテストするE2Eバッチ「e2e-nextjs-10」の設計仕様を定義するものである。

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

本バッチは、Next.js 10フレームワーク環境においてBabelが正常に動作することを検証するEnd-to-Endテストを実行する。

**業務上の目的・背景**：Next.jsはReactベースのフレームワークとして広く採用されており、Babelとの互換性は開発者のユーザーエクスペリエンスに直結する。Next.js 10は特定バージョンのwebpack（4.44）を使用しており、OpenSSLの互換性問題など固有の課題があるため、独立したE2Eテストとして検証が必要である。

**バッチの実行タイミング**：mainブランチへのpush時、およびPull Request作成時に自動実行される。ただし、現在はE2Eテストマトリクスではコメントアウトされており、必要に応じて手動で有効化される。

**主要な処理内容**：
1. create-next-appコマンドでNext.js 10プロジェクトを作成（with-custom-babel-config テンプレート使用）
2. ローカルVerdaccioレジストリを起動し、ローカルビルドのBabelパッケージを利用可能にする
3. 依存関係をインストール（npm install --ignore-scripts）
4. Next.jsのビルドエラー出力を改善するためのパッチを適用
5. NODE_OPTIONS=--openssl-legacy-provider を設定してwebpack 4.44の互換性問題を回避
6. npm run buildでNext.jsプロジェクトをビルドし、Babelの動作を検証

**前後の処理との関連**：e2e-publishジョブが事前に完了している必要がある。e2e-publishでVerdaccioレジストリにBabelパッケージが公開され、そのアーティファクトを利用してテストを実行する。

**影響範囲**：Next.js 10を使用するプロジェクトでのBabel互換性に影響する。テスト結果はCIパイプライン全体の成否に関わる。

## バッチ種別

E2Eテスト（End-to-End Integration Test）

## 実行スケジュール

| 項目 | 内容 |
|-----|------|
| 実行頻度 | イベント駆動 |
| 実行時刻 | 該当なし（イベント発生時） |
| 実行曜日 | 該当なし |
| 実行日 | 該当なし |
| トリガー | push（mainブランチ）/ pull_request / 手動 |

## 実行条件

### 前提条件

| 条件 | 説明 |
|-----|------|
| e2e-publishジョブ完了 | Verdaccioレジストリへのパッケージ公開が完了していること |
| verdaccio-workspaceアーティファクト | /tmp/verdaccio-workspace.tar が利用可能であること |
| Node.js環境 | Node.js最新版がインストールされていること |
| npm/npx | npmおよびnpxコマンドが利用可能であること |

### 実行可否判定

e2e-testsワークフロー内のmatrix.projectに「nextjs-10」が含まれている場合に実行される。現在はコメントアウトされているため、手動で有効化が必要。

## 入力仕様

### 入力パラメータ

| パラメータ名 | 型 | 必須 | デフォルト値 | 説明 |
|-------------|-----|-----|-------------|------|
| なし | - | - | - | スクリプトは固定パラメータで実行 |

### 入力データソース

| データソース | 形式 | 説明 |
|-------------|------|------|
| verdaccio-workspace.tar | tarアーカイブ | ローカルVerdaccioレジストリのワークスペース |
| fixtures/nextjs-10/ | ディレクトリ | Next.js 10テスト用のフィクスチャファイル |
| verdaccio-config.yml | YAML | Verdaccioレジストリの設定ファイル |

## 出力仕様

### 出力データ

| 出力先 | 形式 | 説明 |
|-------|------|------|
| 標準出力 | テキスト | ビルドログおよびテスト結果 |
| 終了コード | 数値 | 0: 成功、非0: 失敗 |

### 出力ファイル仕様

| 項目 | 内容 |
|-----|------|
| ファイル名 | なし（標準出力のみ） |
| 出力先 | GitHub Actions ログ |
| 文字コード | UTF-8 |
| 区切り文字 | 該当なし |

## 処理フロー

### 処理シーケンス

```
1. スクリプトディレクトリへ移動
   └─ scripts/integration-tests/ を作業ディレクトリに設定
2. ユーティリティスクリプト読み込み
   └─ local-registry.sh と cleanup.sh を source
3. Next.js 10プロジェクト作成
   └─ npx create-next-app@^10 --example with-custom-babel-config /tmp/nextjs-10
4. フィクスチャファイルのコピー
   └─ fixtures/nextjs-10/. の内容を /tmp/nextjs-10 にコピー
5. プロジェクトディレクトリへ移動
   └─ cd /tmp/nextjs-10
6. ローカルVerdaccioレジストリ起動
   └─ startLocalRegistry関数を実行
7. 依存関係インストール
   └─ npm install --ignore-scripts
8. Next.jsビルドエラー出力パッチ適用
   └─ sedコマンドでnode_modules/next/dist/build/index.jsを修正
9. 環境変数設定
   └─ NODE_OPTIONS=--openssl-legacy-provider を設定
10. ビルド実行
    └─ npm run build
11. 環境変数リセット
    └─ NODE_OPTIONSをエクスポート解除
12. クリーンアップ
    └─ cleanup関数を実行
```

### フローチャート

```mermaid
flowchart TD
    A[バッチ開始] --> B[作業ディレクトリ設定]
    B --> C[ユーティリティ読み込み]
    C --> D[Next.js 10プロジェクト作成]
    D --> E[フィクスチャコピー]
    E --> F[ローカルレジストリ起動]
    F --> G[npm install]
    G --> H[ビルドエラー出力パッチ適用]
    H --> I[NODE_OPTIONS設定]
    I --> J[npm run build]
    J --> K{ビルド成功?}
    K -->|成功| L[環境変数リセット]
    K -->|失敗| M[エラー終了]
    L --> N[クリーンアップ]
    N --> O[バッチ終了]
    M --> O
```

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

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

本バッチはデータベース操作を行わない。

## エラー処理

### エラーケース一覧

| エラーコード | エラー種別 | 発生条件 | 対処方法 |
|------------|----------|---------|---------|
| 1 | create-next-app失敗 | Next.jsプロジェクト作成に失敗 | ネットワーク接続確認、npxキャッシュクリア |
| 1 | npm install失敗 | 依存関係のインストールに失敗 | Verdaccioレジストリ起動状態確認 |
| 1 | ビルド失敗 | Next.jsビルドが失敗 | ビルドログを確認、Babel互換性問題を調査 |

### リトライ仕様

| 項目 | 内容 |
|-----|------|
| リトライ回数 | なし（自動リトライなし） |
| リトライ間隔 | 該当なし |
| リトライ対象エラー | 該当なし |

### 障害時対応

1. GitHub Actionsのログを確認してエラー箇所を特定
2. ローカル環境でスクリプトを実行して再現確認
3. webpack/OpenSSL互換性問題の場合はNODE_OPTIONS設定を確認
4. Verdaccioレジストリの起動状態とパッケージ公開状況を確認

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

| 項目 | 内容 |
|-----|------|
| トランザクション範囲 | 該当なし |
| コミットタイミング | 該当なし |
| ロールバック条件 | 該当なし |

## パフォーマンス要件

| 項目 | 内容 |
|-----|------|
| 想定処理件数 | 1プロジェクト |
| 目標処理時間 | 10分以内 |
| メモリ使用量上限 | 該当なし（CI環境依存） |

## 排他制御

GitHub Actionsのconcurrency設定により、同一ワークフロー・同一refでの並行実行は自動的にキャンセルされる。

## ログ出力

| ログ種別 | 出力タイミング | 出力内容 |
|---------|--------------|---------|
| 開始ログ | バッチ開始時 | set -x によるコマンドエコー |
| 進捗ログ | 各コマンド実行時 | 実行コマンドと出力結果 |
| 終了ログ | バッチ終了時 | 終了ステータス |
| エラーログ | エラー発生時 | Next.jsビルドエラー詳細 |

## 監視・アラート

| 監視項目 | 閾値 | アラート先 |
|---------|-----|----------|
| ジョブ実行時間 | 30分 | GitHub Actions UI |
| ジョブ失敗 | 1回 | Pull Request ステータス |

## 備考

- Next.js 10はwebpack 4.44を使用しており、これはNode.js 17以降でOpenSSL互換性問題（ERR_OSSL_EVP_UNSUPPORTED）が発生する
- NODE_OPTIONS=--openssl-legacy-provider の設定により、この問題を回避している
- 現在、e2e-testsワークフローのマトリクスではnextjs-10はコメントアウトされており、必要に応じて有効化する運用となっている
