visual-debugger
✓Playwright ブラウザ自動化を使用した対話型のビジュアル デバッグ。 Web サイト/アプリの視覚的な検査、UI 要素のテスト、ボタンの機能の検証、レスポンシブ デザインのチェック、レイアウトの問題のデバッグ、コンソール エラーの監視、またはブラウザベースの視覚テストの実行を求められた場合に使用します。一般的なトリガーには、ボタンが機能するかどうかの確認、ページの読み込みの確認、フォームのテスト、要素の検査、ページのデバッグ、URL への移動と動作の確認などのリクエスト、またはブラウザーの視覚的な検査とテストを伴うリクエストが含まれます。
SKILL.md
Interactive visual debugging tool using Playwright MCP browser automation to inspect, test, and debug web applications and websites.
Before using this skill, verify Playwright MCP tools are available:
Security Note: Never hardcode real credentials. Ask user for test credentials or use environment variables.
Playwright ブラウザ自動化を使用した対話型のビジュアル デバッグ。 Web サイト/アプリの視覚的な検査、UI 要素のテスト、ボタンの機能の検証、レスポンシブ デザインのチェック、レイアウトの問題のデバッグ、コンソール エラーの監視、またはブラウザベースの視覚テストの実行を求められた場合に使用します。一般的なトリガーには、ボタンが機能するかどうかの確認、ページの読み込みの確認、フォームのテスト、要素の検査、ページのデバッグ、URL への移動と動作の確認などのリクエスト、またはブラウザーの視覚的な検査とテストを伴うリクエストが含まれます。 ソース: jarrodmedrano/jarrod-claude-skills。
引用可能な情報
AI/検索での引用用の安定したフィールドとコマンド。
- インストールコマンド
npx skills add https://github.com/jarrodmedrano/jarrod-claude-skills --skill visual-debugger- カテゴリ
- *クリエイティブ
- 認証済み
- ✓
- 初回登録
- 2026-02-01
- 更新日
- 2026-02-18
クイックアンサー
visual-debugger とは？
Playwright ブラウザ自動化を使用した対話型のビジュアル デバッグ。 Web サイト/アプリの視覚的な検査、UI 要素のテスト、ボタンの機能の検証、レスポンシブ デザインのチェック、レイアウトの問題のデバッグ、コンソール エラーの監視、またはブラウザベースの視覚テストの実行を求められた場合に使用します。一般的なトリガーには、ボタンが機能するかどうかの確認、ページの読み込みの確認、フォームのテスト、要素の検査、ページのデバッグ、URL への移動と動作の確認などのリクエスト、またはブラウザーの視覚的な検査とテストを伴うリクエストが含まれます。 ソース: jarrodmedrano/jarrod-claude-skills。
visual-debugger のインストール方法は？
ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/jarrodmedrano/jarrod-claude-skills --skill visual-debugger インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります
ソースリポジトリはどこですか？
https://github.com/jarrodmedrano/jarrod-claude-skills
詳細
- カテゴリ
- *クリエイティブ
- ソース
- skills.sh
- 初回登録
- 2026-02-01