additional vislib unit tests (#13949)

* additional vislib unit tests

* removing unused code
(cherry picked from commit 78e71c5)

src/ui/public/vislib/__tests__/components/heatmap_color.js

@@ -9,41 +9,47 @@ describe('Vislib Heatmap Color Module Test Suite', function () {
 
   beforeEach(ngMock.module('kibana'));
 
+  it('should throw an error if schema is invalid', function () {
+    expect(function () {
+      getHeatmapColors(4, 'invalid schema');
+    }).to.throwError();
+  });
+
   it('should throw an error if input is not a number', function () {
     expect(function () {
-      getHeatmapColors([200]);
+      getHeatmapColors([200], 'Greens');
     }).to.throwError();
 
     expect(function () {
-      getHeatmapColors('help');
+      getHeatmapColors('help', 'Greens');
     }).to.throwError();
 
     expect(function () {
-      getHeatmapColors(true);
+      getHeatmapColors(true, 'Greens');
     }).to.throwError();
 
     expect(function () {
-      getHeatmapColors(notAValue);
+      getHeatmapColors(notAValue, 'Greens');
     }).to.throwError();
 
     expect(function () {
-      getHeatmapColors(nullValue);
+      getHeatmapColors(nullValue, 'Greens');
     }).to.throwError();
 
     expect(function () {
-      getHeatmapColors(emptyObject);
+      getHeatmapColors(emptyObject, 'Greens');
     }).to.throwError();
   });
 
   it('should throw an error if input is less than 0', function () {
     expect(function () {
-      getHeatmapColors(-2);
+      getHeatmapColors(-2, 'Greens');
     }).to.throwError();
   });
 
   it('should throw an error if input is greater than 9', function () {
     expect(function () {
-      getHeatmapColors(10);
+      getHeatmapColors(10, 'Greens');
     }).to.throwError();
   });
 
@@ -59,4 +65,12 @@ describe('Vislib Heatmap Color Module Test Suite', function () {
     }
   });
 
+  describe('drawColormap function', () => {
+    it('should return canvas element', () => {
+      const response = getHeatmapColors.prototype.drawColormap('Greens');
+      expect(typeof response).to.equal('object');
+      expect(response instanceof window.HTMLElement).to.equal(true);
+    });
+  });
+
 });

src/ui/public/vislib/__tests__/lib/axis_title.js

@@ -1,5 +1,6 @@
 import d3 from 'd3';
 import _ from 'lodash';
+import $ from 'jquery';
 import ngMock from 'ng_mock';
 import expect from 'expect.js';
 import { VislibLibAxisTitleProvider } from 'ui/vislib/lib/axis/axis_title';
