スロット攻略 プロジェクトドキュメント

Appearance

Playwright E2E 実行ガイド ​

目的 ​

Local 環境で Playwright E2E（ホームページ smoke、有料記事のサイト内表示制御、会員登録〜メール確認の軽量通し、任意の Stripe Checkout 通し）を実行するための手順です。コマンドだけ見たい場合は Playwright E2E 実行コマンド一覧 を参照してください。fixture 詳細は 有料記事 E2E fixture 実行ガイド、Stripe 通しは 有料記事 Stripe Checkout / Webhook E2E 方針 を参照してください。

前提 ​

  • Node.js は package.json の engines / volta に記載されたバージョンを使用する
  • WordPress の Local 環境が起動している
  • 本番環境や live キーを使う URL は指定しない
  • npm run test:e2e / test:e2e:headed には paid-article-access と member-registration が含まれるため、WP-CLI（WP_CLI_BIN）が必須です。シェルの alias wp=... は Playwright から見えません。手順は 有料記事 E2E fixture 実行ガイド の「事前準備」を参照してください

初回セットアップ ​

依存パッケージをインストールしたあと、Playwright の Chromium ブラウザを取得します。

bash
npm install
npm run test:e2e:install

有料記事 access E2E を含む実行の前に、WP-CLI ラッパーを用意して WP_CLI_BIN / WP_ROOT を export します（詳細は fixture ガイド）。

実行コマンド ​

Local 環境の URL を PLAYWRIGHT_BASE_URL で指定して実行します。未指定の場合は http://slotkouryaku.local を使用します。

PLAYWRIGHT_BASE_URL は localhost、127.0.0.1、*.local、*.test の URL を想定しています。承認済みの非本番リモート環境で実行する場合だけ、ALLOW_REMOTE_E2E=1 を併用します。

bash
PLAYWRIGHT_BASE_URL=http://slotkouryaku.local npm run test:e2e

ブラウザを表示しながら確認する場合（WP-CLI 前提。詳細は fixture ガイド）:

bash
export WP_ROOT="/Users/a/Local Sites/slotkouryaku/app/public"
export WP_CLI_BIN=/tmp/wp-cli-slotkouryaku
export SLOT_KOURYAKU_E2E_FIXTURE=1
PLAYWRIGHT_BASE_URL=http://slotkouryaku.local npm run test:e2e:headed

headed で見える操作について ​

test:e2e:headed（chromium / access 系）は、有料記事ページを開いて表示内容を確認するテストです。ログインは cookie 注入、購入状態は DB fixture で用意するため、画面上でログインフォーム入力や「購入する」クリックはしません。ブラウザが一瞬開いて閉じるのは想定どおりです。

Checkout 画面のカード入力やキャンセル操作まで目で追いたい場合は、通常の test:e2e:headed ではなく次を使います（Stripe CLI + rk_test_* 推奨。sk_test_* も可）:

bash
npm run test:e2e:paid-article-stripe:headed

UI モードで確認する場合:

bash
PLAYWRIGHT_BASE_URL=http://slotkouryaku.local npm run test:e2e:ui

spawnSync wp ENOENT が出る場合は WP-CLI が PATH に無い（またはエイリアスのみ）です。fixture ガイドのトラブルシュートを参照してください。

テスト配置 ​

E2E テストは tests/e2e/ 配下に配置します。最初の smoke テストは tests/e2e/homepage-smoke.spec.js です（WP-CLI 不要）。

有料記事の未購入・購入済み状態を作る fixture は 有料記事 E2E fixture 実行ガイド を参照してください。 有料記事のサイト内表示制御 E2E は tests/e2e/paid-article-access.spec.js です（WP-CLI fixture 必須）。

有料記事のサイト内表示制御 E2E だけを実行する場合:

bash
npm run test:e2e:paid-article-access

会員登録〜確認メール相当〜同意証跡 meta までの軽量 E2E（シナリオ S1 相当）は tests/e2e/member-registration.spec.js です。WP-CLI fixture（scripts/e2e/member-registration-fixture.php）でレート制限掃除・wp_mail 捕捉・ユーザー cleanup を行います。

bash
export WP_ROOT="/Users/a/Local Sites/slotkouryaku/app/public"
export WP_CLI_BIN=/tmp/wp-cli-slotkouryaku
export SLOT_KOURYAKU_E2E_FIXTURE=1
PLAYWRIGHT_BASE_URL=http://slotkouryaku.local npm run test:e2e:member-registration

Stripe Checkout 外部画面と Webhook 反映までを含む通し E2E（S5 / S9 / S10）は、通常の npm run test:e2e には含まれません。Local で Stripe CLI listen と rk_test_*（推奨。sk_test_* も可）を用意したうえで、次の専用 script だけを実行します。

bash
npm run test:e2e:paid-article-stripe

方針・前提・片付けは 有料記事 Stripe Checkout / Webhook E2E 方針 を参照してください。

GitHub Actions から同じテストを1クリック実行するには、fixture を投入できる WordPress / DB / WP-CLI 環境が必要です。GitHub-hosted runner だけでは Local の WordPress にアクセスできないため、共有テスト環境または self-hosted runner を用意したうえで、この npm script を呼び出します。

調査用アーティファクト ​

失敗時の調査用に以下を保存します。

  • trace: 失敗時のみ保存
  • screenshot: 失敗時のみ保存
  • video: 失敗時のみ保存

出力先は test-results/、HTML レポートは playwright-report/ です。どちらも Git 管理対象外です。

レポートを確認する場合:

bash
npm run test:e2e:report

注意事項 ​

  • PLAYWRIGHT_BASE_URL には Local の URL を指定する
  • 本番環境、外部決済の live 環境、実ユーザーに影響する URL では実行しない
  • ALLOW_REMOTE_E2E=1 は本番以外であることを確認してから使う
  • GitHub-hosted Actions で実行する場合は、別途 WordPress / DB / WP-CLI のテスト環境を用意する