Merge pull request #7298 from LeeDr/dashboardTests

New dashboard tests using elasticdump

package.json

@@ -152,6 +152,7 @@
     "auto-release-sinon": "1.0.3",
     "babel-eslint": "4.1.8",
     "chokidar": "1.4.3",
+    "elasticdump": "2.1.1",
     "eslint": "1.10.3",
     "eslint-plugin-mocha": "1.1.0",
     "expect.js": "0.3.1",

test/fixtures/dump_data/dashboard.mapping.json

@@ -0,0 +1 @@
+{".kibana":{"mappings":{"config":{"properties":{"buildNum":{"type":"keyword"}}},"index-pattern":{"properties":{"fields":{"type":"text","fields":{"keyword":{"type":"keyword","ignore_above":256}}},"timeFieldName":{"type":"text","fields":{"keyword":{"type":"keyword","ignore_above":256}}},"title":{"type":"text","fields":{"keyword":{"type":"keyword","ignore_above":256}}}}},"search":{"properties":{"columns":{"type":"text"},"description":{"type":"text"},"hits":{"type":"integer"},"kibanaSavedObjectMeta":{"properties":{"searchSourceJSON":{"type":"text"}}},"sort":{"type":"text"},"title":{"type":"text"},"version":{"type":"integer"}}},"visualization":{"properties":{"description":{"type":"text","fields":{"keyword":{"type":"keyword","ignore_above":256}}},"kibanaSavedObjectMeta":{"properties":{"searchSourceJSON":{"type":"text","fields":{"keyword":{"type":"keyword","ignore_above":256}}}}},"title":{"type":"text","fields":{"keyword":{"type":"keyword","ignore_above":256}}},"uiStateJSON":{"type":"text","fields":{"keyword":{"type":"keyword","ignore_above":256}}},"version":{"type":"integer"},"visState":{"type":"text","fields":{"keyword":{"type":"keyword","ignore_above":256}}}}},"server":{"properties":{"uuid":{"type":"keyword"}}},"dashboard":{"properties":{"description":{"type":"text"},"hits":{"type":"integer"},"kibanaSavedObjectMeta":{"properties":{"searchSourceJSON":{"type":"text"}}},"optionsJSON":{"type":"text"},"panelsJSON":{"type":"text"},"timeFrom":{"type":"text"},"timeRestore":{"type":"boolean"},"timeTo":{"type":"text"},"title":{"type":"text"},"uiStateJSON":{"type":"text"},"version":{"type":"integer"}}}}}}

test/functional/apps/console/_console.js

@@ -2,8 +2,6 @@ import {
   bdd,
   scenarioManager,
   common,
-  // settingsPage,
-  // headerPage,
   consolePage
 } from '../../../support';
 

test/functional/apps/console/index.js

@@ -8,10 +8,6 @@ import { bdd, remote, scenarioManager, defaultTimeout } from '../../../support';
       return remote.setWindowSize(1200,800);
     });
 
-    bdd.after(function unloadMakelogs() {
-      return scenarioManager.unload('logstashFunctional');
-    });
-
     require('./_console');
   });
 }());

test/functional/apps/dashboard/_dashboard.js

