fixes vislib legend filters (elastic#29592)

src/ui/public/agg_response/hierarchical/__tests__/build_hierarchical_data.js

@@ -175,7 +175,7 @@ describe('buildHierarchicalData', function () {
       expect(results.rows[0].slices).to.have.property('children');
       expect(results.rows[0].slices.children).to.have.length(2);
       expect(results.rows[0].slices.children[0]).to.have.property('aggConfigResult');
-      expect(results.rows[0].slices.children[0].aggConfigResult.$parent.$parent).to.have.property('key', 'png');
+      expect(results.rows[0].slices.children[0].aggConfigResult.$parent).to.have.property('key', 'png');
     });
 
   });

src/ui/public/agg_response/hierarchical/build_hierarchical_data.js

@@ -46,7 +46,7 @@ export function BuildHierarchicalDataProvider(Private) {
 
           let slice  = dataLevel.find(slice => slice.name === name);
           if (!slice) {
-            slice = { name, size, parent, aggConfig, aggConfigResult: metricColumn, children: [] };
+            slice = { name, size, parent, aggConfig, aggConfigResult: bucketColumn, children: [] };
             dataLevel.push(slice);
           }
           parent = slice;

src/ui/public/agg_response/point_series/_add_to_siri.js

@@ -29,6 +29,7 @@ export function addToSiri(series, point, id, label, agg) {
     label: label == null ? id : label,
     aggLabel: agg.type ? agg.type.makeLabel(agg) : label,
     aggId: agg.parentId ? agg.parentId : agg.id,
+    aggConfigResult: point.seriesRow,
     count: 0,
     values: [point]
   });

src/ui/public/agg_response/point_series/_get_point.js

