added possibility to generate a UI test

7 files changed, 68 insertions, 4 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index d2d939a046..0d6fdb899f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -20,7 +20,10 @@ This is a changelog for Piwik platform developers. All changes for our HTTP API'
 * The following classes have been deprecated:
   * `Piwik\TaskScheduler`: use `Piwik\Scheduler\Scheduler` instead
   * `Piwik\ScheduledTask`: use `Piwik\Scheduler\Task` instead
-  
+ 
+### New features
+* You can now generate UI / screenshot tests using the command `generate:test`
+
 ### Library updates
 * Updated AngularJS from 1.2.26 to 1.2.28
 
diff --git a/plugins/CoreConsole/Commands/GenerateTest.php b/plugins/CoreConsole/Commands/GenerateTest.php
index 6047f2ddc7..ee9b8ee4c7 100644
--- a/plugins/CoreConsole/Commands/GenerateTest.php
+++ b/plugins/CoreConsole/Commands/GenerateTest.php
@@ -24,7 +24,7 @@ class GenerateTest extends GeneratePluginBase
             ->setDescription('Adds a test to an existing plugin')
             ->addOption('pluginname', null, InputOption::VALUE_REQUIRED, 'The name of an existing plugin')
             ->addOption('testname', null, InputOption::VALUE_REQUIRED, 'The name of the test to create')
-            ->addOption('testtype', null, InputOption::VALUE_REQUIRED, 'Whether you want to create a "unit", "integration" or "system" test');
+            ->addOption('testtype', null, InputOption::VALUE_REQUIRED, 'Whether you want to create a "unit", "integration", "system", or "ui" test');
     }
 
     protected function execute(InputInterface $input, OutputInterface $output)
@@ -37,7 +37,9 @@ class GenerateTest extends GeneratePluginBase
         $replace       = array(
             'ExamplePlugin'    => $pluginName,
             'SimpleTest'       => $testName,
-            'SimpleSystemTest' => $testName
+            'SimpleSystemTest' => $testName,
+            'SimpleUITest_spec.js' => $testName . '_spec.js',
+            'SimpleUITest'     => $testName,
          );
 
         $whitelistFiles = $this->getTestFilesWhitelist($testType);
@@ -108,7 +110,7 @@ class GenerateTest extends GeneratePluginBase
 
     public function getValidTypes()
     {
-        return array('unit', 'integration', 'system');
+        return array('unit', 'integration', 'system', 'ui');
     }
 
     /**
@@ -145,6 +147,17 @@ class GenerateTest extends GeneratePluginBase
      */
     protected function getTestFilesWhitelist($testType)
     {
+        if ('Ui' == $testType) {
+            return array(
+                '/tests',
+                '/tests/UI',
+                '/tests/UI/.gitignore',
+                '/tests/UI/expected-ui-screenshots',
+                '/tests/UI/expected-ui-screenshots/.gitkeep',
+                '/tests/UI/SimpleUITest_spec.js',
+            );
+        }
+
         if ('System' == $testType) {
             return array(
                 '/.gitignore',
diff --git a/plugins/ExamplePlugin/tests/UI/.gitignore b/plugins/ExamplePlugin/tests/UI/.gitignore
new file mode 100644
index 0000000000..f39be478e7
--- /dev/null
+++ b/plugins/ExamplePlugin/tests/UI/.gitignore
@@ -0,0 +1,2 @@
+/processed-ui-screenshots
+/screenshot-diffs
\ No newline at end of file
diff --git a/plugins/ExamplePlugin/tests/UI/SimpleUITest_spec.js b/plugins/ExamplePlugin/tests/UI/SimpleUITest_spec.js
new file mode 100644
index 0000000000..f4c1580622
--- /dev/null
+++ b/plugins/ExamplePlugin/tests/UI/SimpleUITest_spec.js
@@ -0,0 +1,46 @@
+/*!
+ * Piwik - free/libre analytics platform
+ *
+ * Screenshot integration tests.
+ *
+ * @link http://piwik.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+
+describe("SimpleUITest", function () {
+    this.timeout(0);
+
+    // uncomment this if you want to define a custom fixture to load before the test instead of the default one
+    // this.fixture = "Piwik\\Plugins\\ExamplePlugin\\tests\\Fixtures\\YOUR_FIXTURE_NAME";
+
+    var generalParams = 'idSite=1&period=day&date=2010-01-03',
+        urlBase = 'module=CoreHome&action=index&' + generalParams;
+
+    before(function () {
+        testEnvironment.pluginsToLoad = ['ExamplePlugin'];
+        testEnvironment.save();
+    });
+
+    it('should load a simple page by its module and action and take a full screenshot', function (done) {
+        var screenshotName = 'simple_page';
+        // will take a screenshot and store it in "processed-ui-screenshots/SimpleUITest_simple_page.png"
+        var urlToTest = "?" + generalParams + "&module=ExamplePlugin&action=index";
+
+        expect.screenshot(screenshotName).to.be.capture(function (page) {
+            page.load(urlToTest);
+        }, done);
+    });
+
+    it('should load a simple page by its module and action and take a partial screenshot', function (done) {
+        var screenshotName  = 'simple_page_partial';
+        // will take a screenshot and store it in "processed-ui-screenshots/SimpleUITest_simple_page_partial.png"
+        var contentSelector = '#root,.expandDataTableFooterDrawer';
+        // take a screenshot only of the content of this CSS/jQuery selector
+        var urlToTest       = "?" + generalParams + "&module=ExamplePlugin&action=index";
+        // "?" + urlBase + "#" + generalParams + "&module=ExamplePlugin&action=index"; this defines a URL for a page within the dashboard
+
+        expect.screenshot(screenshotName).to.be.captureSelector(contentSelector, function (page) {
+            page.load(urlToTest);
+        }, done);
+    });
+});
\ No newline at end of file
diff --git a/plugins/ExamplePlugin/tests/UI/expected-ui-screenshots/.gitkeep b/plugins/ExamplePlugin/tests/UI/expected-ui-screenshots/.gitkeep
new file mode 100644
index 0000000000..e69de29bb2
--- /dev/null
+++ b/plugins/ExamplePlugin/tests/UI/expected-ui-screenshots/.gitkeep
diff --git a/plugins/ExamplePlugin/tests/UI/expected-ui-screenshots/SimpleUITest_simple_page.png b/plugins/ExamplePlugin/tests/UI/expected-ui-screenshots/SimpleUITest_simple_page.png
new file mode 100644
index 0000000000..7b84c80fc1
--- /dev/null
+++ b/plugins/ExamplePlugin/tests/UI/expected-ui-screenshots/SimpleUITest_simple_page.png
diff --git a/plugins/ExamplePlugin/tests/UI/expected-ui-screenshots/SimpleUITest_simple_page_partial.png b/plugins/ExamplePlugin/tests/UI/expected-ui-screenshots/SimpleUITest_simple_page_partial.png
new file mode 100644
index 0000000000..386280a3b8
--- /dev/null
+++ b/plugins/ExamplePlugin/tests/UI/expected-ui-screenshots/SimpleUITest_simple_page_partial.png