Refs matomo-org#4087, rewrote UI integration tests to use phantomjs o…

…r slimerjs and added (disabled) UI tests to travis build config.

Notes:
  * Modified main page-loading JavaScript to use ajaxHelper so it's possible to know when all AJAX requests are made.
  * Add setUrl method to ajaxHelper so it can be used when a doing AJAX w/ a URL instead of an object containing query parameters.

.travis.yml

@@ -12,9 +12,10 @@ env:
     - TEST_SUITE=PluginTests
     - TEST_SUITE=CoreTests
     - TEST_SUITE=IntegrationTests
+    #- TEST_DIR=UI
   global:
     secure: "AMhZmPZx4SUcuZRBzGHlQPxzM4D8FvFB3UThDa52gbi9KIBrwcumzV2VGi6B\n5fgjwtB4XTE1In7qhY2HMikPWBmWYYOQ5QcMPJsqqHt4iMmahx8WKzne6NOk\nNpqAuje/fulNGeP2LJZi0nrub3Fh4VwXaOvpNloKNQN/2JuqPtM="
-  
+
 # Run PHP 5.4 for aa tests to generate
 # code coverage.
 

core/AssetManager.php

@@ -284,6 +284,7 @@ private static function sortCssFiles($cssFiles)
             'plugins/Zeitgeist/stylesheets/',
             'plugins/',
             'plugins/Dashboard/stylesheets/dashboard.less',
+            'tests/',
         );
 
         return self::prioritySort($priorityCssOrdered, $cssFiles);
@@ -380,6 +381,7 @@ private static function sortJsFiles($jsFiles)
             'plugins/Zeitgeist/javascripts/',
             'plugins/CoreHome/javascripts/broadcast.js',
             'plugins/',
+            'tests/',
         );
 
         return self::prioritySort($priorityJsOrdered, $jsFiles);

plugins/CoreHome/javascripts/broadcast.js

@@ -394,16 +394,13 @@ var broadcast = {
             }
         }
 
-        var ajaxRequest = {
-            type: 'POST',
-            url: urlAjax,
-            dataType: 'html',
-            async: true,
-            error: broadcast.customAjaxHandleError,	// Callback when the request fails
-            success: sectionLoaded, // Callback when the request succeeds
-            data: {}
-        };
-        globalAjaxQueue.push($.ajax(ajaxRequest));
+        var ajax = new ajaxHelper();
+        ajax.setUrl(urlAjax);
+        ajax.setErrorCallback(broadcast.customAjaxHandleError);
+        ajax.setCallback(sectionLoaded);
+        ajax.setFormat('html');
+        ajax.send();
+
         return false;
     },
 

plugins/CoreHome/stylesheets/coreHome.less

