TabbitBlog

Claude in ChromeとPlaywright MCPの使い分け

ログイン状態、サイト権限、実行環境、結果の確かめ方から、Claude in ChromeとPlaywright MCPの用途を比較します。

この記事の内容
  1. 要点
  2. セッションと出力を比較する
  3. 使うセッションに接続する
  4. ブラウザを実行する場所
  5. 同じページと同じ目標で試す
  6. 開いているタブで作業するならTabbit
  7. 用途から選ぶ

承認済みのChromeプロファイルで作業中のページをClaudeに調べてもらうなら Claude in Chrome を使えます。ブラウザ環境を明示して構造化された操作を繰り返したいなら Playwright MCP が候補です。Playwright MCPも専用の拡張機能で既存のChromeやEdgeに接続できます。ログイン状態だけではどちらにするか決まりません。

Claude Code利用者は、入力、情報取得、エラー報告にどちらが適しているか尋ねました。それぞれの作業で結果を確かめる必要があります。

ログイン済みのページを一度調べることと、変更のたびに同じ回帰確認を行うことは別の仕事です。ブラウザエージェントの練習ページを使い、両方の接続方式に求める証拠を揃えます。 開いているタブ内で完結する作業にはTabbit Browserも使えます。

要点

  • どちらもページを操作でき、接続方法や観察する情報が異なります。

  • Playwright MCPで新規セッションにする場合は明示的に設定します。

  • 既存プロファイルを使うと、すでに付与されたアクセスも引き継ぎます。

  • クリックは途中の操作です。画面の最終状態を記録します。

  • 繰り返すテストは、条件とアサーションを先に決めます。

セッションと出力を比較する

比較点Claude in ChromePlaywright MCP
接続承認済みプロファイルのClaude拡張機能MCPクライアントとサーバーからブラウザを起動または接続
セッションプロファイルのログインを利用永続、分離、承認済み既存ブラウザ
観察表示ページと接続先のブラウザ機能アクセシビリティのスナップショットと任意の視覚ツール
用途目で追う確認、ログイン済みページの操作再現、デバッグ、回帰テストにできる手順
設定での注意アカウント、プロファイル、権限モード、セッション、クライアント設定

Claude CodeのChrome資料 (Claude in Chrome)は可視セッションとログイン状態の利用を説明しています。Playwright MCPリポジトリでは永続、分離、拡張機能の各モードを案内しています。ブラウザ自動化ガイドも参照できます。

使うセッションに接続する

Claude CodeからClaude in Chromeを使う場合、対応ブラウザに公式拡張機能があり、意図したアカウントや組織でサインインしているか確認します。クライアントの手順に従い、CLIでは文書にある claude --chrome を使います。可能なら空のテストプロファイルから始めます。許可を求められたらドメインと範囲を確認します。

Claude Codeの公式資料は、Claude in Chrome拡張機能1.0.36以降と対象のAnthropic直接契約プランを前提にしています。使うクライアントと組織の要件を確認してください。

Playwright MCPの既定は永続プロファイルです。新規の環境なら --isolated を指定し、画面が不要なら --headless を追加します。許可済みの既存ChromeやEdgeなら拡張機能ガイドに従います。既存ブラウザへの接続は新規セッションとは異なるアクセスを引き継ぎます。

Claude in Chromeは拡張機能のサイト権限を引き継ぎます。Playwright MCPでは、位置情報などをブラウザーコンテキストに許可できます。ブラウザー機能を使えるかどうかと、ログインしたアカウントがどのデータを参照・変更できるかは別の問題です。 Claude Code · Playwright MCP.

ブラウザを実行する場所

Claude Codeはデスクトップブラウザの拡張機能に接続します。リモート環境を使う場合は、どのマシンから対象アプリにアクセスできるか確認します。Playwright MCPはアクセス可能な環境でブラウザを起動し、クライアントにHTTPエンドポイントを提供できます。ワーカーのlocalhostはそのワーカー自身を指します。接続を信頼できるネットワークに限定し、専用のテストプロファイルを使います。 Playwright MCPの設定ガイド · Playwright MCP.

同じページと同じ目標で試す

