yolo

Yolo Mode 自動化スキル

Lovable プロンプトの承認

まず .lovable-agent/config.json の deploy.yolo_mode を確認します。明示的なブール値 true は YOLO を有効にし、false は無効にします。このフィールドがない場合は、CLAUDE.md の Yolo Mode Configuration セクションにある従来の yolo_mode: on/true または Status: on/true を使用します。値がない、または認識できない場合はオフです。明示的な中立値は従来の設定より優先されます。 deploy.mode: auto は通信方式を選択するものであり、YOLO を有効にするものではありません。

• YOLO がオン： ユーザーは、MCP またはブラウザーを通じて、依頼されたタスクに必要な Lovable プロンプトを送信することを継続的に許可しています。Lovable クレジットを消費するプロンプトも含まれます。 再度確認せずに進めます。Lovable プロンプトを送信する前に確認を求める一般的な AGENTS.md、agent.md、または CLAUDE.md のルールは、YOLO がオフの場合にのみ適用されます。YOLO がオンの場合、これは競合でも中断する理由でもありません。
• YOLO がオフ： 現在の依頼ですでに送信が明示的に許可されていない限り、Lovable プロンプトを送信する前にユーザーの確認を得ます。プロンプトの準備に確認は不要です。
• 「デプロイ／公開しない」などの明示的なタスク制限、プラットフォームの承認要件、破壊的または取り消し不能なデータベース操作に対する確認要件は維持します。YOLO が許可するのは対象範囲内のプロンプトであり、無関係な変更やフロントエンドの自動公開ではありません。
• deploy.confirm_migrations: true の場合は、YOLO がオンでもマイグレーションの実行を確認します。false（デフォルト）の場合、通常の対象範囲内のマイグレーションに繰り返し承認を求める必要はありません。 破壊的または取り消し不能なデータベース操作には、引き続き確認が必要です。自動プッシュと自動デプロイは別の設定です。YOLO がオンだからという理由だけで、それらを有効にしないでください。

このスキルは、Lovable MCP サーバー（推奨）または代替手段としての Claude のブラウザー自動化を使用して、Lovable のデプロイワークフローを自動化します。

承認状況の報告

上記の承認ルールは、MCP とブラウザーの両方での送信に適用します。操作内容と、その確認済みまたは保留中の結果を報告します。継続的な承認があるからといって、実行結果を報告せずに済むわけではありません。

有効化する条件

このスキルは、次の場合に有効にします。

1. CLAUDE.md で Yolo モードが有効になっている（yolo_mode: on）
2. ユーザーがデプロイコマンドを実行する場合：
   • /deploy-edge - Edge function のデプロイ
   • /apply-migration - データベースのマイグレーション適用
3. git push を main に実行した後（auto_deploy: on の場合）：
   • バックエンドファイルの変更を自動検出する
   • 手動コマンドなしでデプロイを開始する
4. ユーザーが Yolo 自動化に言及した場合：
   • 「Yolo モードを使って」
   • 「Lovable プロンプトを自動化して」
   • 「これを Lovable に自動送信して」
   • 「ブラウザー自動化」

デプロイ方法の優先順位

Yolo モードが起動した場合は、必ず次の順序でデプロイ方法を選択します。

1. Lovable MCP（推奨）

Lovable MCP ツール（Lovable MCP コネクターの send_message など）が利用可能か確認します。

• 利用可能な場合：MCP ワークフロー（references/mcp-workflows.md）を使用します。

  • CLAUDE.md の lovable_url からプロジェクト ID を抽出する
  • send_message(project_id, prompt) を呼び出す
  • 非同期の場合は応答をポーリングする
  • 設定に従って検証テストを実行する

• 推奨する理由：3～5 倍高速で、Chrome 拡張機能が不要なうえ、UI の変更の影響を受けません。

2. ブラウザー自動化（代替手段）

MCP が利用できない場合、または CLAUDE.md で Deployment Method: browser が設定されている場合：

• Claude のブラウザー自動化（references/automation-workflows.md）を使用する
• Lovable に移動し、チャットインターフェースからプロンプトを送信する
• 応答を監視する

3. 手動プロンプト（最後の手段）

MCP とブラウザー自動化の両方が失敗した場合：