@@ -0,0 +1,140 @@
+import {
+  bdd,
+  common,
+  dashboardPage,
+  headerPage,
+  scenarioManager,
+  esClient,
+  elasticDump
+} from '../../../support';
+
+(function () {
+  var expect = require('expect.js');
+
+  (function () {
+    bdd.describe('dashboard tab', function describeIndexTests() {
+
+      bdd.before(function () {
+
+        var fromTime = '2015-09-19 06:31:44.000';
+        var toTime = '2015-09-23 18:31:44.000';
+
+        common.debug('Starting dashboard before method');
+        common.debug('navigateToApp dashboard');
+        return esClient.delete('.kibana')
+        .then(function () {
+          return common.try(function () {
+            return esClient.updateConfigDoc({'dateFormat:tz':'UTC', 'defaultIndex':'logstash-*'});
+          });
+        })
+        // and load a set of makelogs data
+        .then(function loadkibana4() {
+          common.debug('load kibana index with visualizations');
+          return elasticDump.elasticLoad('dashboard','.kibana');
+        })
+        .then(function () {
+          return scenarioManager.loadIfEmpty('logstashFunctional');
+        })
+        .then(function () {
+          return common.navigateToApp('dashboard');
+        })
+        .catch(common.handleError(this));
+      });
+
+
+      bdd.describe('add visualizations to dashboard', function dashboardTest() {
+        var visualizations = ['Visualization漢字 AreaChart',
+          'Visualization☺漢字 DataTable',
+          'Visualization漢字 LineChart',
+          'Visualization PieChart',
+          'Visualization TileMap',
+          'Visualization☺ VerticalBarChart',
+          'Visualization MetricChart'
+        ];
+
+
+        bdd.it('should be able to add visualizations to dashboard', function addVisualizations() {
+
+          function addVisualizations(arr) {
+            return arr.reduce(function (promise, vizName) {
+              return promise
+              .then(function () {
+                return dashboardPage.addVisualization(vizName);
+              });
+            }, Promise.resolve());
+          }
+
+          return addVisualizations(visualizations)
+          .then(function () {
+            common.debug('done adding visualizations');
+          });
+
+        });
+
+        bdd.it('set the timepicker time to that which contains our test data', function setTimepicker() {
+          var fromTime = '2015-09-19 06:31:44.000';
+          var toTime = '2015-09-23 18:31:44.000';
+          var testSubName = 'Dashboard Test 1';
+
+          // .then(function () {
+          common.debug('Set absolute time range from \"' + fromTime + '\" to \"' + toTime + '\"');
+          return headerPage.setAbsoluteRange(fromTime, toTime)
+          .then(function sleep() {
+            return common.sleep(4000);
+          })
+          .then(function takeScreenshot() {
+            common.debug('Take screenshot');
+            common.saveScreenshot('./screenshot-' + testSubName + '.png');
+          })
+          .catch(common.handleError(this));
+        });
+
+        bdd.it('should save and load dashboard', function saveAndLoadDashboard() {
+          var testSubName = 'Dashboard Test 1';
+// save time on the dashboard?
+          return dashboardPage.saveDashboard(testSubName)
+          // click New Dashboard just to clear the one we just created
+          .then(function () {
+            return dashboardPage.clickNewDashboard();
+          })
+          .then(function () {
+            return dashboardPage.loadSavedDashboard(testSubName);
+          })
+          .catch(common.handleError(this));
+        });
+
+        bdd.it('should have all the expected visualizations', function checkVisualizations() {
+          return common.tryForTime(10000, function () {
+            return dashboardPage.getPanelTitles()
+            .then(function (panelTitles) {
+              common.log('visualization titles = ' + panelTitles);
+              expect(panelTitles).to.eql(visualizations);
+            });
+          })
+          .catch(common.handleError(this));
+        });
+
+        bdd.it('should have all the expected initial sizes', function checkVisualizationSizes() {
+          var visObjects = [ { dataCol: '1', dataRow: '1', dataSizeX: '3', dataSizeY: '2', title: 'Visualization漢字 AreaChart' },
+            { dataCol: '4', dataRow: '1', dataSizeX: '3', dataSizeY: '2', title: 'Visualization☺漢字 DataTable' },
+            { dataCol: '7', dataRow: '1', dataSizeX: '3', dataSizeY: '2', title: 'Visualization漢字 LineChart' },
+            { dataCol: '10', dataRow: '1', dataSizeX: '3', dataSizeY: '2', title: 'Visualization PieChart' },
+            { dataCol: '1', dataRow: '3', dataSizeX: '3', dataSizeY: '2', title: 'Visualization TileMap' },
+            { dataCol: '4', dataRow: '3', dataSizeX: '3', dataSizeY: '2', title: 'Visualization☺ VerticalBarChart' },
+            { dataCol: '7', dataRow: '3', dataSizeX: '3', dataSizeY: '2', title: 'Visualization MetricChart' }
+          ];
+          return common.tryForTime(10000, function () {
+            return dashboardPage.getPanelData()
+            .then(function (panelTitles) {
+              common.log('visualization titles = ' + panelTitles);
+              expect(panelTitles).to.eql(visObjects);
+            });
+          })
+          .catch(common.handleError(this));
+        });
+
+      });
+
+    });
+  }());
+}());

