Fix issues with create screenshot

module/VisualCeption.php

@@ -29,9 +29,10 @@ class VisualCeption extends CodeceptionModule implements MultiSession
         'currentImageDir' => 'debug/visual/',
         'report' => false,
         'module' => 'WebDriver',
-        'fullScreenShot' => false
+        'fullScreenShot' => false,
+        'forceFullScreenShot' => false,
     ];
-    
+
     protected $saveCurrentImageIfFailure;
     private $referenceImageDir;
 
@@ -161,7 +162,7 @@ protected function getBrowserModule() {
 
         return null;
     }
-    
+
     /**
      * Get value of the private property $referenceImageDir
      *
@@ -179,7 +180,7 @@ public function getReferenceImageDir()
      * @param string $identifier Identifies your test object
      * @param string $elementID DOM ID of the element, which should be screenshotted
      * @param string|array $excludeElements Element name or array of Element names, which should not appear in the screenshot
-     * @param float $deviation 
+     * @param float $deviation
      */
     public function seeVisualChanges($identifier, $elementID = null, $excludeElements = array(), $deviation = null)
     {
@@ -197,7 +198,7 @@ public function seeVisualChanges($identifier, $elementID = null, $excludeElement
      * @param string $identifier identifies your test object
      * @param string $elementID DOM ID of the element, which should be screenshotted
      * @param string|array $excludeElements string of Element name or array of Element names, which should not appear in the screenshot
-     * @param float $deviation 
+     * @param float $deviation
      */
     public function dontSeeVisualChanges($identifier, $elementID = null, $excludeElements = array(), $deviation = null)
     {
@@ -411,7 +412,7 @@ private function createScreenshot($identifier, array $coords, array $excludeElem
 
         $this->hideElementsForScreenshot($excludeElements);
 
-        if ($this->config["fullScreenShot"] == true) {
+        if ($this->config["fullScreenShot"] == true || $this->config["forceFullScreenShot"] == true) {
             $height = $this->webDriver->executeScript("var ele=document.querySelector('html'); return ele.scrollHeight;");
             list($viewportHeight, $devicePixelRatio) = $this->webDriver->executeScript("return [window.innerHeight, window.devicePixelRatio]");
 
@@ -430,8 +431,15 @@ private function createScreenshot($identifier, array $coords, array $excludeElem
 
             $screenShotImage->resetIterator();
             $fullShot = $screenShotImage->appendImages(true);
-            $fullShot->writeImage($elementPath);
 
+            if ($this->config["fullScreenShot"] == true) {
+                $fullShot->writeImage($elementPath);
+            } else {
+                $fullShot->cropImage($coords['width'], $coords['height'], $coords['offset_x'], $coords['offset_y']);
+                $fullShot->writeImage($elementPath);
+            }
+
+            $this->webDriver->executeScript("window.scrollTo(0, 0);");
         } else {
             $screenshotBinary = $this->webDriver->takeScreenshot();
 
@@ -605,4 +613,4 @@ public function _closeSession($session = null)
     {
         // this method will never be needed
     }
-}
+}

readme.md

@@ -44,13 +44,13 @@ composer require "codeception/visualception:*" --dev
 
 ### Configuration
 
-To use the VisualCeption module you have to configure it. 
+To use the VisualCeption module you have to configure it.
 
 **Example Configuration**
 
 ```yaml
 modules:
-    enabled: 
+    enabled:
         - WebDriver:
             url: http://localhost.com
             browser: firefox
@@ -67,6 +67,7 @@ modules:
 * **report** (default: `false`) When enabled an HTML report with diffs for failing tests is generated. Report is stored in `tests/_output/vcresult.html`.
 * **module** (default: `'WebDriver'`) module responsible for browser interaction, default: WebDriver.
 * **fullScreenShot** (default: `false`) fullpage screenshot for Chrome and Firefox
+* **forceFullScreenShot** (default: `false`) force fullpage screenshot for Chrome and Firefox. Useful when element to capture is outside the initial window dimensions of WebDriver.
 
 ## Usage
 
@@ -82,7 +83,7 @@ $I->dontSeeVisualChanges("uniqueIdentifier3", "elementId3", array("excludeElemen
 ```
 
 * **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 CSS locators*. 
+* **elementId** It is possible to only compare a special div container. The element id can be passed. *You can use CSS locators*.
 * **excludeElements** Optional parameter as string or an array of strings to exclude an element from the screenshot. Maybe there is an animated image in your test container, so you can ignore it. *You can use CSS locators*.
 * **$deviation** Optional parameter as float use if it is necessary to establish deviation coefficient other than configuration.
 
@@ -97,10 +98,10 @@ If you need more information about the test run please use the command line debu
 ## HTML Reports
 
 Enable Reports in config and use nice HTML output to see all failed visual tests with their image diffs on a page:
-   
+
 ```yaml
 modules:
-    enabled: 
+    enabled:
         - WebDriver:
             url: http://localhost.com
             browser: firefox