This Concordion extension provides the capability to embed screenshots in the output specification.
The demo project demonstrates this extension using Concordion with Selenium WebDriver for end-to-end browser testing.
This extension has two main uses - taking screenshots to help diagnose test failures, and/or explicitly adding screenshots to the output for documentation purposes.
By default, the whole screen is captured using
java.awt.Robot. As an alternative, custom screenshots can be captured using the
ScreenshotTaker interface. For example, when using frameworks such as Selenium, a custom screenshot taker can capture an image of the entire web page, even if the test is running in the background.
Diagnosing test failures
When running GUI tests it can be difficult to determine what was being shown on the GUI at the time of failure , especially if the tests are running in the background or on a Continuous Integration server.
This extension adds screenshots to the Concordion output when failures or exceptions occur. It can also be configured to add screenshots on successful assertions.
The screenshot is displayed when you hover over the relevant element. Clicking on the element will open the image in the current browser window. For example, hovering over the failure in this web test:
shows a screenshot of the browser page at the time the failure occurred:
Clicking on the failure opens the image for further inspection:
(Note: this image has been truncated to save space)
: The screenshot is invoked by an assertion listener, so will occur a very short period after the failure actually occurred. In most cases, this small delay is of no consequence.
Explicitly adding screenshots to the output
This extension also provides a Concordion
screenshot command that explicitly add screenshots to the output HTML for documentation purposes.
To use the command, add an attribute named
screenshot using the namespace
"urn:concordion-extensions:2010" to an element in your Concordion HTML. For example:
<html xmlns:concordion="http://www.concordion.org/2007/concordion" xmlns:ext="urn:concordion-extensions:2010"> .... <div ext:screenshot=""/> ...
By default, the screenshot is embedded in the output HTML. If you'd rather have it linked, set the attribute value to 'linked', for example:
<p>See <span ext:screenshot="linked" style="text-decoration: underline;">this screen</span></p>
NOTE: If you want to use the extension only as a
command, and not to capture screenshots of test failures, you will need
to use a custom configuration that sets
false. See below for
custom configuration details.
The extension is available from Maven Central.
By default, this extension will take screenshots using
whenever an assertion fails, or an uncaught Throwable occurs in the test.
To install the extension with default configuration, either annotate the fixture class with:
or set the system property
Alternatively, use the
@Extension annotation on a ScreenshotExtension
instance field. This allows methods to be called to configure the extension.
For example, the following code configures a custom
takes screenshots on assertion success as well as failure, and limits
the maximum width of the screenshot images on mouse hover to 400 pixels.
private ScreenshotTaker camera = new SeleniumScreenshotTaker(driver); @Extension public ConcordionExtension extension = new ScreenshotExtension().setScreenshotTaker(camera).setScreenshotOnAssertionSuccess(true) .setMaxWidth(400);
By default, the screenshot will be of the full visible screen.
This can be overridden using a custom
For example, the
SeleniumScreenshotTaker in the above examples ensures that only the browser window is captured, that the full browser page is captured and that it is captured regardless of whether the browser window is currently displayed. (The
SeleniumScreenshotTaker is included in the concordion-screenshot-extension-demo project.)