Visual regression tests integrated in Codeception.
- run twice
- phantom css
- example image
- license
- how it works
VisualCeption needs the following components to run:
- Codeception VisualCeption is a module for Codeception. It will need a running version of this tool.
- Imagick For comparing two images VisualCeption is using the imagick library for php. For more information visit php.net or the installation guide.
- WebDriver module This tool does only work with the webdriver module in Codeception the moment.
Add the module to _bootstrap.php.
include_once "/path/to/module/VisualCeption.php";
To use the VisualCeption module you have to configure it.
Example Configuration
modules:
enabled: [WebDriver, VisualCeption]
VisualCeption:
referenceImageDir: /home/codeception/referenceImages/ # Path to the reference folder
maximumDeviation: 5 # deviation in percent- referenceImageDir VisualCeption uses an "old" image for calculating the deviation. These images have to be stored in the system. This is the corresponding directory.
- maximumDeviation When comparing two images the deviation will be calculated. If this deviation is greater than the maximum deviation the test will fail.
VisualCeption is really easy to use. There is only one method that will be added to your WebGuy compareScreenshot. This will be used to name the screenshot and identify the elements that has to be screenshot.
$I->compareScreenshot( "uniqueIdentifier", "elementId" );- uniqueIdentifier For comparing the images it is important to have a stable name. This is the corresponding name.
- elementId It is possible to only compare a special div container. The element id can be passed. You can use all locators that can be used in jQuery.
Example Usage
$I->compareScreenshot( "subNavigation", "#subNav" );VisualCeption uses the WebDriver module for making the screenshots. As a consequence we are not able to take screenshots via google chrome as the chromedriver does not allow full page screenshots.