test/functional/apps/dashboard/index.js

@@ -0,0 +1,13 @@
+import { bdd, remote, scenarioManager, defaultTimeout } from '../../../support';
+
+(function () {
+  bdd.describe('dashboard app', function () {
+    this.timeout = defaultTimeout;
+
+    bdd.before(function () {
+      return remote.setWindowSize(1200,800);
+    });
+
+    require('./_dashboard');
+  });
+}());

test/functional/index.js

@@ -24,7 +24,8 @@ define(function (require) {
       'intern/dojo/node!./status_page',
       'intern/dojo/node!./apps/settings',
       'intern/dojo/node!./apps/visualize',
-      'intern/dojo/node!./apps/console'
+      'intern/dojo/node!./apps/console',
+      'intern/dojo/node!./apps/dashboard'
     ], function () {});
   });
 });

test/support/elastic_dump.js

@@ -0,0 +1,109 @@
+import { common, config} from './';
+
+export default (function () {
+  var util = require('util');
+  var path = require('path');
+  var url = require('url');
+  var resolve = require('path').resolve;
+  var Elasticdump = require('elasticdump').elasticdump;
+
+  function ElasticDump() {
+  }
+
+  ElasticDump.prototype = {
+
+    /*
+    ** This function is basically copied from
+    ** https://github.com/taskrabbit/elasticsearch-dump/blob/master/bin/elasticdump
+    ** and allows calling elasticdump for importing or exporting data from Elasticsearch
+    */
+    elasticdumpModule: function elasticdumpModule(myinput, myoutput, index, mytype) {
+
+      var options = {
+        limit:           100,
+        offset:          0,
+        debug:           false,
+        type:            mytype,
+        delete:          false,
+        all:             false,
+        maxSockets:      null,
+        input:           myinput,
+        'input-index':   null,
+        output:          myoutput,
+        'output-index':  index,
+        inputTransport:  null,
+        outputTransport: null,
+        searchBody:      null,
+        sourceOnly:      false,
+        jsonLines:       false,
+        format:          '',
+        'ignore-errors': false,
+        scrollTime:      '10m',
+        timeout:         null,
+        skip:            null,
+        toLog:           null,
+      };
+      var dumper = new Elasticdump(options.input, options.output, options);
+
+      dumper.on('log',   function (message) { common.debug(message); });
+      dumper.on('error', function (error)   { common.debug('error', 'Error Emitted => ' + (error.message || JSON.stringify(error))); });
+
+      var promise = new Promise(function (resolve, reject) {
+        dumper.dump(function (error, totalWrites) {
+          if (error) {
+            common.debug('THERE WAS AN ERROR :-(');
+            reject(Error(error));
+          } else {
+            resolve ('elasticdumpModule success');
+          }
+        });
+      });
+      return promise;
+    },
+
+    /*
+    ** Dumps data from Elasticsearch into json files.
+    ** Takes a simple filename as input like 'dashboard' (for dashboard tests).
+    ** Appends ''.mapping.json' and '.data.json' for the actual filenames.
+    ** Writes files to the Kibana root dir.
+    ** Fails if the files already exist, so consider appending a timestamp to filename.
+    */
+    elasticDump: function elasticDump(index, file) {
+      var self = this;
+      common.debug('Dumping mapping from ' + url.format(config.servers.elasticsearch) + '/' + index
+        + ' to (' + file + '.mapping.json)');
+      return this.elasticdumpModule(url.format(config.servers.elasticsearch),
+        file + '.mapping.json', index, 'mapping')
+      .then(function () {
+        common.debug('Dumping data from ' + url.format(config.servers.elasticsearch) + '/' + index
+          + ' to (' + file + '.data.json)');
+        return self.elasticdumpModule(url.format(config.servers.elasticsearch),
+          file + '.data.json', index, 'data');
+      });
+    },
+
+    /*
+    ** Loads data from json files into Elasticsearch.
+    ** Takes a simple filename as input like 'dashboard' (for dashboard tests).
+    ** Appends ''.mapping.json' and '.data.json' for the actual filenames.
+    ** Path /test/fixtures/dump_data is hard-coded
+    */
+    elasticLoad: function elasticLoad(file, index) {
+      // TODO: should we have a flag to delete the index first?
+      // or use scenarioManager.unload(index) ? <<- currently this
+      var self = this;
+      common.debug('Loading mapping (test/fixtures/dump_data/' + file + '.mapping.json) into '
+        + url.format(config.servers.elasticsearch) + '/' + index);
+      return this.elasticdumpModule('test/fixtures/dump_data/' + file + '.mapping.json',
+        url.format(config.servers.elasticsearch), index, 'mapping')
+      .then(function () {
+        common.debug('Loading data (test/fixtures/dump_data/' + file + '.data.json) into '
+          + url.format(config.servers.elasticsearch) + '/' + index);
+        return self.elasticdumpModule('test/fixtures/dump_data/' + file + '.data.json',
+          url.format(config.servers.elasticsearch), index, 'data');
+      });
+    },
+  };
+
+  return ElasticDump;
+}());