@@ -18,6 +19,7 @@ describe('Vislib AxisTitle Class Test Suite', function () {
   let dataObj;
   let xTitle;
   let yTitle;
+  let visConfig;
   const data = {
     hits: 621,
     ordered: {
@@ -104,7 +106,7 @@ describe('Vislib AxisTitle Class Test Suite', function () {
 
 
     dataObj = new Data(data, new PersistedState());
-    const visConfig = new VisConfig({
+    visConfig = new VisConfig({
       type: 'histogram'
     }, data, new PersistedState(), el.node());
     const xAxisConfig = new AxisConfig(visConfig, {
@@ -127,6 +129,19 @@ describe('Vislib AxisTitle Class Test Suite', function () {
     el.remove();
   });
 
+  it('should not do anything if title.show is set to false', function () {
+    const xAxisConfig = new AxisConfig(visConfig, {
+      position: 'bottom',
+      show: false,
+      title: {
+        text: dataObj.get('xAxisLabel')
+      }
+    });
+    xTitle = new AxisTitle(xAxisConfig);
+    xTitle.render();
+    expect($(el.node()).find('.x-axis-title').find('svg').length).to.be(0);
+  });
+
   describe('render Method', function () {
     beforeEach(function () {
       xTitle.render();

src/ui/public/vislib/__tests__/lib/layout/splits/gauge_chart/splits.js

@@ -0,0 +1,193 @@
+import d3 from 'd3';
+import ngMock from 'ng_mock';
+import expect from 'expect.js';
+import $ from 'jquery';
+import VislibLibLayoutSplitsGaugeChartChartSplitProvider from 'ui/vislib/lib/layout/splits/gauge_chart/chart_split';
+import VislibLibLayoutSplitsGaugeChartChartTitleSplitProvider from 'ui/vislib/lib/layout/splits/gauge_chart/chart_title_split';
+
+describe('Vislib Gauge Split Function Test Suite', function () {
+  describe('Column Chart', function () {
+    let chartSplit;
+    let chartTitleSplit;
+    let el;
+    const data = {
+      rows: [
+        {
+          hits      : 621,
+          label     : '',
+          ordered   : {
+            date    : true,
+            interval: 30000,
+            max     : 1408734982458,
+            min     : 1408734082458
+          },
+          series    : [
+            {
+              values: [
+                {
+                  x: 1408734060000,
+                  y: 8
+                },
+                {
+                  x: 1408734090000,
+                  y: 23
+                },
+                {
+                  x: 1408734120000,
+                  y: 30
+                },
+                {
+                  x: 1408734150000,
+                  y: 28
+                },
+                {
+                  x: 1408734180000,
+                  y: 36
+                },
+                {
+                  x: 1408734210000,
+                  y: 30
+                },
+                {
+                  x: 1408734240000,
+                  y: 26
+                },
+                {
+                  x: 1408734270000,
+                  y: 22
+                },
+                {
+                  x: 1408734300000,
+                  y: 29
+                },
+                {
+                  x: 1408734330000,
+                  y: 24
+                }
+              ]
+            }
+          ],
+          xAxisLabel: 'Date Histogram',
+          yAxisLabel: 'Count'
+        },
+        {
+          hits      : 621,
+          label     : '',
+          ordered   : {
+            date    : true,
+            interval: 30000,
+            max     : 1408734982458,
+            min     : 1408734082458
+          },
+          series    : [
+            {
+              values: [
+                {
+                  x: 1408734060000,
+                  y: 8
+                },
+                {
+                  x: 1408734090000,
+                  y: 23
+                },
+                {
+                  x: 1408734120000,
+                  y: 30
+                },
+                {
+                  x: 1408734150000,
+                  y: 28
+                },
+                {
+                  x: 1408734180000,
+                  y: 36
+                },
+                {
+                  x: 1408734210000,
+                  y: 30
+                },
+                {
+                  x: 1408734240000,
+                  y: 26
+                },
+                {
+                  x: 1408734270000,
+                  y: 22
+                },
+                {
+                  x: 1408734300000,
+                  y: 29
+                },
+                {
+                  x: 1408734330000,
+                  y: 24
+                }
+              ]
+            }
+          ],
+          xAxisLabel: 'Date Histogram',
+          yAxisLabel: 'Count'
+        }
+      ]
+    };
+
+    beforeEach(ngMock.module('kibana'));
+    beforeEach(ngMock.inject(function (Private) {
+      chartSplit = Private(VislibLibLayoutSplitsGaugeChartChartSplitProvider);
+      chartTitleSplit = Private(VislibLibLayoutSplitsGaugeChartChartTitleSplitProvider);
+
+      el = d3.select('body').append('div')
+        .attr('class', 'visualization')
+        .datum(data);
+    }));
+
+    afterEach(function () {
+      el.remove();
+    });
+
+    describe('chart split function', function () {
+      let fixture;
+
+      beforeEach(ngMock.inject(function () {
+        fixture = d3.select('.visualization').call(chartSplit);
+      }));
+
+      afterEach(function () {
+        fixture.remove();
+      });
+
+      it('should append the correct number of divs', function () {
+        expect($('.chart').length).to.be(2);
+      });
+
+      it('should add the correct class name', function () {
+        expect(!!$('.chart-wrapper-row').length).to.be(true);
+      });
+    });
+
+    describe('chart title split function', function () {
+      let visEl;
+
+      beforeEach(ngMock.inject(function () {
+        visEl = el.append('div').attr('class', 'vis-wrapper');
+        visEl.append('div').attr('class', 'x-axis-chart-title');
+        visEl.append('div').attr('class', 'y-axis-chart-title');
+        visEl.select('.x-axis-chart-title').call(chartTitleSplit);
+        visEl.select('.y-axis-chart-title').call(chartTitleSplit);
+
+      }));
+
+      afterEach(function () {
+        visEl.remove();
+      });
+
+      it('should append the correct number of divs', function () {
+        expect($('.x-axis-chart-title .chart-title').length).to.be(2);
+        expect($('.y-axis-chart-title .chart-title').length).to.be(2);
+      });
+
+
+    });
+
+  });
+});

src/ui/public/vislib/__tests__/lib/types/point_series.js

@@ -9,7 +9,22 @@ describe('Point Series Config Type Class Test Suite', function () {
   const histogramConfig = {
     type: 'histogram',
     addLegend: true,
-    addTooltip: true,
+    tooltip: {
+      show: true
+    },
+    categoryAxes: [
+      {
+        id: 'CategoryAxis-1',
+        type: 'category',
+        title: {}
+      }
+    ],
+    valueAxes: [{
+      id: 'ValueAxis-1',
+      type: 'value',
+      labels: {},
+      title: {}
+    }]
   };
 
   const heatmapConfig = {
@@ -25,7 +40,7 @@ describe('Point Series Config Type Class Test Suite', function () {
   };
 
   const data = {
-    get: (prop) => { return data[prop] || null; },
+    get: (prop) => { return data[prop] || data.data[prop] ||  null; },
     getLabels: () => [],
     data: {
       hits: 621,
@@ -64,7 +79,8 @@ describe('Point Series Config Type Class Test Suite', function () {
         { label: 's26', values: [{ x: 1408734060000, y: 8 }] }
       ],
       xAxisLabel: 'Date Histogram',
-      yAxisLabel: 'series'
+      yAxisLabel: 'series',
+      yAxisFormatter: () => 'test'
     }
 
   };
@@ -76,11 +92,16 @@ describe('Point Series Config Type Class Test Suite', function () {
 
   describe('histogram chart', function () {
     beforeEach(function () {
-      parsedConfig = pointSeriesConfig.heatmap(histogramConfig, data);
+      parsedConfig = pointSeriesConfig.column(histogramConfig, data);
     });
     it('should not throw an error when more than 25 series are provided', function () {
       expect(parsedConfig.error).to.be.undefined;
     });
+
+    it('should set axis title and formatter from data', () => {
+      expect(parsedConfig.categoryAxes[0].title.text).to.equal(data.data.xAxisLabel);
+      expect(parsedConfig.valueAxes[0].labels.axisFormatter).to.not.be.undefined;
+    });
   });
 
 

src/ui/public/vislib/__tests__/vis.js

@@ -64,6 +64,18 @@ dataArray.forEach(function (data, i) {
         expect($('.chart').length).to.be(numberOfCharts);
       });
 
+      it('should throw an error if no data is provided', function () {
+        expect(function () {
+          vis.render(null, persistedState);
+        }).to.throwError();
+      });
+
+    });
+
+    describe('getLegendColors method', () => {
+      it ('should return null if no colors are defined', () => {
+        expect(vis.getLegendColors()).to.equal(null);
+      });
     });
 
     describe('destroy Method', function () {

src/ui/public/vislib/__tests__/visualizations/column_chart.js

@@ -39,7 +39,11 @@ dataTypesArray.forEach(function (dataType) {
       addLegend: true,
       addTooltip: true,
       mode: mode,
-      zeroFill: true
+      zeroFill: true,
+      grid: {
+        categoryLines: true,
+        valueAxis: 'ValueAxis-1'
+      }
     };
 
     beforeEach(ngMock.module('kibana'));

src/ui/public/vislib/components/labels/labels.js

@@ -1,13 +1,11 @@
 import _ from 'lodash';
 import { VislibComponentsLabelsDataArrayProvider } from './data_array';
 import { VislibComponentsLabelsUniqLabelsProvider } from './uniq_labels';
-import { VislibComponentsLabelsPiePieLabelsProvider } from './pie/pie_labels';
 
 export function VislibComponentsLabelsLabelsProvider(Private) {
 
   const createArr = Private(VislibComponentsLabelsDataArrayProvider);
   const getArrOfUniqLabels = Private(VislibComponentsLabelsUniqLabelsProvider);
-  const getPieLabels = Private(VislibComponentsLabelsPiePieLabelsProvider);
 
   /*
    * Accepts a Kibana data object and returns an array of unique labels (strings).
@@ -16,9 +14,8 @@ export function VislibComponentsLabelsLabelsProvider(Private) {
    *
    * Currently, this service is only used for vertical bar charts and line charts.
    */
-  return function (obj, chartType) {
+  return function (obj) {
     if (!_.isObject(obj)) { throw new TypeError('LabelUtil expects an object'); }
-    if (chartType === 'pie') { return getPieLabels(obj); }
     return getArrOfUniqLabels(createArr(obj));
   };
 }

src/ui/public/vislib/components/labels/pie/get_pie_names.js

@@ -1,20 +0,0 @@
-import _ from 'lodash';
-import VislibComponentsLabelsPieReturnPieNamesProvider from './return_pie_names';
-
-export function VislibComponentsLabelsPieGetPieNamesProvider(Private) {
-  const returnNames = Private(VislibComponentsLabelsPieReturnPieNamesProvider);
-
-  return function (data, columns) {
-    const slices = data.slices;
-
-    if (slices.children) {
-      return _(returnNames(slices.children, 0, columns))
-      .sortBy(function (obj) {
-        return obj.index;
-      })
-      .pluck('key')
-      .unique()
-      .value();
-    }
-  };
-}

src/ui/public/vislib/components/labels/pie/pie_labels.js

@@ -1,26 +0,0 @@
-import _ from 'lodash';
-import { VislibComponentsLabelsPieRemoveZeroSlicesProvider } from './remove_zero_slices';
-import { VislibComponentsLabelsPieGetPieNamesProvider } from './get_pie_names';
-
-export function VislibComponentsLabelsPiePieLabelsProvider(Private) {
-  const removeZeroSlices = Private(VislibComponentsLabelsPieRemoveZeroSlicesProvider);
-  const getNames = Private(VislibComponentsLabelsPieGetPieNamesProvider);
-
-  return function (obj) {
-    if (!_.isObject(obj)) { throw new TypeError('PieLabel expects an object'); }
-
-    const data = obj.columns || obj.rows || [obj];
-    const names = [];
-
-    data.forEach(function (obj) {
-      const columns = obj.raw ? obj.raw.columns : undefined;
-      obj.slices = removeZeroSlices(obj.slices);
-
-      getNames(obj, columns).forEach(function (name) {
-        names.push(name);
-      });
-    });
-
-    return _.uniq(names);
-  };
-}

src/ui/public/vislib/components/labels/pie/remove_zero_slices.js

@@ -1,15 +0,0 @@
-import _ from 'lodash';
-
-export function VislibComponentsLabelsPieRemoveZeroSlicesProvider() {
-  return function removeZeroSlices(slices) {
-    if (!slices.children) return slices;
-
-    slices = _.clone(slices);
-    slices.children = slices.children.reduce(function (children, child) {
-      if (child.size !== 0) { children.push(removeZeroSlices(child)); }
-      return children;
-    }, []);
-
-    return slices;
-  };
-}

src/ui/public/vislib/components/labels/pie/return_pie_names.js

@@ -1,18 +0,0 @@
-// eslint-disable-next-line kibana-custom/no-default-export
-export default function ReturnPieNames() {
-  return function returnNames(array, index, columns) {
-    const names = [];
-
-    array.forEach(function (obj) {
-      names.push({ key: obj.name, index: index });
-
-      if (obj.children) {
-        returnNames(obj.children, (index + 1), columns).forEach(function (namedObj) {
-          names.push(namedObj);
-        });
-      }
-    });
-
-    return names;
-  };
-}

src/ui/public/vislib/visualizations/point_series/_point_series.js

@@ -21,12 +21,6 @@ export function VislibVisualizationsPointSeriesProvider() {
       }
     }
 
-    getStackedCount() {
-      return this.baseChart.chartConfig.series.reduce(function (sum, series) {
-        return series.mode === 'stacked' ? sum + 1 : sum;
-      }, 0);
-    }
-
     getGroupedCount() {
       const stacks = [];
       return this.baseChart.chartConfig.series.reduce((sum, series) => {
@@ -40,15 +34,6 @@ export function VislibVisualizationsPointSeriesProvider() {
       }, 0);
     }
 
-    getStackedNum(data) {
-      let i = 0;
-      for (const seri of this.baseChart.chartConfig.series) {
-        if (seri.data === data) return i;
-        if (seri.mode === 'stacked') i++;
-      }
-      return 0;
-    }
-
     getGroupedNum(data) {
       let i = 0;
       const stacks = [];