@@ -40,7 +40,6 @@ h3 {
 .pageWrap {
   border-left: 1px solid #DDDDDD;
   border-right: 1px solid #DDDDDD;
-  max-height: 681px;
   min-height: 10px;
   overflow: visible;
   padding: 15px 15px 0;

plugins/Zeitgeist/javascripts/ajaxHelper.js

@@ -11,19 +11,32 @@
  * @type {Array} array holding XhrRequests with automatic cleanup
  */
 var globalAjaxQueue = [];
+globalAjaxQueue.active = 0;
 
 /**
- * Extend Array.push with automatic cleanup for finished requests
- *
- * @return {Object}
+ * Removes all finished requests from the queue.
+ * 
+ * @return {void}
  */
-globalAjaxQueue.push = function () {
-    // cleanup ajax queue
+globalAjaxQueue.clean = function () {
     for (var i = this.length; i--;) {
         if (!this[i] || this[i].readyState == 4) {
             this.splice(i, 1);
         }
     }
+};
+
+/**
+ * Extend Array.push with automatic cleanup for finished requests
+ *
+ * @return {Object}
+ */
+globalAjaxQueue.push = function () {
+    this.active += arguments.length;
+
+    // cleanup ajax queue
+    this.clean();
+
     // call original array push
     return Array.prototype.push.apply(this, arguments);
 };
@@ -40,6 +53,8 @@ globalAjaxQueue.abort = function () {
     }
     // remove all elements from array
     this.splice(0, this.length);
+
+    this.active = 0;
 };
 
 /**
@@ -85,6 +100,13 @@ function ajaxHelper() {
      */
     this.getParams =      {};
 
+    /**
+     * Base URL used in the AJAX request. Can be set by setUrl.
+     * @type {String}
+     * @see ajaxHelper.setUrl
+     */
+    this.getUrl = 'index.php?';
+
     /**
      * Params to be passed as GET params
      * @type {Object}
@@ -119,6 +141,10 @@ function ajaxHelper() {
      * @return {void}
      */
     this.addParams = function (params, type) {
+        if (typeof params == 'string') {
+            params = broadcast.getValuesFromUrl(params);
+        }
+
         for (var key in params) {
             if(type.toLowerCase() == 'get') {
                 this.getParams[key] = params[key];
@@ -128,6 +154,15 @@ function ajaxHelper() {
         }
     };
 
+    /**
+     * Sets the base URL to use in the AJAX request.
+     * 
+     * @param {string} url
+     */
+    this.setUrl = function (url) {
+        this.getUrl = url;
+    };
+
     /**
      * Gets this helper instance ready to send a bulk request. Each argument to this
      * function is a single request to use.
@@ -300,7 +335,10 @@ function ajaxHelper() {
 
         var parameters = this._mixinDefaultGetParams(this.getParams);
 
-        var url = 'index.php?';
+        var url = this.getUrl;
+        if (url[url.length - 1] != '?') {
+            url += '&';
+        }
 
         // we took care of encoding &segment properly already, so we don't use $.param for it ($.param URL encodes the values)
         if(parameters['segment']) {
@@ -328,10 +366,17 @@ function ajaxHelper() {
                         $(that.errorElement).html(response.message).fadeIn();
                         piwikHelper.lazyScrollTo(that.errorElement, 250);
                     }
-                    return;
+                } else {
+                    that.callback(response);
                 }
 
-                that.callback(response);
+                --globalAjaxQueue.active;
+                var piwik = window.piwik;
+                if (piwik
+                    && piwik.ajaxRequestFinished
+                ) {
+                    piwik.ajaxRequestFinished();
+                }
             },
             data:     this._mixinDefaultPostParams(this.postParams)
         };

tests/PHPUnit/IntegrationTestCase.php

@@ -635,7 +635,7 @@ protected function _generateApiUrls($formats = 'xml', $idSite = false, $dateTime
                                         $abandonedCarts = false, $idGoal = false, $apiModule = false, $apiAction = false,
                                         $otherRequestParameters = array(), $supertableApi = false, $fileExtension = false)
     {
-        list($pathProcessed, $pathExpected) = $this->getProcessedAndExpectedDirs();
+        list($pathProcessed, $pathExpected) = self::getProcessedAndExpectedDirs();
 
         if ($periods === false) {
             $periods = 'day';
@@ -866,9 +866,9 @@ protected function removeXmlElement($input, $xmlElement, $testNotSmallAfter = tr
         return $input;
     }
 
-    protected function getProcessedAndExpectedDirs()
+    protected static function getProcessedAndExpectedDirs()
     {
-        $path = $this->getPathToTestDirectory();
+        $path = self::getPathToTestDirectory();
         return array($path . '/processed/', $path . '/expected/');
     }
 
@@ -879,7 +879,7 @@ private function getProcessedAndExpectedPaths($testName, $testId, $format = null
             $filename .= ".$format";
         }
 
-        list($processedDir, $expectedDir) = $this->getProcessedAndExpectedDirs();
+        list($processedDir, $expectedDir) = self::getProcessedAndExpectedDirs();
 
         return array($processedDir . $filename, $expectedDir . $filename);
     }
@@ -1062,9 +1062,9 @@ protected function changeLanguage($langId)
     }
 
     /**
-     * Path where expected/processed output files are stored. Can be overridden.
+     * Path where expected/processed output files are stored.
      */
-    public function getPathToTestDirectory()
+    public static function getPathToTestDirectory()
     {
         return dirname(__FILE__) . DIRECTORY_SEPARATOR . 'Integration';
     }

tests/PHPUnit/TestingEnvironment.php

@@ -23,5 +23,12 @@ public static function addHooks()
         Piwik_AddAction('FrontController.dispatch', function() {
             \Piwik\Plugins\CoreVisualizations\Visualizations\Cloud::$debugDisableShuffle = true;
         });
+        Piwik_AddAction('AssetManager.getCssFiles', function(&$cssFiles) {
+            $cssFiles[] = 'tests/resources/screenshot-override/override.css';
+        });
+        Piwik_AddAction('AssetManager.getJsFiles', function(&$jsFiles) {
+            $jsFiles[] = 'tests/resources/screenshot-override/jquery.waitforimages.js';
+            $jsFiles[] = 'tests/resources/screenshot-override/override.js';
+        });
     }
 }