🎭

Node.jsとPythonでPlaywrightを使ったとき、ブラウザバイナリは共通なのか？

takumi

2025/12/13に公開

2025/12/29

bitA Tech Blog Advent Calendar 2025の記事です

🌟本記事はbitA Tech Blog Advent Calendar 13日目の記事です。

本内容を試すきっかけ

私が参画する案件ではNuxt3でWeb画面を作成し、e2eテストにPlaywrightを活用しています。

ある日、チームメンバがローカル環境でe2eテストを実行しようとしたところ、セキュリティの制約により npx playwright install を実行してもブラウザバイナリをインストールできないトラブルが発生しました。

代替案を検討している際に「PythonでもPlaywrightを利用できるけれど、ブラウザバイナリはどのように管理されているのだろう？」と疑問に思ったことが今回の検証のきっかけです。

ブラウザバイナリの保存場所

Playwrightのドキュメントを確認してみます。

PlaywrightはNode.js、Python、Java、.NETに対応しており、どのドキュメントでもブラウザバイナリのデフォルト保存場所として以下が記載されています。

%USERPROFILE%\AppData\Local\ms-playwright on Windows
~/Library/Caches/ms-playwright on macOS
~/.cache/ms-playwright on Linux

また、環境変数 PLAYWRIGHT_BROWSERS_PATH を指定することでブラウザバイナリの保存先を変更できます。

同じブラウザバイナリを使用するか試してみる

今回はmacOSでNode.jsとPythonを使用し、同じバージョンのPlaywrightと異なるバージョンのPlaywrightでどのように動作が変わるか検証します。

検証環境

macOS: 15.7.2
Node.js: 24.11.0
Python: 3.12.12
Playwright
- 1.45.0
- 1.50.0

事前準備(Node.js)

Node.jsで検証用の環境を作成します。

Node.js実行環境

# Playwright@1.45.0 をインストール
$ npm install playwright@1.45.0

続いてPlaywrightを実行するコードを記述します。

main.js

import { chromium } from 'playwright';

const browser = await chromium.launch();
const page = await browser.newPage();

await page.goto('https://example.com');
console.log(`Node.js: ${await page.title()}`);

await browser.close();

npx playwright install を実行せずにテストコードを実行し、エラーが起きることを確認します。

Node.js実行環境

# 対象のブラウザが存在しないためエラーとなる
$ node main.js
# ...省略...
╔═════════════════════════════════════════════════════════════════════════╗
║ Looks like Playwright Test or Playwright was just installed or updated. ║
║ Please run the following command to download new browsers:              ║
║                                                                         ║
║     npx playwright install                                              ║
║                                                                         ║
║ <3 Playwright Team                                                      ║
╚═════════════════════════════════════════════════════════════════════════╝
# ...省略...

事前準備(Python)

Python環境でも同様に検証を行います。資材が混ざらないよう、Node.jsとは別ディレクトリで作業することを推奨します。

python実行環境

# 仮想環境を作成しactivate
$ python -m venv .venv
$ source .venv/bin/activate

# playwright 1.45.0 をインストール
$ pip install playwright===1.45.0

続いてPlaywrightを実行するコードを記述します。

main.py

from playwright.sync_api import sync_playwright

with sync_playwright() as playwright:
    browser = playwright.chromium.launch()
    page = browser.new_page()
    page.goto('https://example.com')
    print(f'Python: {page.title()}')
    browser.close()

Pythonでも同じように playwright install を実行せずにテストコードを実行し、エラーになることを確認します。

Python実行環境

# 対象のブラウザが存在しないためエラーとなる
$ python main.py
# ...省略...
╔════════════════════════════════════════════════════════════╗
║ Looks like Playwright was just installed or updated.       ║
║ Please run the following command to download new browsers: ║
║                                                            ║
║     playwright install                                     ║
║                                                            ║
║ <3 Playwright Team                                         ║
╚════════════════════════════════════════════════════════════╝
# ...省略...

検証1：同じバージョンの場合

事前準備でどちらの環境でもPlaywrightのバージョンに 1.45.0 を指定しました。
片方で playwright install chromium を実行しブラウザバイナリをインストールします。

ここではNode.js環境でブラウザバイナリをインストールします。

Node.js

# chromiumのみインストール
$ npx playwright install chromium

# ブラウザバイナリが存在するか確認(macOSの場合)
$ ls -1 ~/Library/Caches/ms-playwright
chromium-1124/
ffmpeg-1009/

次にそれぞれのテストコードが実行します。

Node.js実行環境

# Node.jsのテストコードを実行
$ node main.js
Node.js: Example Domain

Python実行環境

# Pythonのテストコードを実行
$ python main.py
Python: Example Domain

以上から同じバージョンのPlaywrightを使用する場合、異なる言語でも同一のブラウザバイナリが利用されることが確認できました。

検証2：異なるバージョンの場合

続いてPlaywrightのバージョンをNode.js側を 1.45.0、Python側を 1.50.0 に変更し検証します。
再検証の前に、 playwright uninstall --all で既存のブラウザバイナリを削除します。

先程はNode.js環境でブラウザバイナリをインストールしたので、今度はPython環境からブラウザバイナリをインストールします。

Python実行環境

# 前回の検証でinstallしたブラウザバイナリを削除
$ playwright uninstall --all

# ブラウザバイナリ格納先にファイルがないことを確認
$ ls -1 ~/Library/Caches/ms-playwright

# playwright 1.50.0 をインストール
$ pip install playwright===1.50.0

# chromiumのみインストール
$ playwright install chromium

# ブラウザバイナリが存在するか確認
$ ls -1 ~/Library/Caches/ms-playwright
chromium_headless_shell-1155/
chromium-1155/
ffmpeg-1011/

異なるバージョンに応じたブラウザバイナリが新たにインストールされました。

続いてテストコードを実行します。

Python実行環境

# テストコードを実行
$ python main.py
Python: Example Domain

Node.js実行環境

# テストコードを実行
$ node main.js
# ...省略...
╔═════════════════════════════════════════════════════════════════════════╗
║ Looks like Playwright Test or Playwright was just installed or updated. ║
║ Please run the following command to download new browsers:              ║
║                                                                         ║
║     npx playwright install                                              ║
║                                                                         ║
║ <3 Playwright Team                                                      ║
╚═════════════════════════════════════════════════════════════════════════╝
# ...省略...