• Lovable にコピーして貼り付けられるよう、デプロイプロンプトをユーザーに提示する
• ユーザーの作業を止めないでください。必ず手動で実行できる代替手段を提示します

デプロイ方法の確認

CLAUDE.md の Yolo Mode Configuration セクションから Deployment Method を読み取ります。

• auto（デフォルト）：まず MCP を試し、次にブラウザーを使用する
• mcp：MCP のみを使用し、失敗した場合は手動プロンプトに切り替える（ブラウザーは使用しない）
• browser：ブラウザー自動化のみを使用する（MCP の確認は省略する）

パフォーマンスの最適化

モデルの選択（ハイブリッド方式）

速度と信頼性を最適化するには、タスクごとに異なるモデルを使用します。

以下には Haiku を使用します：

• 参照を使った要素のクリック（単純で決定的な操作）
• フォーム入力操作（form_input ツールの呼び出し）
• キーの押下と単純なナビゲーション
• 待機／ポーリング操作
• find ツールを使った単純な要素検索

以下には Sonnet を使用します：

• ナビゲーション後の初回のページ理解
• エラーの検出とリカバリーの判断
• Lovable の応答からの成功／失敗の解析
• 想定外のことが起きた場合の次のステップの判断
• 複雑なページ状態の分析

重要な理由：

• Haiku は単純な操作で 3～5 倍高速です
• Sonnet は複雑な推論において、より高い信頼性を発揮します
• ハイブリッド方式により、速度と精度の両方を最大限に活用できます

ツールの優先設定

以下のツールを常に優先してください：

• 要素の位置特定には、スクリーンショットより find と read_page
• 入力値の設定には、クリック＋入力より form_input
• クリックには、座標より ref パラメーター
• スクリーンショットベースの監視より DOM ポーリング

詳しい実装については、references/automation-workflows.md を参照してください。

---

主な機能

1. 自動検出

yolo モードが有効な場合、Lovable のプロンプトが必要になるタイミングを自動的に検出します。

Edge Function のデプロイ：

• supabase/functions/ 内のファイルが変更された
• 変更がコミットされ、main にプッシュされた
• デプロイ用プロンプトが生成される

マイグレーションの適用：

• supabase/migrations/ に新しいファイルが追加された
• 変更がコミットされ、main にプッシュされた
• マイグレーション用プロンプトが生成される

検出条件の詳細については、references/detection-logic.md を参照してください。

1.5. Git Push 後の自動デプロイ（新機能）

auto_deploy: on が有効な場合、Claude は成功した git push の後にバックエンドの変更を自動的に検出し、デプロイします。

トリガー： git push origin main の成功

検出：

1. プッシュで変更されたファイルを分析する
2. supabase/functions/ または supabase/migrations/ に変更があるか確認する
3. バックエンドファイルが見つかり、かつ auto_deploy が有効な場合 → 自動化を開始する

フロー：

git push origin main [succeeds]
    ↓
Claude detects backend file changes
    ↓
Check: yolo_mode: on AND auto_deploy: on
    ↓
🤖 "Auto-deploy: Backend changes detected, starting deployment..."
    ↓
Execute browser automation
    ↓
Run verification tests
    ↓
Show deployment summary

正常なフォールバック： 自動デプロイが何らかの理由で失敗した場合：

• 明確なエラーメッセージを表示する
• フォールバックとして手動プロンプトを提示する
• ユーザーの操作を妨げない

実装の全容については、references/post-push-automation.md を参照してください。

2. デプロイの実行

デプロイが必要な場合、選択した方法に基づいて実行します。

MCP 方式：

1. CLAUDE.md の lovable_url からプロジェクト ID を抽出する
2. デプロイ用プロンプトを使って Lovable MCP の send_message を呼び出す
3. 応答が非同期の場合は、完了するまでポーリングする
4. 応答から成功／失敗を解析する

MCP ワークフローの詳細については、references/mcp-workflows.md を参照してください。

ブラウザー自動化方式：

1. Lovable に移動する

   • CLAUDE.md から lovable_url を読み取る
   • ブラウザーを開き、プロジェクトに移動する
   • 必要に応じてログインする

2. プロンプトを送信する

   • チャット入力要素を特定する
   • 生成された Lovable プロンプトを入力する
   • 送信し、メッセージが送られたことを確認する