test/support/es_client.js

@@ -0,0 +1,96 @@
+import { common, remote} from './';
+
+export default (function () {
+
+  var elasticsearch = require('elasticsearch');
+  var Promise = require('bluebird');
+
+  function EsClient(server) {
+    this.remote = remote;
+    if (!server) throw new Error('No server defined');
+
+    // NOTE: some large sets of test data can take several minutes to load
+    this.client = new elasticsearch.Client({
+      host: server,
+      requestTimeout: 300000,
+      defer: function () {
+        return Promise.defer();
+      }
+    });
+  }
+
+  EsClient.prototype = {
+    constructor: EsClient,
+
+
+    /**
+    * Delete an index
+    * @param {string} index
+    * @return {Promise} A promise that is resolved when elasticsearch has a response
+    */
+    delete: function (index) {
+
+      return this.client.indices.delete({
+        index: index
+      })
+      .catch(function (reason) {
+        // if the index never existed yet, or was already deleted it's OK
+        if (reason.message.indexOf('index_not_found_exception') < 0) {
+          common.debug('reason.message: ' + reason.message);
+          throw reason;
+        }
+      });
+    },
+
+
+    /**
+    * Add fields to the config doc (like setting timezone and defaultIndex)
+    * @return {Promise} A promise that is resolved when elasticsearch has a response
+    */
+    updateConfigDoc: function (docMap) {
+      // first we need to get the config doc's id so we can use it in our _update call
+      var self = this;
+      var configId;
+      var docMapString = JSON.stringify(docMap);
+
+      return this.client.search({
+        index: '.kibana',
+        type: 'config'
+      })
+      .then(function (response) {
+        if (response.errors) {
+          throw new Error(
+            'get config failed\n' +
+              response.items
+              .map(i => i[Object.keys(i)[0]].error)
+              .filter(Boolean)
+              .map(err => '  ' + JSON.stringify(err))
+              .join('\n')
+          );
+        } else {
+          configId = response.hits.hits[0]._id;
+          common.debug('config._id =' + configId);
+        }
+      })
+      // now that we have the id, we can update
+      // return scenarioManager.updateConfigDoc({'dateFormat:tz':'UTC', 'defaultIndex':'logstash-*'});
+      .then(function (response) {
+        common.debug('updating config with ' + docMapString);
+        return self.client.update({
+          index: '.kibana',
+          type: 'config',
+          id: configId,
+          body: {
+            'doc':
+              docMap
+          }
+        });
+      })
+      .catch(function (err) {
+        throw err;
+      });
+    }
+  };
+
+  return EsClient;
+}());

test/support/index.js

@@ -1,10 +1,13 @@
 import url from 'url';
