Skip to content

Visual Testing Setup and Workflow

Bret Johnson edited this page Jul 27, 2023 · 2 revisions

Initial setup

Test failure messages will generate messages like this:

  VisualTestUtils.VisualTestFailedException : 
    Baseline snapshot not yet created: C:\myproject\test\TestProject\snapshots\MyVisualTest.png
    Ensure new snapshot is correct:    C:\myproject\test\TestProject\snapshots-diff\MyVisualTest.png
    and if it is, copy it to the 'snapshots' directory.
    
    Commands:
    View this file: vview C:\myproject\test\TestProject\snapshots\MyVisualTest.png
    Add this file:  copy C:\myproject\test\TestProject\snapshots\MyVisualTest.png C:\myproject\test\TestProject\snapshots\
    Diff all files: vdiff C:\myproject\test\TestProject\snapshots C:\myproject\test\TestProject\snapshots\snapshots-diff
    More info:      https://aka.ms/visual-test-utils

The intention is that you copy/paste the suggested commands to run them. But first, you'll need to setup the vdiff and vview aliases, pointing to your preferred visual diff and image viewer utilities. Beyond Compare is a good choice, as it handles directory and image diffs well. It isn't free, but its trial period is very generous (30 noncontiguous days of use, which can last a good while) and it's cheap when that runs out. To configure vdiff and vview to use Beyond Compare:

  • Install it from https://www.scootersoftware.com/download.php

  • Add aliases, as appropriate for your OS and shell. For instance, for PowerShell:

    • If your $PROFILE file doesn't already exist, create it
    • Add these aliases your $PROFILE, updating the paths as appropriate
      Set-Alias vdiff "C:\Program Files\Beyond Compare 4\BCompare.exe"
      Set-Alias vview "C:\Program Files\Beyond Compare 4\BCompare.exe"
      

Clone this wiki locally