3. 応答を監視する

   • Lovable の応答を待つ
   • 成功を示す情報を確認する
   • エラーや警告を検出する
   • 3 分後にタイムアウトする

ブラウザー自動化の詳しい手順については、references/automation-workflows.md を参照してください。

3. テストと検証

デプロイが成功した後、yolo_testing の設定に基づいてテストを実行します。

yolo_testing: on の場合（デフォルト）：

• レベル 1：基本的な検証（Lovable でログを確認）
• レベル 2：コンソールエラーの確認（本番 URL を監視）
• レベル 3：機能テスト（エンドポイント／クエリをテスト）

yolo_testing: off の場合：

• すべてのテストをスキップします
• Lovable の応答からデプロイの成功のみを確認します

レベル 4（任意）：プレビューテスト計画 プロジェクトでプレビューテストが有効になっており（CLAUDE.md → プレビューテストの設定）、Test After Deploy が smoke または all に設定されている場合は、デプロイの検証後に Lovable プレビューアプリで該当するテスト計画を実行します。これは テストスキル（skills/testing/SKILL.md）で処理されます。これは /lovable:test-run --smoke（または --all）と同等です。

テストワークフローの詳細については、references/testing-procedures.md を参照してください。

4. デバッグモード

yolo_debug: on の場合は、詳細な出力を表示します。

🐛 DEBUG: Browser Automation

Step 1: Navigating to Lovable
  URL: https://lovable.dev/projects/abc123
  Wait for: Page load complete
  ✅ Success (1.2s)

Step 2: Locating chat interface
  Selector: textarea[data-testid="chat-input"]
  Wait for: Element interactable
  ✅ Found (0.3s)

Step 3: Typing prompt
  Text: "Deploy the send-email edge function"
  ✅ Typed (0.5s)

Step 4: Submitting
  Action: Press Enter
  ✅ Submitted (0.1s)

Step 5: Monitoring response
  Watching for: New message from assistant
  Timeout: 180s
  ✅ Response received (4.2s)

Response content:
"I'll deploy the send-email edge function now..."
[full response text]

Success keywords detected: ['deploy', 'function']
No error keywords found

CLAUDE.md での設定

このスキルは CLAUDE.md から次のフィールドを読み取ります。

## Yolo Mode Configuration (Beta)

- **Status**: on
- **Deployment Method**: auto
- **Auto-Deploy**: on
- **Deployment Testing**: on
- **Auto-run Tests**: off
- **Debug Mode**: off
- **Last Updated**: 2025-01-03 10:30:00

設定オプション：

• ステータス：yolo モード全体の有効化／無効化
• デプロイ方法：auto（まず MCP、次にブラウザー）、mcp（MCP のみ）、または browser（ブラウザーのみ）
• 自動デプロイ：git push 後に自動デプロイ（手動コマンドは不要）
• デプロイテスト：デプロイ後に検証テストを実行
• テストの自動実行：git push 後にプロジェクトのテストスイートを実行
• デバッグモード：自動化の詳細なログを表示

また、プロジェクト概要から次のフィールドを読み取ります。

- **Lovable Project URL**: https://lovable.dev/projects/abc123
- **Production URL**: https://my-app.lovable.app

ユーザーへの通知

進捗の更新

自動化の進行状況をリアルタイムで表示します。

MCP モード（デバッグオフ）：

🤖 Yolo mode (MCP): Deploying send-email edge function

⏳ Sending deployment prompt via Lovable MCP...
✅ Deployment confirmed by Lovable (3.1s)
⏳ Running verification tests...
✅ All tests passed

ブラウザーモード（デバッグオフ）：

🤖 Yolo mode: Deploying send-email edge function

⏳ Step 1/8: Navigating to Lovable project...
⏳ Step 2/8: Waiting for GitHub sync...
✅ Step 3/8: Sync verified - Lovable has latest code
✅ Step 4/8: Located chat interface
✅ Step 5/8: Submitted prompt
⏳ Step 6/8: Waiting for Lovable response...
✅ Step 7/8: Deployment confirmed
⏳ Step 8/8: Running verification tests...
✅ Step 8/8: All tests passed

デバッグモード（デバッグオン）： タイミング、セレクター、完全な応答を含む詳細なログを表示します。

デプロイの概要

自動化の完了後：

## Deployment Summary

**Operation:** Edge Function Deployment
**Function:** send-email
**Status:** ✅ Success
**Duration:** 45 seconds

