はじめに
最近Claudeが流行っているので色々試している中で、Playwright-mcpをClaudeDesktopから使えるよう設定するのに色々苦労したので同じように困っている人のためにメモとして残したいと思います。
環境
- Windows 11
- WSL v2.6.3.0 (Debian 13.4)
- Claude Desktop for Windows v1.2773.0
- WSL側でNode.js, Playwright（本体、MCPサーバ、ブラウザ）はインストール済とする
どんな問題が起きたか？
基本的にClaudeDesktopでPlaywright-mcpを使うためにやることは、各ツールのインストールとclaude_desktop_config.jsonの設定です。
たったそれだけのはずが3つの問題に遭遇し、思いのほか時間がかかってしまいました。。
-
公式通りに
claude_desktop_config.jsonを設定しても動かない - WSLにツールをインストールした場合の実行方法が分かったが、nodeが見つからないエラー
- MCP自体はうまく動いたが、Claudeにスクショを撮ってもらうと権限エラーになる
最終的な結論
最終的にこちらの設定でうまく動作した。
{
"mcpServers": {
"playwright": {
"command": "wsl",
"args": [
"-d", "Debian",
"--",
"/usr/bin/env",
"-C", "{任意のディレクトリパス（playwrightのスクショの保存先）}",
"PATH={nodeのフルパス}:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin
"npx",
"-y",
"@playwright/mcp@latest"
]
}
}
}
問題への対処
どの問題もすべてclaude_desktop_config.jsonの記載方法で解決できました。
1. 公式通りにclaude_desktop_config.jsonを設定しても動かない
こちらはシンプルで、npxコマンドはWindows側にないため起きていたエラーでした。
npxの前にwslコマンドを打ってあげることで解決
{
"mcpServers": {
"playwright": {
"command": "wsl",
"args": [
"npx",
"@playwright/mcp@latest"
]
}
}
}
2. WSLにツールをインストールした場合の実行方法が分かったが、nodeが見つからないエラー
ここが今回一番詰まったところでした。
エラーログを見るとenv: ‘node’: No such file or directoryというエラーでしたが、WSL上でnodeやnpxが使えることは確認済。
フルパスを指定しなきゃいけないという記事を見つけ、npxのフルパスを入れてみましたがそれでもダメでした。（npxのパスはwhere npxコマンドで取得）
そこでClaudeにエラー原因を聞いてみると「おそらくnpxが内部のnodeを参照するときにエラーが出ており、WSL起動時のPATHにnodeがないのが根本原因」と返答がありました。
wsl --でコマンドを打った場合、Windows側の環境変数しか見れないようです。
そのため、コマンドでPATHを渡してやることでMCPとのサーバとの接続ができました。
{
"mcpServers": {
"playwright": {
"command": "wsl",
"args": [
"bash",
"-c",
"PATH={nodeのフルパス}:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin {npxのフルパス} @playwright/mcp@latest"
]
}
}
}
3. MCP自体はうまく動いたが、Claudeにスクショを撮ってもらうと権限エラーになる
MCPも接続できたのでexample.comのスクショを依頼したところ「playwright-mcpがWindows側のパス（/mnt/c/Windows/System32/）にディレクトリを作ろうとして失敗しています」という返事。
詳細を見ると権限エラーとなっていた。
これはplaywright-mcpがスクショの保存などを行うディレクトを作業ディレクトリ上に作成する仕様によるものと判明。
cdコマンド等を追加して、動作するディレクトリを管理者権限の不要な任意の場所に変えることで解決。