+import EsClient from './es_client';
+import ElasticDump from './elastic_dump';
 import ScenarioManager from '../fixtures/scenario_manager';
 import Common from './pages/common';
 import DiscoverPage from './pages/discover_page';
 import SettingsPage from './pages/settings_page';
 import HeaderPage from './pages/header_page';
 import VisualizePage from './pages/visualize_page';
+import DashboardPage from './pages/dashboard_page';
 import ShieldPage from './pages/shield_page';
 import ConsolePage from './pages/console_page';
 
@@ -17,6 +20,7 @@ exports.defaultTimeout = exports.config.defaultTimeout;
 exports.defaultTryTimeout = exports.config.defaultTryTimeout;
 exports.defaultFindTimeout = exports.config.defaultFindTimeout;
 exports.scenarioManager = new ScenarioManager(url.format(exports.config.servers.elasticsearch));
+exports.esClient = new EsClient(url.format(exports.config.servers.elasticsearch));
 
 defineDelayedExport('remote', (suite) => suite.remote);
 defineDelayedExport('common', () => new Common());
@@ -24,8 +28,10 @@ defineDelayedExport('discoverPage', () => new DiscoverPage());
 defineDelayedExport('headerPage', () => new HeaderPage());
 defineDelayedExport('settingsPage', () => new SettingsPage());
 defineDelayedExport('visualizePage', () => new VisualizePage());
+defineDelayedExport('dashboardPage', () => new DashboardPage());
 defineDelayedExport('shieldPage', () => new ShieldPage());
 defineDelayedExport('consolePage', () => new ConsolePage());
+defineDelayedExport('elasticDump', () => new ElasticDump());
 
 // creates an export for values that aren't actually avaialable until
 // until tests start to run. These getters will throw errors if the export

test/support/pages/common.js

