0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

簡単にテスト自動化 - Visual Regression Testing

Posted at

ビジュアルリグレッションテストとは?

ビジュアルリグレッションテストは、ウェブアプリケーションやウェブページの視覚的な側面が、変更前後でどのように変化するかを確認するテスト方法です。
このテストは、特にウェブサイトのデザインやレイアウトに関する変更を検出するのに有効です。

主な目的

  • デザインの一貫性の確保:
    • コード変更による意図しないビジュアルの変更を検出します。
  • 自動化されたフィードバックの提供:
    • 手作業による確認作業を減らし、迅速なフィードバックを提供します。

テストプロセス

  1. 基準画像の作成:
    • テスト対象ページのビジュアル基準となるスクリーンショットを取得します。
  2. 変更後の画像の取得:
    • コード変更後のページのスクリーンショットを取得します。
  3. 画像比較:
    • 両画像を比較し、ビジュアル上の変更点を検出します。

ツールとテクノロジー

  • 一般的なツール:
    • Selenium、Puppeteer、Cypressなどのブラウザテストツールと組み合わせて使用されます。
  • 画像比較ツール:
    • ピクセルレベルでの比較や差分の視覚化を行うツールが利用されます。

注意点

  • 偽陽性のリスク:
    • 微細なレンダリングの違いも検出されるため、偽陽性のリスクがあります。
  • 環境の影響:
    • ブラウザやディスプレイの違いがテスト結果に影響を与えることがあります。

👉 ポイント: ビジュアルリグレッションテストは、ウェブアプリケーションやページの視覚的変更を検出するための強力なツールですが、偽陽性や環境による影響を考慮する必要があります。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?