【テスト】【Playwright】試験環境やメンテナンス画面が表示されている本番環境でのテスト

Playwrightを使用したE2Eテストでは、BASIC認証がかかっている試験環境やメンテナンス画面が表示されている本番環境でのテストを行うことが可能か調べてみました。

BASIC認証のテスト

1. BASIC認証の設定

Playwrightでは、BASIC認証を通過するための設定が簡単に行えます。具体的には、テストの設定ファイル（playwright.config.ts）で認証情報を指定することができます。以下はその一例です：

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

export default defineConfig({
  use: {
    httpCredentials: {
      username: 'your_username',
      password: 'your_password',
    },
  },
});

この設定により、テスト実行時に自動的に認証が行われ、BASIC認証がかかっているページにアクセスできるようになります。

メンテナンス画面のテスト

2. メンテナンス画面の表示

メンテナンス画面が表示されている環境でも、管理者としてログインすることでページの閲覧が可能です。Playwrightでは、ログイン処理を自動化することができるため、管理者アカウントを使用してメンテナンス画面にアクセスすることができます。

例えば、以下のようにログイン処理を記述することができます：

import { test, expect } from '@playwright/test';

test('Admin login and access maintenance page', async ({ page }) => {
  await page.goto('<https://example.com/login>');
  await page.fill('input[name="username"]', 'admin');
  await page.fill('input[name="password"]', 'admin_password');
  await page.click('button[type="submit"]');

  // メンテナンス画面に遷移
  await page.goto('<https://example.com/maintenance>');
  expect(await page.isVisible('text=メンテナンス中')).toBeTruthy();
});

このように、Playwrightを使用することで、BASIC認証やメンテナンス画面に対するテストを効率的に実施することができます。

まとめ

Playwrightを用いたテストでは、BASIC認証がかかっている試験環境やメンテナンス画面が表示されている本番環境でのテストが可能です。認証情報を設定することで、テストを自動化し、管理者としてのアクセスを確保することができます。これにより、実際の運用環境に近い形でのテストが実現でき、品質保証に寄与します。

参考サイト

https://note.com/nishioka_shinji/n/n4717914850b6

https://heartbeats.jp/hbblog/2024/11/vscodeplaywrighte2e.html

https://engineerblog.markerise.com/frontend/20230704_582/