@@ -1,4 +1,4 @@
-import { common, config, defaultTryTimeout, defaultFindTimeout, remote, shieldPage } from '../';
+import { config, defaultTryTimeout, defaultFindTimeout, remote, shieldPage } from '../';
 
 export default (function () {
   var Promise = require('bluebird');
@@ -280,6 +280,7 @@ export default (function () {
         .setFindTimeout(defaultFindTimeout)
         .findDisplayedByCssSelector(testSubjSelector(selector));
     }
+
   };
 
   return Common;

test/support/pages/dashboard_page.js

@@ -0,0 +1,200 @@
+import { remote, common, defaultFindTimeout } from '../';
+
+export default (function () {
+  var thisTime;
+
+  function DashboardPage() {
+    this.remote = remote;
+    thisTime = this.remote.setFindTimeout(defaultFindTimeout);
+  }
+
+  DashboardPage.prototype = {
+    constructor: DashboardPage,
+
+    clickNewDashboard: function clickNewDashboard() {
+      return thisTime
+      .findByCssSelector('button.ng-scope[aria-label="New Dashboard"]')
+      .click();
+    },
+
+    clickAddVisualization: function clickAddVisualization() {
+      return thisTime
+      .findByCssSelector('button.ng-scope[aria-label="Add a panel to the dashboard"]')
+      .click();
+    },
+
+    filterVizNames: function filterVizNames(vizName) {
+      return thisTime
+      .findByCssSelector('input[placeholder="Visualizations Filter..."]')
+      .click()
+      .pressKeys(vizName);
+    },
+
+    clickVizNameLink: function clickVizNameLink(vizName) {
+      return thisTime
+      .findByLinkText(vizName)
+      .click();
+    },
+
+    closeAddVizualizationPanel: function closeAddVizualizationPanel() {
+      common.debug('-------------close panel');
+      return thisTime
+      .findByCssSelector('i.fa fa-chevron-up')
+      .click();
+    },
+
+    addVisualization: function addVisualization(vizName) {
+      var self = this;
+      return this.clickAddVisualization()
+      .then(function () {
+        common.debug('filter visualization (' + vizName + ')');
+        return self.filterVizNames(vizName);
+      })
+      // this second wait is usually enough to avoid the
+      // 'stale element reference: element is not attached to the page document'
+      // on the next step
+      .then(function () {
+        return common.sleep(1000);
+      })
+      .then(function () {
+        // but wrap in a try loop since it can still happen
+        return common.try(function () {
+          common.debug('click visualization (' + vizName + ')');
+          return self.clickVizNameLink(vizName);
+        });
+      })
+      // this second click of 'Add' collapses the Add Visualization pane
+      .then(function () {
+        return self.clickAddVisualization();
+      });
+    },
+
+    saveDashboard: function saveDashboard(dashName) {
+      var self = this;
+      return thisTime
+      .findByCssSelector('button.ng-scope[aria-label="Save Dashboard"]')
+      .click()
+      .then(function () {
+        return common.sleep(1000);
+      })
+      .then(function () {
+        common.debug('saveButton button clicked');
+        return thisTime
+        .findById('dashboardTitle')
+        .type(dashName);
+      })
+      // click save button
+      .then(function () {
+        return thisTime
+        .findByCssSelector('.btn-primary')
+        .click();
+      })
+      // verify that green message at the top of the page.
+      // it's only there for about 5 seconds
+      .then(function () {
+        return thisTime
+        .findByCssSelector('kbn-truncated.toast-message.ng-isolate-scope')
+        .getVisibleText();
+      });
+    },
+
+    clickDashboardByLinkText: function clickDashboardByLinkText(dashName) {
+      return thisTime
+      .findByLinkText(dashName)
+      .click();
+    },
+
+    // use the search filter box to narrow the results down to a single
+    // entry, or at least to a single page of results
+    loadSavedDashboard: function loadSavedDashboard(dashName) {
+      var self = this;
+      return thisTime
+      .findByCssSelector('button.ng-scope[aria-label="Load Saved Dashboard"]')
+      .click()
+      .then(function filterDashboard() {
+        common.debug('Load Saved Dashboard button clicked');
+        return self.remote
+        .findByCssSelector('input[name="filter"]')
+        .click()
+        .type(dashName.replace('-',' '));
+      })
+      .then(function () {
+        return common.sleep(1000);
+      })
+      .then(function clickDashboardByLinkedText() {
+        return self
+        .clickDashboardByLinkText(dashName);
+      });
+    },
+
+
+    getPanelTitles: function getPanelTitles() {
+      common.debug('in getPanelTitles');
+      return thisTime
+      .findAllByCssSelector('span.panel-title')
+      .then(function (titleObjects) {
+
+        function getTitles(chart) {
+          return chart.getAttribute('title');
+        }
+
+        var getTitlePromises = titleObjects.map(getTitles);
+        return Promise.all(getTitlePromises);
+      });
+    },
+
+    getPanelData: function getPanelData() {
+      common.debug('in getPanelData');
+      return thisTime
+      .findAllByCssSelector('li.gs-w')
+      .then(function (titleObjects) {
+
+        function getTitles(chart) {
+          var obj = {};
+          return chart.getAttribute('data-col')
+          .then(function (theData) {
+            obj = {dataCol:theData};
+            return chart;
+          })
+          .then(function (chart) {
+            return chart.getAttribute('data-row')
+            .then(function (theData) {
+              obj.dataRow = theData;
+              return chart;
+            });
+          })
+          .then(function (chart) {
+            return chart.getAttribute('data-sizex')
+            .then(function (theData) {
+              obj.dataSizeX = theData;
+              return chart;
+            });
+          })
+          .then(function (chart) {
+            return chart.getAttribute('data-sizey')
+            .then(function (theData) {
+              obj.dataSizeY = theData;
+              return chart;
+            });
+          })
+          .then(function (chart) {
+            return chart.findByCssSelector('span.panel-title')
+            .then(function (titleElement) {
+              return titleElement.getAttribute('title');
+            })
+            .then(function (theData) {
+              obj.title = theData;
+              return obj;
+            });
+          });
+        }
+
+        var getTitlePromises = titleObjects.map(getTitles);
+        return Promise.all(getTitlePromises);
+      });
+    }
+
+  };
+
+  return DashboardPage;
+}());