この記事は「Reqnroll × Playwrightで始めるE2Eテスト入門」シリーズの一部です。
Reqnroll + Playwrightの環境構築手順（.NET / C#）
E2Eテストを自動化する場合、Reqnroll と Playwright を組み合わせることで、
読みやすく保守しやすいテストを作成できます。
ReqnrollはBDD形式でテストシナリオを書くためのツール、
Playwrightはブラウザ操作を自動化するツールです。
本記事では .NET / C#環境でReqnroll + Playwrightを使うための環境構築手順を解説します。
この記事でわかること
- Reqnrollの導入方法
- Playwrightのインストール方法
- テストプロジェクトの作成
- ReqnrollとPlaywrightの基本設定
事前準備
環境構築を始める前に、次のツールがインストールされている必要があります。
- .NET SDK
- Visual Studio（またはVisual Studio Code）
Reqnrollをインストールする
- Visual Studioを開く
- [拡張機能]メニューから、[拡張機能の管理…]コマンドを選択します。
- Reqnrollを検索し、インストールします。
インストールして、Visual Studioを再起動すると、VSIX Installerが起動するため、Modifyを選択します。
Visual Studioでプロジェクト作成するときに、reqnroll Projectが作れるようになります。
Test Frameworkは好きなものを選択できます。今回はxUnit選択します。
サンプルコードが作成されるため、ビルドして、テストエクスプローラでテストを実行できます。
テストケースの処理がthrowになっているため、結果はエラーになりますが、動くことは確認できます。
Playwrightをインストールする
次にPlaywrightをインストールします。
まずはnugetでインストールします。
プロジェクトフォルダ内にplaywright.ps1ファイルが作成されるので、
以下のようにコマンドを実行して、インストールします。
pwsh .\bin\Debug\net8.0\playwright.ps1 installPlaywrightを動かしてみる
Hookを作成
Hooksフォルダを作成し、PlaywrightHooks.csを作成します。
そこに、以下のコードを作成します。
using Microsoft.Playwright;
[Binding]
public class PlaywrightHooks
{
private static IPlaywright _playwright;
private static IBrowser _browser;
public static IBrowser Browser => _browser;
[BeforeTestRun]
public static async Task BeforeTestRun()
{
_playwright = await Playwright.CreateAsync();
_browser = await _playwright.Chromium.LaunchAsync(new BrowserTypeLaunchOptions
{
Headless = false
});
}
[AfterTestRun]
public static async Task AfterTestRun()
{
await _browser.CloseAsync();
_playwright.Dispose();
}
}StepDefinitionsを修正
サンプルコードのクラスに以下の内容を追加します。
https://playwright.dev/へアクセスするコードです。
private IBrowserContext _context;
private IPage _page;
[BeforeScenario]
public async Task Setup()
{
_context = await PlaywrightHooks.Browser.NewContextAsync();
_page = await _context.NewPageAsync();
}
[Given("サイトを開く")]
public async Task OpenSite()
{
await _page.GotoAsync("https://playwright.dev/");
Console.WriteLine("breakpoint");
}Featureファイルの修正
以下のように、コードを書きます。
※文字コードがUTF8でないと、文字化けする可能性があるため注意
Scenario: テストシナリオ
Given サイトを開くテスト実行
テストを実行すると、StepDefinitionsのサイトを開く部分の処理が動くタイミングで、
以下のように自動的にブラウザが起動します。
本当のテストでは、ブラウザを起動したら、ボタンを押したら画面遷移するなど、そういうテストを続けて書いていきます。
Reqnroll + Playwrightの構成
ReqnrollとPlaywrightを組み合わせたテストの構成は次のようになります。
Featureファイル（Reqnroll）
↓
StepDefinition（C#）
↓
Playwright
↓
ブラウザ操作この構成により
- 読みやすいテスト
- 保守しやすいコード
を実現できます。
まとめ
本記事では Reqnroll + Playwright + Visual Studioの環境構築手順を解説しました。
ポイント
- ReqnrollはBDDテストフレームワーク
- Playwrightはブラウザ自動化ツール
- .NET環境でE2Eテストを作成できる
この2つを組み合わせることで、読みやすく保守しやすいE2Eテストを書くことができます。
