🙆

playwright-mcp-server起動時にlocaleを設定する

に公開
Playwright
MCP サーバー
Gemini CLI
tech

会社でgemini cliを使うことができるようになって、E2EテストをPlaywrightに移行してみるちょうどいい課題があったので色々試してみている。そんな中、ふとplaywright-mcp-serverでgemini cliによるマニュアルテストみたいなことができるんじゃないか、と思い立ち、試してみた。

実際にその辺の話は別の機会に書くとして、その過程でlocale設定によってブラウザ上の表示が異なるパターンがあったので、playwright-mcp-serverの起動時にlocaleを設定する方法を調べてメモしておく。

playwright-mcp-serverの起動時にlocaleを設定する

今回はplaywrightからFirefoxを使用する際に、locale設定を行う必要があったため、以下のように--configオプションで設定ファイルを指定する。このあたりはちゃんと
playwright-mcpのドキュメントに書いてある。なおこんな感じでchromeとFirefoxそれぞれ起動できるようにしておくと、gemini cliくんに指示してこのブラウザで確認してとかできる。便利。この辺の使い分け自体はどのAIエージェントでもできると思うので、gemini cliに限らず使えると思う。

{
    "theme": "Default",
    "usageStatisticsEnabled": false,
    "selectedAuthType": "vertex-ai",
    "preferredEditor": "vscode",
    "mcpServers": {
        "playwright-chrome": {
            "command": "npx",
            "args": ["@playwright/mcp@latest", "--browser", "chrome"]
        },
        "playwright-firefox": {
            "command": "npx",
            "args": [
                "@playwright/mcp@latest",
                "--browser",
                "firefox",
                "--config",
                ".gemini/firefox.json"
            ]
        }
    }
}

.gemini/firefox.jsonの内容は以下のようにlocaleを設定する。これでFirefoxを起動したときに日本語の表示になる。最初はこの辺の設定をGithub copilot Agentが作成したので、根拠はなんだと調べてみるとPlaywright-mcpのドキュメント経由でちゃんとPlaywrightのドキュメントに書いてあった。

{
    "browser": {
        "browserName": "firefox",
        "contextOptions": {
            "locale": "ja-JP",
            "timezoneId": "Asia/Tokyo",
            "viewport": {
                "width": 1280,
                "height": 720
            }
        }
    }
}

まとめ

こんな感じで設定しておくと、意図したlocaleでブラウザが起動する。自分が出会ったケースだと、移植したE2Eのテストと同じ操作をマニュアルでできないかなと指示してみた際に、ブラウザの表示が英語になっていて、操作方法がわからないということがあったので、locale設定をしておくといい感じに動く。

余談としてAIエージェントでマニュアルテストみたいなことをさせるのは結構面白いなと思っており、実際にマニュアルテストで操作した内容から再現性のあるテストコードを生成することができるのではないかと考えている。この辺ももうちょっと色々試行錯誤してみたい。

GitHubで編集を提案

Discussion