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

トレースビューアー

はじめに

Playwright Trace Viewerは、テストで記録されたPlaywrightトレースを探索できるGUIツールです。これにより、テストの各アクションを前後に移動し、各アクション中に何が起こっていたかを視覚的に確認できます。

学習内容

  • トレースを記録する方法
  • トレースビューアーを開く方法

トレースの記録

BrowserContext.tracing() API を使用して、次のようにトレースを記録できます。

Browser browser = browserType.launch();
BrowserContext context = browser.newContext();

// Start tracing before creating / navigating a page.
context.tracing().start(new Tracing.StartOptions()
.setScreenshots(true)
.setSnapshots(true)
.setSources(true));

Page page = context.newPage();
page.navigate("https://playwright.dokyumento.jp");

// Stop tracing and export it into a zip archive.
context.tracing().stop(new Tracing.StopOptions()
.setPath(Paths.get("trace.zip")));

これによりトレースが記録され、trace.zip という名前のファイルに保存されます。

トレースを開く

保存されたトレースは、Playwright CLIを使用するか、ブラウザでtrace.playwright.devで開くことができます。トレースのzipファイルが置かれている完全なパスを追加してください。開いたら、各アクションをクリックするか、タイムラインを使用して各アクションの前後のページの状態を確認できます。また、テストの各ステップ中にログ、ソース、ネットワークを検査することもできます。トレースビューアーはDOMスナップショットを作成するため、完全に操作したり、開発者ツールを開いたりできます。

mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="show-trace trace.zip"

playwright trace viewer

詳細については、トレースビューアーに関する詳細ガイドをご覧ください。

次にすること