Skip to main content

Visual Guard: Compare Screenshots Against Reviewed Baselines

Current Visual Guard examples for pixel, SSIM, and pHash comparisons, with deliberate masking and baseline review.

2 min read
Visual Guard: Compare Screenshots Against Reviewed Baselines
On this page

A functional assertion and a visual assertion answer different questions. A checkout can save the correct order while its confirmation page clips the total on mobile. Visual Guard adds screenshot comparison to Python tests so a reviewed baseline can help catch that rendered change.

Use the current API

The repository documents VisualTester.assert_matches, with exclude_regions for masking. Pixel comparison is the default. This example assumes an authorized test application and a stable viewport; replace the sample URL with that application.

python
from selenium import webdriver
from visual_guard import VisualTester

def test_homepage_layout():
    driver = webdriver.Chrome()
    try:
        driver.set_window_size(1280, 900)
        driver.get("https://example.com")
        # Wait for your application's stable ready state before capture.
        visual = VisualTester()
        visual.assert_matches(driver, "homepage")
    finally:
        driver.quit()
A new baseline needs review
The first run can create a baseline when one is missing. That establishes a reference image; it does not prove the design is correct. Review new baselines and prevent unattended CI from silently approving arbitrary replacements.

Choose a comparison method

MethodThreshold meaningUse deliberately
pixelAllowed percentage of pixel differencesSensitive checks under controlled rendering conditions.
ssimSimilarity score between 0 and 1Structural comparisons with the optional image dependencies installed.
phashHash Hamming distanceCoarse perceptual comparison; small important details can be missed.
bash
pip install "visual-guard[full]"
python
# Integration snippet: driver and visual come from the setup above.
visual.assert_matches(driver, "homepage_ssim", method="ssim", threshold=0.95)

# Rectangle format is (x, y, width, height).
# Mask only content outside this checkpoint's requirements.
visual.assert_matches(
    driver, "dashboard", exclude_regions=[(100, 50, 200, 30)]
)

The SSIM value shown is an example to calibrate with known good and known bad screenshots. It is not a 95% correctness score. Verify optional dependencies and the active comparison method in your environment before interpreting results.

Make differences actionable

  • Fix viewport, fonts, locale, theme, and fixture data.
  • Wait for required images and asynchronous content.
  • Keep baseline, actual, and diff artifacts associated with the application build.
  • Review changes at representative mobile and desktop sizes.
  • Keep outcome and accessibility checks alongside screenshot comparisons.

Masking can reduce noise but also removes evidence. Do not exclude a price, validation message, or action merely because it is dynamic. Validate the value independently and restrict the exclusion to what the visual checkpoint does not need to judge.

Reviewed against the current repository on September 5, 2026. No GitHub release was found during this review, so this article does not present the repository API as a newly published package release. Visual Guard usage and comparison guide.

Dhiraj Das

About the Author

Dhiraj Das is an Automation Consultant with over a decade of experience building systems that expose failures, reduce flakiness, and make complex workflows repeatable. He applies that discipline to AI-agent validation, LLM testing, and postmortems.

He shares small open source utilities from real automation work, including: waitless (flaky tests), sb-stealth-wrapper (bot detection), selenium-teleport (state persistence), selenium-chatbot-test (AI chatbot testing), lumos-shadowdom (Shadow DOM), and visual-guard (visual regression).

Share this article: