Browser Testing With Devtools

Chrome DevTools MCP を介して実際のブラウザでテストを実行します。ブラウザで動作するものの構築やデバッグ時に使用します。DOM の検査、コンソールエラーのキャプチャ、ネットワークリクエストの分析、パフォーマンスのプロファイリング、または実際のランタイムデータによる視覚的出力の検証が必要な場合に使用してください。chrome-devtools MCP サーバーの設定が必要です。

概要

Chrome DevTools MCP を使用して、エージェントにブラウザ内を確認する機能を提供します。これにより、静的コード解析と実際のブラウザ実行の間のギャップを埋めることができます。エージェントはユーザーが見ているものを確認し、DOM を検査し、コンソールログを読み取り、ネットワークリクエストを分析し、パフォーマンスデータを取得できます。実行時に何が起きているかを推測するのではなく、実際に検証してください。

ユースケース

Browser Testing With Devtools を、繰り返し利用可能なコーディングワークフローとして適用します。
インストール前に、ソースの指示と同梱のリソースを評価します。
互換性のある Agent Skills ランタイムでこのスキルを使用します。

導入方法

# Review source first
open https://github.com/addyosmani/agent-skills/blob/main/skills/browser-testing-with-devtools/SKILL.md

確認済みのスキルフォルダを、互換性のあるエージェントが使用する skills ディレクトリにコピーしてください。

セキュリティ

AIToolly は公開されたソース構造とライセンスを自動的に検証しました。ワークスペース、コマンド、またはネットワークへのアクセスを許可する前に、addyosmani/agent-skills と同梱のスクリプトを再度確認してください。

関連Skills