メインコンテンツへスキップ

プロジェクト

はじめに​

プロジェクトとは、同じ構成で実行されるテストの論理的なグループです。異なるブラウザーやデバイスでテストを実行できるようにするためにプロジェクトを使用します。プロジェクトは`playwright.config.ts`ファイルで構成され、一度構成されると、すべてのプロジェクトまたは特定のプロジェクトのみでテストを実行できます。また、プロジェクトを使用して、同じテストを異なる構成で実行することもできます。例えば、ログイン状態とログアウト状態の両方で同じテストを実行できます。

プロジェクトを設定することで、異なるタイムアウトや再試行回数でテストのグループを実行したり、ステージング環境や本番環境などの異なる環境に対してテストのグループを実行したり、パッケージ/機能ごとにテストを分割したりすることもできます。

複数のブラウザー向けのプロジェクト設定​

プロジェクトを使用すると、chromium、webkit、firefoxなどの複数のブラウザー、およびGoogle ChromeやMicrosoft Edgeなどのブランドブラウザーでテストを実行できます。Playwrightは、エミュレートされたタブレットやモバイルデバイスでも実行できます。デバイスパラメータのレジストリで、選択されたデスクトップ、タブレット、モバイルデバイスの完全なリストを参照してください。

import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },

    {
      name: 'firefox',
      use: { ...devices['Desktop Firefox'] },
    },

    {
      name: 'webkit',
      use: { ...devices['Desktop Safari'] },
    },

    /* Test against mobile viewports. */
    {
      name: 'Mobile Chrome',
      use: { ...devices['Pixel 5'] },
    },
    {
      name: 'Mobile Safari',
      use: { ...devices['iPhone 12'] },
    },

    /* Test against branded browsers. */
    {
      name: 'Microsoft Edge',
      use: {
        ...devices['Desktop Edge'],
        channel: 'msedge'
      },
    },
    {
      name: 'Google Chrome',
      use: {
        ...devices['Desktop Chrome'],
        channel: 'chrome'
      },
    },
  ],
});

プロジェクトの実行​

Playwrightはデフォルトですべてのプロジェクトを実行します。

npx playwright test

Running 7 tests using 5 workers

  ✓ [chromium] › example.spec.ts:3:1 › basic test (2s)
  ✓ [firefox] › example.spec.ts:3:1 › basic test (2s)
  ✓ [webkit] › example.spec.ts:3:1 › basic test (2s)
  ✓ [Mobile Chrome] › example.spec.ts:3:1 › basic test (2s)
  ✓ [Mobile Safari] › example.spec.ts:3:1 › basic test (2s)
  ✓ [Microsoft Edge] › example.spec.ts:3:1 › basic test (2s)
  ✓ [Google Chrome] › example.spec.ts:3:1 › basic test (2s)

単一のプロジェクトを実行するには、`--project`コマンドラインオプションを使用します。

npx playwright test --project=firefox

Running 1 test using 1 worker

  ✓ [firefox] › example.spec.ts:3:1 › basic test (2s)

VS Codeのテストランナーは、Chromeのデフォルトブラウザでテストを実行します。他の/複数のブラウザで実行するには、テストサイドバーの再生ボタンのドロップダウンをクリックして別のプロファイルを選択するか、Select Default Profileをクリックしてデフォルトプロファイルを変更し、テストを実行したいブラウザを選択します。

selecting browsers

テストを実行する特定のプロファイル、複数のプロファイル、またはすべてのプロファイルを選択します。

choosing default profiles

複数の環境向けのプロジェクト設定​

プロジェクトを設定することで、異なるタイムアウトや再試行回数でテストのグループを実行したり、異なる環境に対してテストのグループを実行したりすることもできます。例えば、ステージング環境に対して2回再試行でテストを実行したり、本番環境に対して0回再試行でテストを実行したりできます。

playwright.config.ts
import { defineConfig } from '@playwright/test';

export default defineConfig({
  timeout: 60000, // Timeout is shared between all tests.
  projects: [
    {
      name: 'staging',
      use: {
        baseURL: 'staging.example.com',
      },
      retries: 2,
    },
    {
      name: 'production',
      use: {
        baseURL: 'production.example.com',
      },
      retries: 0,
    },
  ],
});

