Keep useful evidence from a test run

A test result is easier to understand when you can see what happened. Reports tell you which check failed. Screenshots and page snapshots help you investigate why.

In this lesson, you will save two pictures during a successful form submission and find them in the run’s results folder.

Download evidence.bru ↓

base_url "https://aliilyas.github.io/bruster/demo/"

test "save pictures of a form submission"
  navigate "."
  screenshot "before.png"
  fill "#name" "Ada Lovelace"
  fill "#project" "Bruster"
  click "button[type=submit]"
  expect text "#result h2" "Smoke test created for Bruster"
  screenshot "after.png"
end

What screenshot does

screenshot "before.png" saves an image of the current browser viewport. A viewport is the part of the page inside the browser’s content area. It is not necessarily the whole page from top to bottom.

The first image shows the form before the fields are filled. The second is captured after the receipt heading has passed its text check. The filenames make their purpose clear.

These commands save screenshots regardless of the demo form’s Include screenshots checkbox. That checkbox only changes the demo’s state and receipt. It is not a control for the Bruster runner.

Choose where the evidence goes

Run the file with an output folder that is easy to find:

./bruster test evidence.bru --output practice-results

.\bruster.exe test evidence.bru --output practice-results

The runner creates practice-results in your working directory if it does not exist. Inside it, each run gets a unique subfolder. Bruster prints the exact location after Artifacts:.

Open that new run folder in your file manager. Inside test-001, find before.png and after.png. Open both and compare them. On the default desktop viewport, the form and receipt should fit in these example images.

Read the folder as a record of one run

JSON is a text format. You can open results.json in your editor and search for your test name or the word error. You do not have to understand every field immediately.

What is saved when a test fails?

On a failed step, Bruster also attempts to save failure.png, snapshot.json, and console.json. A snapshot describes the page’s elements. The console file can contain messages from the page’s scripts.

Bruster tries to collect this evidence, but some files may be unavailable if the browser has already crashed. Start with the error from the failed step. A missing screenshot is a separate problem and does not explain why the step failed.

A picture is evidence, not a comparison

Saving after.png does not automatically check whether its pixels match an approved design. The text assertion checks the receipt’s heading. You can review the image to see how the page looked at that point.

On a narrow screen, the receipt may be below the captured viewport. A visibility assertion can pass even when the element is farther down the page. For a worked example that scrolls before capturing the receipt, see the recording workflow tutorial.