**Automation Steps:**
1. ✅ Navigated to Lovable
2. ✅ Submitted deployment prompt
3. ✅ Received deployment confirmation

**Verification Tests:** (if testing enabled)
1. ✅ Basic verification: Deployment logs show no errors
2. ✅ Console check: No errors at production URL
3. ✅ Functional test: Function endpoint responds (200 OK)

**Production Status:**
- Function is live and responding
- No errors detected
- Ready for use

💡 Yolo mode is enabled. I'll continue automating deployments.
   Run `/yolo off` to disable.

エラー処理

自動化に失敗した場合は、すべて手動プロンプトに適切にフォールバックします。

よくあるエラー

MCP に接続されていない（auto モード — 次にブラウザーを試します）：

⚠️ Lovable MCP not connected - trying browser automation...
[continues with browser automation]

MCP に接続されていない（mcp-only モード）：

❌ Lovable MCP not available

Deployment Method is set to "mcp" but Lovable MCP tools are not connected.

To connect: /lovable:connect-mcp
To use browser automation instead: /lovable:yolo on --browser

Fallback - run this prompt manually in Lovable:
📋 "Deploy the send-email edge function"

ブラウザー自動化を利用できない：

❌ Browser automation unavailable

Yolo mode requires the Claude in Chrome extension.

Install: https://chrome.google.com/webstore/detail/claude/...

Tip: Use Lovable MCP instead (no extension needed):
  /lovable:connect-mcp

Fallback - run this prompt manually in Lovable:
📋 "Deploy the send-email edge function"

ログインが必要：

🔐 Please log in to Lovable

The browser opened to your Lovable project, but you're not logged in.
Please log in and I'll retry automatically.

Or run this prompt manually:
📋 "Deploy the send-email edge function"

UI 要素が見つからない：

❌ Could not locate Lovable chat interface

The Lovable UI may have changed since this plugin was created.

Fallback - run this prompt manually in Lovable:
📋 "Deploy the send-email edge function"

💡 Please report this issue at:
   https://github.com/10K-Digital/lovable-agent-skills/issues

タイムアウト：

⏱️ Lovable hasn't responded after 3 minutes

The operation may still be processing.
Please check Lovable manually to verify status.

Prompt that was submitted:
📋 "Deploy the send-email edge function"

デプロイに失敗：

❌ Deployment failed in Lovable

Error from Lovable:
[captured error message]

Suggested fixes:
- Check function code for syntax errors
- Verify required secrets are set in Cloud → Secrets
- Review function logs in Lovable

Would you like me to:
1. Review the function code for issues
2. Check if secrets are documented in CLAUDE.md
3. Show you how to access logs in Lovable

適切な縮退動作

自動化に失敗した場合：

1. エラーの詳細を記録します
2. ユーザーにわかりやすいエラーメッセージを表示します
3. フォールバックとして手動プロンプトを提示します
4. トラブルシューティングの手順を提案します
5. エラーが続く場合は、yolo モードを無効にする方法を案内します

エラーを決して黙って無視しないでください。必ずユーザーに知らせ、手動での選択肢を提示してください。

他のコマンドとの連携

/deploy-edge

yolo モードがオンの場合、/deploy-edge はブラウザー自動化を自動的に開始します。

[... existing deploy-edge logic ...]

## Deployment Execution

1. Check yolo mode status from CLAUDE.md

2. If `yolo_mode: on`:
   - Activate yolo skill
   - Execute browser automation workflow
   - Run tests based on `yolo_testing` setting
   - Report results

3. If `yolo_mode: off`:
   - Show manual prompt (current behavior)
   - Suggest enabling yolo mode

/apply-migration

マイグレーションのワークフローでも、deploy-edge と同じパターンを使用します。

/yolo

/yolo コマンドでこのスキルを制御します。

• /yolo on - yolo_mode: on に設定してスキルを有効にします
• /yolo off - スキルを無効にします
• フラグを指定できます：--testing、--no-testing、--debug

ベータ版のステータスと制限事項

ベータ版に関する注意

yolo モードはベータ版です。ユーザーは次の点に注意してください。

✅ 正常に動作する機能：

• MCP（推奨）またはブラウザー経由でのプロンプトの自動送信
• 基本的なデプロイ検証
• 手動でのフォールバックを含むエラー処理

⚠️ 既知の制限事項（MCP モード）：

• Lovable Pro プランが必要です
• 初回の OAuth 設定が必要です（/lovable:connect-mcp）
• send_message 呼び出しで Lovable クレジットを使用します

⚠️ 既知の制限事項（ブラウザーモード）：

• Claude in Chrome 拡張機能が必要です
• Lovable UI の変更により、自動化が動作しなくなる場合があります
• ユーザーが Lovable にログインしている必要があります

⚠️ 共通の制限事項：

• テストにより、デプロイごとに 1～3 分追加でかかります
• エッジ関数とマイグレーションでのみ動作します（テーブル、RLS などは対象外です）

Yolo Mode を推奨する場面

✅ 適している場面：

• 頻繁なデプロイ（時間を節約できます）
• ブラウザーの自動化に慣れているユーザー
• 開発ワークフロー（素早く反復できます）

❌ 適していない場面：

• 単発のデプロイ（手動のほうが速いです）
• 追加のレビューが必要な本番環境へのデプロイ
• Chrome 拡張機能を利用できないユーザー
• ブラウザーにアクセスできない環境

今後の機能強化

まだ実装されていませんが、以下の機能を追加できます。

1. 一括操作

   • 複数のエッジ関数を一度にデプロイ
   • 複数のマイグレーションを順番に適用

2. ロールバックのサポート

   • デプロイの失敗を検出
   • Lovable 経由でのロールバックを提案

3. 監視モード

   • 定期的にログを確認
   • 新しいエラーを通知

4. カスタムテストスクリプト

   • ユーザー定義のテストペイロード
   • CLAUDE.md に保存

5. より幅広い操作のサポート

   • テーブルの作成
   • RLS ポリシー
   • ストレージバケット

参照ファイル

このスキルでは、以下の参照ドキュメントを使用します。

1. references/mcp-workflows.md（新規 — 優先して使用）

   • Lovable MCP の send_message ワークフロー
   • プロジェクト ID の抽出
   • MCP のエラー処理とフォールバック

2. references/automation-workflows.md

   • ブラウザー自動化の手順
   • Lovable UI のナビゲーション
   • 要素セレクターと待機条件

3. references/detection-logic.md

   • 自動化を開始するタイミング
   • ファイル変更の検出
   • コマンドとの連携

4. references/post-push-automation.md

   • git push 後の自動デプロイ
   • 適切なフォールバック処理
   • ユーザー通知のテンプレート

5. references/testing-procedures.md

   • レベル 1：基本的な検証
   • レベル 2：コンソールの確認
   • レベル 3：機能テスト

クイックリファレンス

Yolo Mode が有効かどうかを確認する

1. Read deploy.yolo_mode in .lovable-agent/config.json first
2. Only if absent, fall back to CLAUDE.md Yolo Mode Configuration
3. Apply the authorization rules above; missing/unknown means disabled

自動デプロイが有効かどうかを確認する

1. Read CLAUDE.md
2. Check both "Status: on" AND "Auto-Deploy: on"
3. Both must be enabled for auto-deploy to trigger

自動化を実行する

1. Confirm yolo_mode is on
2. Read Deployment Method from CLAUDE.md (auto / mcp / browser)
3. If auto or mcp:
   - Check if Lovable MCP tools are available
   - If yes → Load mcp-workflows.md and execute MCP workflow
   - If no and auto → fall through to browser
4. If auto or browser:
   - Load automation-workflows.md
   - Execute navigation → submit → monitor workflow
5. Run tests if yolo_testing is on
6. Report results

Git Push 後の自動デプロイ

1. Git push succeeds
2. Check for backend file changes (supabase/functions/, supabase/migrations/)
3. If changes found AND auto_deploy enabled:
   - Trigger automation automatically
   - Show: "🤖 Auto-deploy: Backend changes detected..."
4. If auto_deploy disabled:
   - Show notification only
   - Suggest running /deploy-edge or /apply-migration

エラーを処理する

1. Try automation
2. If fails, capture error
3. Show error + manual fallback prompt
4. Never block user - always provide manual option
5. Suggest troubleshooting based on error type

---

このスキルを使うと、手動でのフォールバックと包括的なテストによって安全性を保ちながら、Lovable のデプロイを手放しで実行できます。