コーディング自動化基盤

概要¶

このチケットは「実装+テスト」セットテンプレートのサンプルです。フロントエンドコンポーネントの実装と、それに対応する単体テストを含んでいます。

実装要件¶

1. コンポーネント仕様

   • 名称: UserRegistrationForm
   • フレームワーク: React + TypeScript
   • スタイル: Material-UI + TailwindCSS（LINEデザイン言語準拠）
   • 入力フィールド:
     • ユーザー名（必須）
     • メールアドレス（必須、形式検証）
     • パスワード（必須、8文字以上、強度表示）
     • パスワード確認（一致検証）
   • ボタン:
     • 登録ボタン（バリデーション通過時のみ有効）
     • キャンセルボタン

2. 機能要件

   • リアルタイムバリデーション
   • フォーム送信処理
   • ローディング状態表示
   • エラーメッセージ表示
   • 成功時のリダイレクト/メッセージ

3. UI/UX要件

   • レスポンシブデザイン
   • アクセシビリティ対応（ARIA属性、キーボード操作）
   • エラー状態のビジュアルフィードバック
   • パスワード強度インジケーター
   • 入力補助機能（ツールチップ、ヘルプテキスト）

テスト要件¶

1. 単体テスト項目

   • コンポーネントのレンダリングテスト
   • 入力フィールドの動作テスト
     • 値の入力と変更
     • バリデーションメッセージの表示
   • フォーム送信テスト
     • API呼び出しの検証
     • 送信中の状態検証
     • 成功/エラー時の動作検証
   • UI状態テスト
     • ボタンの有効/無効状態
     • エラーメッセージ表示
     • ローディングインジケーター

2. テスト技術

   • Jest + React Testing Library
   • ユーザーイベントシミュレーション
   • APIモック（MSW等）
   • スナップショットテスト
   • カバレッジ計測（目標: 90%以上）

依存関係¶

• フロントエンド基盤構築が完了していること
• APIエンドポイントが定義されていること
• 認証コンテキスト/フックが実装されていること

完了条件¶

1. 実装コードがコードレビューを通過
2. 単体テストが全て成功
3. テストカバレッジが目標値を達成
4. デザインガイドラインに準拠していることを確認
5. アクセシビリティ要件を満たしていること

親チケット¶

• ユーザー管理システム実装（フロントエンド）

担当者¶

• 実装担当:
• テスト担当:
• レビュー担当:

注意事項¶

• このチケットは実装とテストを一体で管理します
• 実装完了後、テストを作成し、両方が完了したらクローズします
• テスト先行開発（TDD）も可能です
• LINEデザイン言語に準拠したスタイリングを適用してください