Playwright + reg-suitでVisual Regression Testing(VRT)を導入はじめに デザインなどを変更した時に、予期せぬレイアウトの崩れがないか1つ1つ目視で確認するのは大変です。ページ数が多くなればなるほどヒューマンエラーの可能性が高くなります。そんな時、導入したいのがVisual Regression Testing(VRT)。 アプリケーションの前後の状態をキャプチャしたスクリーンショットを比較することで、ビジュアル上の変更や不具合を特定することができます。 今回はPlaywright + reg-suitを利用して、VRTを導入方法を紹介します。 各種インストール Next.jsをインストール 今回はNext.jsのトップページでテキストを変更してVRTを試してみます。 ✔ What is your project named? … vrt-example ✔ Would you like to use TypeScript? … Yes ✔ Would
