Skip to content

Visual Testing

Branko Juric edited this page Mar 25, 2019 · 12 revisions

Gwen logo

Visual Testing with AppliTools

Visual testing with AppliTools is supported as of gwen-web version 2.32.0.

See also: Blog post on this topic

AppliTools License Key

To use this capability, you must set the APPLITOOLS_API_KEY environment variable on your host to your AppliTools API key (visit https://applitools.com/ to purchase a license if you require one). Gwen will report an error if you attempt to use this feature without setting this key and you will not be able to perform any visual testing.

Gwen Visual Testing DSL

The following visual testing steps are available:

I start visual test as "<name>"

  • Opens a new AppliTools Eyes session and starts a new test with the given name and current viewport size.

I start visual test as "<name>" in <width> x <height> viewport

  • Opens a new AppliTools Eyes session and starts a new test with the given name and viewport size.

I check <viewport|full page> visual as "<name>"

  • Saves a checkpoint image of the current viewport or full page with the given name and default match level of STRICT.

I check <viewport|full page> visual as "<name>" using LAYOUT|LAYOUT2|CONTENT|STRICT|EXACT|NONE match

  • Saves a checkpoint image of the current viewport or full page with the given name and match level.

the visual test should pass

  • Closes the current Eyes session and captures the results of the visual test. If the test fails an error is reported. In either case a link to the dashboard is provided in the console and generated reports.

Sample Usage

The example below interacts with Applitools to perform a visual test consisting of 3 checkpoints.

 Feature: Todo items visual test

Scenario: Add items in my Todo list
    Given I launch the Todo app
      And I start visual test as "Todo items" in 600 x 600 viewport
      And I check viewport visual as "No Todo items" using STRICT match
     When I add a "Walk the dog" item
      And I add a "Get the milk" item
     Then the number of active items should be "2"
      And I check viewport visual as "Active Todo items" using STRICT match

Scenario: Complete one item
   When I tick the "Get the milk" item
     Then the number of active items should be "1"
      And I check viewport visual as "One completed Todo item" using STRICT match

Scenario: Complete another item
     When I tick the "Walk the dog" item
     Then the number of active items should be "0"
      And I check viewport visual as "All completed Todo items" using STRICT match
      And the visual test should pass

This example (taken from here) inlines the visual testing steps in the feature, but you could choose to externalise them to Gwen meta to keep your features clean if you wish.

AppliTools Dashboard Links

The console output and generated Gwen report will contain a link to your Applitools dashboard containing the results of the the visual test should pass step (last scenario shown below):

INFO - Evaluating Step: And the visual test should pass
INFO - Visual check status: Passed. Details at: <dashboard url>
INFO - [406ms] Passed Step: And the visual test should pass
Screen Shot 2019-03-21 at 11 55 35 pm

Clicking the link will take you to your AppliTools dashboard showing all images and results:

Screen Shot 2019-03-21 at 11 58 34 pm

AppliTools Settings

The following Gwen settings can be used to control certain aspects:

gwen.applitools.eyes.enabled

  • Controls whether or not visual testing is enabled or not. Valid values include: true or false (default is true). When disabled, the steps that constitute the visual testing DSL above will perform no operation and those steps will be greyed out in reports.

gwen.applitools.eyes.batchName

  • Used to set the batch name in AppliTools (default value is 'Gwen visual tests'). Each invocation of Gwen is a new batch.

gwen.applitools.eyes.appName

  • Use to set the application name in AppliTools. If not set then the name will be derived from the file path of the current feature being executed. If the execution is in the Gwen REPL console, then it will default to 'Gwen REPL'.
You can’t perform that action at this time.