Playwright|Python版からNode.js版に切り替えた理由と方法

Playwright

QAエンジニアのあやです。

2025年はPython版でPlaywrightによる自動化に取り組んでいましたが
2026年、Node.js版に切り替えることにしました。
その理由と手順を残します。

なぜPython版を使用していた?

今まで使用経験のあるプログラミング言語がPythonのみでした。
まずは小さな成功体験を早く積むために
Python版でPlaywrightによるテスト自動化に取り組みました。

なぜNode.js版に切り替えようと思った?

理由は2つ

  1. Playwrightに関する書籍やノウハウ動画等のほとんどがNode.js版だから
  2. Python版だと機能制限があるから

Playwrightの学習を進める過程で購入した書籍や閲覧したYouTube動画のほとんどが
Node.js版を利用しておりPythonに読み替えるのがプログラミングほぼ未経験の私にとっては
AIを利用しても手間のかかる作業でした。

また、学習を進める過程で魅力的に感じる機能が多数Python版では利用できなかったのです。
PlaywrightはNode.jsのパッケージとして提供されているため一番機能が充実しています。
わかってはいたものの、まずは”小さな成功体験を早く積むこと”に重きを置いていたため
Python版を選んでいました。
しかしこの壁に歯痒さを感じ始めたため、Python版で動作する環境を作ったところで
Node.js版に切り替えることを決めました。

Python版からNode.js版に切り替える方法

まず前提として下記2つを注意してください。
今まで動いていたPython版が動かなくなってしまいます。

  • Pythonプロジェクトは触らない
  • Node.js版は 別フォルダ に作る

1. Node.jsをインストールする

まだインストールしていなければインストールしましょう。
インストールされているか下記コマンドで確認できます。

node -v
npm -v

バージョンが表示されればOKです。

新規インストールする場合は公式サイトからLTS(安定版)を選びます。
👉 Node.js ダウンロードページ
「Windows Installer(.msi)」をクリックしてダウンロード。

案内に従ってインストール

「Tools for Native Modules」のチェックはONでOK

2. Node.js版用の新規プロジェクトフォルダを作る

Python版とは別に作業フォルダを作成しましょう(例:playwright-js

3. Playwright(Node版)の導入

Playwright公式の初期化コマンドでテンプレを作ります。

npm init playwright@latest
  • Do you want to use TypeScript or JavaScript?
    • TypeScript を選択
  • Where to put your end-to-end tests?
    • tests のままで基本的にOK
  • Add a GitHub Actions workflow?
    • 「GitHub Actions のワークフロー(自動テスト設定)を追加しますか?」
      という質問
    • ローカル実行が目的ならn(No)でOK
  • Install Playwright browsers (can be done manually via ‘npx playwright install’)? 
    • trueでOK

完了すると、だいたいこういう構成ができます。

├── node_modules
├── package-lock.json
├── package.json
├── playwright.config.ts
└── tests
    └── example.spec.ts

下記3つはPlaywrightに限らず、npmが管理するディレクトリに共通して存在するものです。

  • node_modules
    • このディレクトリの下には、npmでインストールされたパッケージが依存関係をさかのぼって格納される
  • package.json
    • npmが管理するパッケージファイル。パッケージの依存関係やカスタムコマンドを記載する
  • package-lock.json
    • package.jsonで設定されたパッケージの依存関係が詳細に記載される

下記のフォルダとファイルはPlaywrightに関係するものです。

  • playwright.config.ts
    • playwrightの設定ファイル
  • tests
    • テストコードを格納するフォルダ
  • example.spec.ts
    • サンプルのテストコード

4. 動作確認

まずは通るかだけ確認します。
作業フォルダで下記コマンドを実行します。

npx playwright test

実行すると★を付けたフォルダが作成されます。

├── node_modules
├── package-lock.json
├── ★playwright-report
    └── ★index.html
├── package.json
├── playwright.config.ts
├── ★test-results
└── tests
    └── example.spec.ts

★で作成されたレポートを見てみましょう。

npx playwright show-report

ブラウザでこのようなレポート画面が開けば成功です。

5. 既存Python資産の移行。設定を移す

いきなり全部移さず、順番を決めると事故りません。

  1. 設定を移す
    • conftest.py
    • .env_*

などに記述しているbaseURL、タイムアウト、リトライ、headless、trace/screenshot/video などの設定を「playwright.config.ts」 に集約します。

envファイルはPython版のものをそのままNode.js版のフォルダに置くだけで使用できましたが
下記コマンドで”dotenv”を入れる必要があります。

nom i -D doting 

6. Page Object(画面ごとのクラス)を移す

  1. ログインなど“使い回す処理”を固める
    • Node版は storageState(認証状態の保存)が便利
  2. Page Object(画面ごとのクラス)を移す
    • Pythonでやっていた “ページクラス/部品クラス” を同じ思想で作る

7. 重要シナリオからテスト移植してテスト実行

毎日回すもの、障害が多いものから移植します。
AIを利用してPython版のコードをNode.js版に変換してもらうと早いです。

テスト実行するためのコマンドはこちら。

npx playwright test

まとめ

“小さな成功体験を早く積むこと”に重きを置いていたためPython版を選んでいましたが
最初からNode.js版を選んでおけばよかったかなと思っています。
Playwrightは様々なプログラミング言語で提供されています。
選ぶ際の参考になればと思います。

タイトルとURLをコピーしました