npm init playwright@latest
npx playwright codegen
起動するとブラウザが立ち上がり、すでに録画状態になっています。
テストしたいウェブサイトにアクセスして様子をクリックしたりするとInspector 画面にコードが書き出されます。
cookies.json
{
"cookies":
[
{
"name": "cookie_name",
"value": "cookie_value",
"domain": "example.com",
"path": "/",
"expires": -1,
"httpOnly": true,
"secure": true,
"sameSite": "Lax"
}
]
}
npx playwright codegen --load-storage=cookies.json https://example.com
ファイル名は好きな命名で良いでしょう。拡張子も同じくです。
vi tests/作成したいテストファイル名.spec.ts
拡張子の設定は以下のようにします。(例 : *.playwright.ts をテストファイルとみなす)
playwright.config.ts
export default defineConfig({
testMatch: "*.playwright.ts",
要素 xxx が画面に表示されている
await expect(page.locator('h1')).toBeVisible(); // 要素h1が画面に表示されている
await expect(page.locator('h2')).not.toBeVisible(); // 要素h1が画面に表示されていない
ページのタイトルが xxx と完全一致(部分一致)する
await expect(page).toHaveTitle(/のマイページ/); // 部分一致(正規表現オブジェクトで指定)
await expect(page).toHaveTitle('Dashboard'); // 完全一致(文字列で指定)
URLが xxx である
await expect(page.url()).toBe('https://localhost/mypage/');
npx playwright test --ui
インストール時に自動的にインストールされる。サンプルテストファイルが実行されます。実行されるのは以下のファイルです。
tests/example.spec.ts
tests/demo-todo-app.spec.ts
npx playwright show-report
npx playwright test --project=chromium
npx playwright test --project=chromium
npm install -D reg-suit
インストール
npx reg-suit init
実行
npx reg-suit run
フィクスチャとは何するもの?
フィクスチャとは、テストを実行する際に必要となる前提条件や共通のセットアップを提供する仕組みのことです。
具体的には:
・テスト実行前の環境準備(セットアップ)
・テスト間で共有される共通のコード
・テストデータの準備
・テスト後のクリーンアップ処理(ティアダウン)
を管理する機能です。
・テスト間でデータを共有したり、カスタム実行を作成したりする