Playwrightでテスト手順に名前を付ける（日本語にする）

6338 ワード
テキストリンク

▮Playwright

E2Eのテストフレームワークである。

https://playwright.dev/

test.step()の仕様は以下を参照する。

https://playwright.dev/docs/api/class-test#test-step

▮前提条件

以下を参考にPlaywright Test for VSCodeを導入済

https://zenn.dev/reflex4qa/articles/e59f77b5c58d15

環境

  • VS code： 1.66.2 (user setup)
  • Node.js: 16.13.0
  • OS: Windows_NT x64 10.0.18363
  • Playwright： Version: 1.21
  • Playwright Test for VSCode： v0.2.3

▮ Bofre After

Before After
スクリーンショット

▮1. login.spec.tsを変更する

操作

  1. [エクスプローラ]login.spec.tsを開く。
  2. [テキストエディタ]以下の通りに、コードを 変更後 に変更する。

変更前

login.spec.ts
    // Create 1st todo.
    await page.locator('.new-todo').fill(TODO_ITEMS[0]);

変更後

await page.locator('.new-todo').fill(TODO_ITEMS[0]);をawait test.stepで囲む。

login.spec.ts
    // Create 1st todo.
    await test.step('TODOに"buy some cheese"と入力する。', async () => {
      await page.locator('.new-todo').fill(TODO_ITEMS[0]);
    });

確認

  1. [ターミナル]以下のコマンドを実行する。
npx playwright test
  1. [ターミナル]以下の出力を確認する。
PS C:\Playwright_sample> npx playwright test

Running 25 tests using 1 worker
  Slow test file: [chromium] › example.spec.ts (60s)
  Consider splitting slow test files to speed up parallel execution

  25 passed (1m)

To open last HTML report run:

  npx playwright show-report

PS C:\Playwright_sample>
  1. [ターミナル]以下のコマンドを実行する。
npx playwright show-report
  1. [ブラウザ]ブラウザが起動して、テスト結果の表示を確認する。
  2. [ブラウザ]New Todo › should allow me to add todo itemsをクリックする。
  3. [ブラウザ]TODOに"buy some cheese"と入力する。と変更したことを確認する。

今回の変更後のファイル構成

  • 変更なし
ExpressでHelmetを使うとGoogle Analyticsが動かなくなって困った話
中置関数の使い方について（Haskell）