Docs

Documentation versions (currently viewing)

UI Snapshots

Failure snapshot extension behavior and the format of server-side component tree output.

TreeOnFailureExtension publishes a text representation of the server-side UI component tree when a test fails. Snapshots are disabled by default and enabled with @ExtendWith(TreeOnFailureExtension.class). The tree is published as a JUnit report entry, which tools such as the JUnit console launcher show with the failure; Maven Surefire doesn’t display report entries. A failed component query includes the same tree in its error message, with or without the extension. It represents Java component state and element attributes, not a browser screenshot or rendered layout.

Reading a Snapshot

A snapshot is a tree showing every component currently in the UI, with its properties and attributes:

Source code
└── MockedUI[]
    └── HelloWorldView[@theme='spacing']
        ├── TextField[label='Your name', value='', manualValidation='true']
        └── Button[caption='Say hello']
            └── Text[text='Say hello']

Each line represents a component. The information in brackets tells you about its state:

  • Component type — the class name at the start of each line (e.g., TextField, Button).

  • Properties — server-side values like label, value, caption, and opened. These reflect the component’s Java API state.

  • Attributes — prefixed with @ (e.g., @class, @style, @theme). These are the HTML element attributes set on the component.

  • Nesting — the tree structure shows parent-child relationships, matching how components are added to layouts in your code.

For a worked example, see Debug a Failing Browserless Test.

99487CB3-54AB-4C0A-8A46-926A527EB381