167文字
1分
編集

Playwrightでスクリーンショットの保存先をカスタマイズする

#Playwright

Playwright のスクリーンショットは、例えばtoHaveScreenshotのデフォルトでは次のような形式で保存される。

txt
{testDir}/{testFilePath}-snapshots/{arg}-{projectName}{ext}

それぞれのパスの意味は次の通り。

  • {testDir}: テストディレクトリ
  • {testFilePath}: テストファイルのパス
  • {arg}: スクリーンショットの名前、toHaveScreenshotなどで指定した名前
  • {projectName}: プロジェクト名、chromium-darwin など
  • {ext}: スクリーンショットの拡張子

つまり次のようなパスに保存される。

txt
tests/e2e/some-test.spec.ts-snapshots/simple-picture-test-chromium-darwin.png

これを変更したい場合、playwright.config.tsで変更することができる。toHaveScreenshot など assertion ごとに変更することもできる。

tsx
import { defineConfig } from "@playwright/test";

export default defineConfig({
  testDir: "./tests",

  // Single template for all assertions
  snapshotPathTemplate: "{testDir}/__screenshots__/{testFilePath}/{arg}{ext}",

  // Assertion-specific templates
  expect: {
    toHaveScreenshot: {
      pathTemplate:
        "{testDir}/__screenshots__{/projectName}/{testFilePath}/{arg}{ext}",
    },
    toMatchAriaSnapshot: {
      pathTemplate: "{testDir}/__snapshots__/{testFilePath}/{arg}{ext}",
    },
  },
});

参考：TestProject | Playwright#test-project-snapshot-path-template

編集