テストをプロジェクトに分割する​

テストをプロジェクトに分割し、フィルターを使用してテストのサブセットを実行できます。例えば、特定のファイル名に一致するすべてのテストを実行するフィルターを使用してプロジェクトを作成できます。その後、特定のテストファイルを無視する別のテストグループを持つこともできます。

ここでは、共通のタイムアウトと2つのプロジェクトを定義する例を示します。「Smoke」プロジェクトは再試行なしでテストのごく一部を実行し、「Default」プロジェクトは他のすべてのテストを再試行付きで実行します。

playwright.config.ts
import { defineConfig } from '@playwright/test';

export default defineConfig({
  timeout: 60000, // Timeout is shared between all tests.
  projects: [
    {
      name: 'Smoke',
      testMatch: /.*smoke.spec.ts/,
      retries: 0,
    },
    {
      name: 'Default',
      testIgnore: /.*smoke.spec.ts/,
      retries: 2,
    },
  ],
});

依存関係​

依存関係とは、別のプロジェクトのテストが実行される前に実行する必要があるプロジェクトのリストです。これらは、グローバルセットアップアクションを設定する際に役立ち、あるプロジェクトが最初に実行されることに依存するようにできます。プロジェクトの依存関係を使用すると、テストレポーターはセットアップテストを表示し、トレースビューアーはセットアップのトレースを記録します。インスペクターを使用してセットアップテストのトレースのDOMスナップショットを検査したり、セットアップ内でフィクスチャを使用したりすることもできます。

この例では、chromium、firefox、webkitのプロジェクトはセットアッププロジェクトに依存しています。

playwright.config.ts
import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  projects: [
    {
      name: 'setup',
      testMatch: '**/*.setup.ts',
    },
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
      dependencies: ['setup'],
    },
    {
      name: 'firefox',
      use: { ...devices['Desktop Firefox'] },
      dependencies: ['setup'],
    },
    {
      name: 'webkit',
      use: { ...devices['Desktop Safari'] },
      dependencies: ['setup'],
    },
  ],
});

実行シーケンス​

依存関係を持つテストを扱う場合、依存関係は常に最初に実行され、このプロジェクトのすべてのテストがパスした後、他のプロジェクトが並列で実行されます。

実行順序

  1. 「setup」プロジェクトのテストが実行されます。このプロジェクトのすべてのテストがパスした後、依存するプロジェクトのテストが実行を開始します。

  2. 「chromium」、「webkit」、「firefox」プロジェクトのテストは一緒に実行されます。デフォルトでは、これらのプロジェクトは最大ワーカー数制限に従い、並列で実行されます。

chromium, webkit and firefox projects depend on setup project

依存関係が複数ある場合、これらのプロジェクトの依存関係は最初に並列で実行されます。依存関係のテストが失敗した場合、そのプロジェクトに依存するテストは実行されません。

実行順序

  1. 「Browser Login」と「DataBase」プロジェクトのテストは並列で実行されます
    • 「Browser Login」がパスしました
    • ❌ 「DataBase」が失敗しました！
  2. 「e2e tests」プロジェクトは実行されません！
Browser login project is blue, database is red and e2e tests relies on both

ティアダウン​

セットアッププロジェクトに`testProject.teardown`プロパティを追加することで、セットアップをティアダウンすることもできます。ティアダウンは、すべての依存プロジェクトが実行された後に実行されます。ティアダウンガイドで詳細を参照してください。

global setup and teardown

テストフィルタリング​

`--grep`/`--grep-invert`、`--shard`、コマンドラインでの場所による直接フィルタリング、または`test.only()`の使用など、すべてのテストフィルタリングオプションは、実行する主要なテストを直接選択します。これらのテストが依存関係を持つプロジェクトに属している場合、それらの依存関係からのすべてのテストも実行されます。

すべての依存関係とティアダウンを無視するには、`--no-deps`コマンドラインオプションを渡すことができます。直接選択したプロジェクトのみが実行されます。

カスタムプロジェクトパラメータ​

プロジェクトは、カスタム構成でテストをパラメータ化するためにも使用できます。この別のガイドをご覧ください。