アカウント不要の注文照会を開きます。初期状態は「Delivery code hidden」です。両方で同じURLを開き、「Show delivery code」を一度押し、表示をそのまま返すよう依頼します。変更するのはページの文章だけです。送信や外部アクセスはありません。

渡した練習URLだけを開き、見えている Show delivery code を一度押してください。
表示をそのまま返します。ログインや新たな権限が必要なら停止します。
フォーム送信、タブ切り替え、他サイトへの移動はしません。
ボタンを押すと配達コードDEMO-42が表示された架空の注文確認ページ
練習ページの期待結果です。ボタンを一度押すと配達コードが表示されます。

実際のフォーム不具合は二段階で確認します。最初はダミーデータを入力し、確認画面で止めて項目名とエラーメッセージをそのまま記録します。入力欄の警告、サーバーが拒否したリクエスト、次へ進まない画面を区別します。回帰テストでは初期状態を揃え、コードで正確な結果をアサートします。送信が必要な場合は、テストアカウントと承認済みの送信先を使います。

開いているタブで作業するならTabbit

Tabbit Browserでテスト用のスプレッドシートを開き、Agent Modeに列の見出しを確認させます。対象のタブを指定し、編集前に止まるよう指示します。画像ではシートの隣にタスクが表示されています。ビルドの合否を決めるチェックはPlaywright Testのアサーションにします。 Tabbit Browser · Playwright Test.

Google Sheetsの隣に表示されたTabbitのAgent Modeサイドバー
シートの隣にタスクと実行手順が表示されます。

用途から選ぶ

用途最初の選択理由
許可済みのログインページを一度確認承認済みClaude拡張機能か、正しいプロファイルのPlaywright拡張機能既存セッションを利用できる
まっさらな状態で不具合を再現分離Playwright MCP初期状態を揃えて構造化された結果を残せる
変更のたびに同じ確認アサーションを持つ決定的なテスト探索型エージェントは回帰テスト一式とは目的が違う
アカウントなしで説明テスト用プロファイルのどちらか同じURL、操作、表示を比較できる

認証と再現性を別に扱います。ログインが必要なら、最小権限のテスト用プロファイルを選びます。Cookie、非公開の通信、アカウント情報を含む画像の出力は避けます。安全ガイドと仮想ブラウザガイドも参照してください。

両方を試した開発者は、別の拡張機能が有効なとき接続で問題が起き、Playwrightの調査結果を好むと報告しました。同じ投稿で別の利用者は競合を確認していません。自分のテスト環境で確認します。

目で追いながら確認するなら承認済みのデスクトップ連携、条件を揃えて調べるなら分離したPlaywright MCP、CIで合否を決めるならPlaywright Testを選びます。開いているタブで監督できる作業にはTabbit Browserも使えます。

次に試すときは期待する結果を先に書きます。最初の作業チェックリストでURL、ボタン、実際の状態を確認してください。

よくある質問

ログイン済みのサイトにはClaude in Chromeが向いていますか?

拡張機能が有効なプロファイルのログイン状態を使えます。Playwright MCPも独自の拡張機能で既存のChromeやEdgeに接続できます。許可できるプロファイルと確認したい結果で選びます。

Playwright MCPは常にヘッドレスで分離されますか?

永続プロファイル、分離セッション、対応する既存ブラウザを使えます。ヘッドレスと分離は個別に設定します。

Claude in Chromeでテストできますか?

Webアプリを操作し、結果の確認に使えます。継続的な回帰確認では、アサーションを書き、繰り返し実行できるテストランナーやスクリプトを使います。

Playwright MCPにはClaudeが必要ですか?

対応するクライアントに接続できるMCPサーバーです。Claude Codeは指示を渡すクライアントの一つです。

テストサイトにログインせず比較できますか?

同じ練習ページを開き、同じ名前のボタンを一度押してコードを読み取ります。Claude拡張機能には別途サインインと権限の要件があります。

比較でどんな証拠を残しますか?

開始URL、ブラウザ環境、操作対象、結果、失敗箇所を記録します。同じ目標を使い、実行できなかった側は分けて記します。

次のステップへ

Tabbit と一緒に仕事をしましょう。

タブをまたいで調査し、繰り返しのブラウザ作業を自動化し、あらゆる文脈を手の届くところに。