@@ -46,11 +46,13 @@ export function getPoint(x, series, yScale, row, y, z) {
     const seriesArray = series.length ? series : [ series ];
     point.aggConfig = seriesArray[0].aggConfig;
     point.series = seriesArray.map(s => s.aggConfig.fieldFormatter()(unwrap(row[s.i]))).join(' - ');
+    point.seriesRow = row[seriesArray[0].i];
   } else if (y) {
     // If the data is not split up with a series aspect, then
     // each point's "series" becomes the y-agg that produced it
     point.aggConfig = y.aggConfig;
     point.series = y.title;
+    point.seriesRow = y;
   }
 
   if (yScale) {

src/ui/public/vis/vis_filters.js

@@ -83,6 +83,7 @@ const VisFiltersProvider = (Private, getAppState) => {
 
   const filter = (event, { simulate } = {}) => {
     let data = event.datum.aggConfigResult;
+    const shallow = event.shallow;
     const filters = [];
     while (data) {
       if (data.type === 'bucket') {
@@ -98,7 +99,7 @@ const VisFiltersProvider = (Private, getAppState) => {
         }
         filters.push(filter);
       }
-      data = data.$parent;
+      data = shallow ? null : data.$parent;
     }
     if (!simulate) {
       const appState = getAppState();

src/ui/public/vis/vis_types/vislib_vis_legend.js

@@ -102,11 +102,11 @@ uiModules.get('kibana')
         };
 
         $scope.filter = function (legendData, negate) {
-          $scope.vis.API.events.filter({ datum: legendData.values, negate: negate });
+          $scope.vis.API.events.filter({ datum: legendData, negate: negate, shallow: true });
         };
 
         $scope.canFilter = function (legendData) {
-          const filters = visFilters.filter({ datum: legendData.values }, { simulate: true });
+          const filters = visFilters.filter({ datum: legendData, shallow: true }, { simulate: true });
           return filters.length;
         };
 

src/ui/public/vislib/lib/data.js

@@ -304,7 +304,7 @@ export function VislibLibDataProvider(Private) {
       _.forEach(array, function (obj) {
         names.push({
           label: obj.name,
-          values: obj,
+          aggConfigResult: obj.aggConfigResult,
           index: index
         });
 

test/functional/apps/visualize/_pie_chart.js

@@ -213,6 +213,69 @@ export default function ({ getService, getPageObjects }) {
       });
     });
     describe('multi series slice', () => {
+      before(async () => {
+        log.debug('navigateToApp visualize');
+        await PageObjects.visualize.navigateToNewVisualization();
+        log.debug('clickPieChart');
+        await PageObjects.visualize.clickPieChart();
+        await PageObjects.visualize.clickNewSearch();
+        log.debug('Set absolute time range from \"' + fromTime + '\" to \"' + toTime + '\"');
+        await PageObjects.header.setAbsoluteRange(fromTime, toTime);
+        log.debug('select bucket Split Slices');
+        await PageObjects.visualize.clickBucket('Split Slices');
+        log.debug('Click aggregation Histogram');
+        await PageObjects.visualize.selectAggregation('Histogram');
+        log.debug('Click field memory');
+        await PageObjects.visualize.selectField('memory');
+        await PageObjects.header.waitUntilLoadingHasFinished();
+        await PageObjects.common.sleep(1003);
+        log.debug('setNumericInterval 4000');
+        await PageObjects.visualize.setNumericInterval('40000');
+        log.debug('Toggle previous editor');
+        await PageObjects.visualize.toggleAggregationEditor(2);
+        await PageObjects.visualize.clickAddBucket();
+        log.debug('select bucket Split Slices');
+        await PageObjects.visualize.clickBucket('Split Slices');
+        await PageObjects.visualize.selectAggregation('Terms');
+        await PageObjects.visualize.selectField('geo.dest');
+        await PageObjects.visualize.clickGo();
+      });
+
+      it ('should show correct chart', async () => {
+        const expectedTableData =  [ [ '0', '55', 'CN', '14' ], [ '0', '55', 'IN', '9' ], [ '0', '55', 'MX', '3' ],
+          [ '0', '55', 'US', '3' ], [ '0', '55', 'BR', '2' ], [ '40,000', '50', 'CN', '7' ],
+          [ '40,000', '50', 'IN', '7' ], [ '40,000', '50', 'US', '5' ], [ '40,000', '50', 'MY', '3' ],
+          [ '40,000', '50', 'ET', '2' ], [ '80,000', '41', 'CN', '9' ], [ '80,000', '41', 'IN', '4' ],
+          [ '80,000', '41', 'US', '4' ], [ '80,000', '41', 'BR', '3' ], [ '80,000', '41', 'IT', '2' ],
+          [ '120,000', '43', 'CN', '8' ], [ '120,000', '43', 'IN', '5' ], [ '120,000', '43', 'US', '4' ],
+          [ '120,000', '43', 'JP', '3' ], [ '120,000', '43', 'RU', '3' ], [ '160,000', '44', 'CN', '15' ],
+          [ '160,000', '44', 'IN', '5' ], [ '160,000', '44', 'IQ', '2' ], [ '160,000', '44', 'JP', '2' ],
+          [ '160,000', '44', 'NG', '2' ], [ '200,000', '40', 'IN', '7' ], [ '200,000', '40', 'CN', '6' ],
+          [ '200,000', '40', 'MX', '3' ], [ '200,000', '40', 'BR', '2' ], [ '200,000', '40', 'ID', '2' ],
+          [ '240,000', '46', 'CN', '6' ], [ '240,000', '46', 'IN', '6' ], [ '240,000', '46', 'US', '6' ],
+          [ '240,000', '46', 'NG', '3' ], [ '240,000', '46', 'CH', '2' ], [ '280,000', '39', 'CN', '11' ],
+          [ '280,000', '39', 'IN', '5' ], [ '280,000', '39', 'BR', '2' ], [ '280,000', '39', 'IT', '2' ],
+          [ '280,000', '39', 'NG', '2' ], [ '320,000', '40', 'CN', '7' ], [ '320,000', '40', 'US', '6' ],
+          [ '320,000', '40', 'MX', '4' ], [ '320,000', '40', 'BD', '2' ], [ '320,000', '40', 'ID', '2' ],
+          [ '360,000', '47', 'IN', '8' ], [ '360,000', '47', 'CN', '6' ], [ '360,000', '47', 'US', '4' ],
+          [ '360,000', '47', 'BD', '3' ], [ '360,000', '47', 'BR', '2' ] ];
+
+        await inspector.open();
+        await inspector.setTablePageSize(50);
+        await inspector.expectTableData(expectedTableData);
+        await inspector.close();
+      });
+
+      it('should correctly filter on legend', async () => {
+        const expectedTableData = [ '0', 'CN', '40,000', 'CN', '80,000', 'CN', '120,000', 'CN', '160,000', 'CN',
+          '200,000', 'CN', '240,000', 'CN', '280,000', 'CN', '320,000', 'CN', '360,000', 'CN' ];
+        await PageObjects.visualize.filterLegend('CN');
+        await PageObjects.visualize.waitForVisualization();
+        await pieChart.expectPieChartLabels(expectedTableData);
+        await filterBar.removeFilter('geo.dest');
+        await PageObjects.visualize.waitForVisualization();
+      });
+
       it('should still showing pie chart when a subseries have zero data', async function () {
         await PageObjects.visualize.navigateToNewVisualization();
         log.debug('clickPieChart');
@@ -299,9 +362,14 @@ export default function ({ getService, getPageObjects }) {
       });
 
       it ('correctly applies filter', async () => {
-        const expectedTableData = [[ 'win 8', '560', 'CN', '560' ]];
+        const expectedTableData = [
+          [ 'win 8', '560', 'CN', '560' ],
+          [ 'win 7', '537', 'CN', '537' ],
+          [ 'win xp', '526', 'CN', '526' ],
+          [ 'ios', '478', 'CN', '478' ],
+          [ 'osx', '228', 'CN', '228' ]
+        ];
         await PageObjects.visualize.filterLegend('CN');
-        await PageObjects.visualize.applyFilters();
         await PageObjects.header.waitUntilLoadingHasFinished();
         await inspector.open();
         await inspector.setTablePageSize(50);

test/functional/apps/visualize/_vertical_bar_chart.js

@@ -23,6 +23,7 @@ export default function ({ getService, getPageObjects }) {
   const log = getService('log');
   const retry = getService('retry');
   const inspector = getService('inspector');
+  const filterBar = getService('filterBar');
   const PageObjects = getPageObjects(['common', 'visualize', 'header']);
 
   describe('vertical bar chart', function () {
@@ -257,6 +258,16 @@ export default function ({ getService, getPageObjects }) {
         const legendEntries = await PageObjects.visualize.getLegendEntries();
         expect(legendEntries).to.eql(expectedEntries);
       });
+
+      it ('should correctly filter by legend', async () => {
+        await PageObjects.visualize.filterLegend('200');
+        await PageObjects.visualize.waitForVisualization();
+        const legendEntries = await PageObjects.visualize.getLegendEntries();
+        const expectedEntries = ['200'];
+        expect(legendEntries).to.eql(expectedEntries);
+        await filterBar.removeFilter('response.raw');
+        await PageObjects.visualize.waitForVisualization();
+      });
     });
 
     describe('vertical bar with multiple splits', function () {