fixing inspector

src/core_plugins/kibana/public/visualize/editor/editor.js

@@ -180,17 +180,9 @@ function VisEditor(
     key: 'inspect',
     description: 'Open Inspector for visualization',
     testId: 'openInspectorButton',
-    disableButton() {
-      return !vis.hasInspector();
-    },
     run() {
       vis.openInspector().bindToAngularScope($scope);
     },
-    tooltip() {
-      if (!vis.hasInspector()) {
-        return 'This visualization doesn\'t support any inspectors.';
-      }
-    }
   }, {
     key: 'refresh',
     description: 'Refresh',

src/core_plugins/kibana_canvas_visualize/public/functions/esaggs.js

@@ -70,7 +70,7 @@ export default () => ({
       multi: false,
     },
   },
-  fn(context, args) {
+  fn(context, args, handlers) {
     return chrome.dangerouslyGetActiveInjector().then(async $injector => {
       const Private = $injector.get('Private');
       const indexPatterns = Private(IndexPatternsProvider);
@@ -101,7 +101,8 @@ export default () => ({
         timeRange: timeRange || _.get(context, 'timeRange', null),
         query: _.get(context, 'q', null),
         filters: _.get(context, 'filters', null),
-        forceFetch: true
+        forceFetch: true,
+        inspectorAdapters: handlers.inspectorAdapters
       });
 
       return {

src/ui/public/vis/request_handlers/courier.js

@@ -33,11 +33,7 @@ const CourierRequestHandlerProvider = function () {
    * This function builds tabular data from the response and attaches it to the
    * inspector. It will only be called when the data view in the inspector is opened.
    */
-  async function buildTabularInspectorData(vis, searchSource, aggConfigs) {
-    const table = tabifyAggResponse(aggConfigs, searchSource.finalResponse, {
-      partialRows: true,
-      metricsAtAllLevels: vis.isHierarchical(),
-    });
+  async function buildTabularInspectorData(table, queryFilter) {
     const columns = table.columns.map((col, index) => {
       const field = col.aggConfig.getField();
       const isCellContentFilterable =
@@ -48,13 +44,13 @@ const CourierRequestHandlerProvider = function () {
         field: `col${index}`,
         filter: isCellContentFilterable && ((value) => {
           const filter = col.aggConfig.createFilter(value.raw);
-          vis.API.queryFilter.addFilters(filter);
+          queryFilter.addFilters(filter);
         }),
         filterOut: isCellContentFilterable && ((value) => {
           const filter = col.aggConfig.createFilter(value.raw);
           filter.meta = filter.meta || {};
           filter.meta.negate = true;
-          vis.API.queryFilter.addFilters(filter);
+          queryFilter.addFilters(filter);
         }),
       });
     });
@@ -72,7 +68,7 @@ const CourierRequestHandlerProvider = function () {
 
   return {
     name: 'courier',
-    handler: function (vis, { searchSource, aggs, timeRange, query, filters, forceFetch, partialRows }) {
+    handler: function (vis, { searchSource, aggs, timeRange, query, filters, forceFetch, partialRows, inspectorAdapters }) {
 
       // Create a new search source that inherits the original search source
       // but has the appropriate timeRange applied via a filter.
@@ -124,9 +120,8 @@ const CourierRequestHandlerProvider = function () {
         return requestSearchSource.getSearchRequestBody().then(q => {
           const queryHash = calculateObjectHash(q);
           if (shouldQuery(queryHash)) {
-            const lastAggConfig = aggs;
-            vis.API.inspectorAdapters.requests.reset();
-            const request = vis.API.inspectorAdapters.requests.start('Data', {
+            inspectorAdapters.requests.reset();
+            const request = inspectorAdapters.requests.start('Data', {
               description: `This request queries Elasticsearch to fetch the data for the visualization.`,
             });
             request.stats(getRequestInspectorStats(requestSearchSource));
@@ -148,7 +143,7 @@ const CourierRequestHandlerProvider = function () {
                     aggs,
                     agg,
                     requestSearchSource,
-                    vis.API.inspectorAdapters
+                    inspectorAdapters
                   );
                 }
               }
@@ -163,8 +158,8 @@ const CourierRequestHandlerProvider = function () {
                 timeRange: parsedTimeRange ? parsedTimeRange.range : undefined,
               });
 
-              vis.API.inspectorAdapters.data.setTabularLoader(
-                () => buildTabularInspectorData(vis, searchSource, lastAggConfig),
+              inspectorAdapters.data.setTabularLoader(
+                () => buildTabularInspectorData(searchSource.tabifiedResponse, vis.API.queryFilter),
                 { returnsFormattedValues: true }
               );
 

src/ui/public/vis/request_handlers/request_handlers.d.ts

@@ -34,6 +34,7 @@ export interface RequestHandlerParams {
   queryFilter: QueryFilter;
   uiState: PersistedState;
   partialRows?: boolean;
+  inspectorAdapters?: any;
 }
 
 export type RequestHandler = <T>(vis: Vis, params: RequestHandlerParams) => T;

src/ui/public/vis/vis.js

@@ -40,9 +40,6 @@ import { SearchSourceProvider } from '../courier/search_source';
 import { SavedObjectsClientProvider } from '../saved_objects';
 import { timefilter } from 'ui/timefilter';
 
-import { Inspector } from '../inspector';
-import { RequestAdapter, DataAdapter } from '../inspector/adapters';
-
 const getTerms = (table, columnIndex, rowIndex) => {
   if (rowIndex === -1) {
     return [];
@@ -120,59 +117,10 @@ export function VisProvider(Private, indexPatterns, getAppState) {
             onBrushEvent(event, getAppState());
           }
         },
-        inspectorAdapters: this._getActiveInspectorAdapters(),
         getAppState,
       };
     }
 
-    /**
-     * Open the inspector for this visualization.
-     * @return {InspectorSession} the handler for the session of this inspector.
-     */
-    openInspector() {
-      return Inspector.open(this.API.inspectorAdapters, {
-        title: this.title
-      });
-    }
-
-    hasInspector() {
-      return Inspector.isAvailable(this.API.inspectorAdapters);
-    }
-
-    /**
-     * Returns an object of all inspectors for this vis object.
-     * This must only be called after this.type has properly be initialized,
-     * since we need to read out data from the the vis type to check which
-     * inspectors are available.
-     */
-    _getActiveInspectorAdapters() {
-      const adapters = {};
-      const { inspectorAdapters: typeAdapters } = this.type;
-
-      // Add the requests inspector adapters if the vis type explicitly requested it via
-      // inspectorAdapters.requests: true in its definition or if it's using the courier
-      // request handler, since that will automatically log its requests.
-      if (typeAdapters && typeAdapters.requests || this.type.requestHandler === 'courier') {
-        adapters.requests = new RequestAdapter();
-      }
-
-      // Add the data inspector adapter if the vis type requested it or if the
-      // vis is using courier, since we know that courier supports logging
-      // its data.
-      if (typeAdapters && typeAdapters.data || this.type.requestHandler === 'courier') {
-        adapters.data = new DataAdapter();
-      }
-
-      // Add all inspectors, that are explicitly registered with this vis type
-      if (typeAdapters && typeAdapters.custom) {
-        Object.entries(typeAdapters.custom).forEach(([key, Adapter]) => {
-          adapters[key] = new Adapter();
-        });
-      }
-
-      return adapters;
-    }
-
     setCurrentState(state) {
       this.title = state.title || '';
       const type = state.type || this.type;

src/ui/public/visualize/loader/embedded_visualize_handler.ts

@@ -19,7 +19,6 @@
 
 import { EventEmitter } from 'events';
 import { debounce, get } from 'lodash';
-import { Inspector } from '../../inspector';
 
 import { PersistedState } from '../../persisted_state';
 import { IPrivate } from '../../private';
@@ -32,6 +31,9 @@ import { VisualizeDataLoader } from './visualize_data_loader';
 
 import { VisSavedObject, VisualizeLoaderParams, VisualizeUpdateParams } from './types';
 
+import { Inspector } from '../../inspector';
+import { DataAdapter, RequestAdapter } from '../../inspector/adapters';
+
 interface EmbeddedVisualizeHandlerParams extends VisualizeLoaderParams {
   Private: IPrivate;
   queryFilter: any;
@@ -67,6 +69,7 @@ export class EmbeddedVisualizeHandler {
   private appState: AppState;
   private uiState: PersistedState;
   private dataLoader: VisualizeDataLoader;
+  private inspectorAdapters = {};
 
   constructor(
     private readonly element: HTMLElement,
@@ -111,6 +114,8 @@ export class EmbeddedVisualizeHandler {
     this.dataLoader = new VisualizeDataLoader(vis);
     this.renderCompleteHelper = new RenderCompleteHelper(element);
 
+    this.vis.openInspector = this.openInspector;
+
     this.render();
   }
 
@@ -184,9 +189,9 @@ export class EmbeddedVisualizeHandler {
    * handler to the inspector to close and interact with it.
    * @return An inspector session to interact with the opened inspector.
    */
-  public openInspector(): ReturnType<typeof Inspector.open> {
-    return this.vis.openInspector();
-  }
+  public openInspector = () => {
+    return Inspector.open(this.inspectorAdapters);
+  };
 
   /**
    * Returns a promise, that will resolve (without a value) once the first rendering of
@@ -230,6 +235,13 @@ export class EmbeddedVisualizeHandler {
     this.fetchAndRender();
   };
 
+  private getActiveInspectorAdapters() {
+    return {
+      requests: new RequestAdapter(),
+      data: new DataAdapter(),
+    };
+  }
+
   /**
    * Fetches new data and renders the chart. This will happen debounced for a couple
    * of milliseconds, to bundle fast successive calls into one fetch and render,
@@ -263,8 +275,10 @@ export class EmbeddedVisualizeHandler {
   };
 
   private fetch = (forceFetch: boolean = false) => {
+    this.inspectorAdapters = this.getActiveInspectorAdapters();
     this.dataLoaderParams.aggs = this.vis.getAggConfig();
     this.dataLoaderParams.forceFetch = forceFetch;
+    this.dataLoaderParams.inspectorAdapters = this.inspectorAdapters;
 
     return this.dataLoader.fetch(this.dataLoaderParams);
   };

src/ui/public/visualize/loader/pipeline_helpers.js

@@ -57,8 +57,8 @@ export const buildPipeline = (vis, params) => {
   return pipeline;
 };
 
-export const runPipeline = async (pipeline, context) => {
+export const runPipeline = async (pipeline, context, handlers) => {
   const ast = fromExpression(pipeline);
-  const pipelineResponse = await interpretAst(ast, context);
+  const pipelineResponse = await interpretAst(ast, context, handlers);
   return pipelineResponse;
 };

src/ui/public/visualize/loader/visualize_data_loader.ts

@@ -30,12 +30,18 @@ export class VisualizeDataLoader {
     this.vis.pipelineExpression = buildPipeline(this.vis, params);
 
     try {
-      return await runPipeline(this.vis.pipelineExpression, {
-        query: params.query,
-        filters: params.filters,
-        timeRange: params.timeRange,
-        partialRows: this.vis.params.partialRows || this.vis.type.name === 'tile_map',
-      });
+      return await runPipeline(
+        this.vis.pipelineExpression,
+        {
+          query: params.query,
+          filters: params.filters,
+          timeRange: params.timeRange,
+          partialRows: this.vis.params.partialRows || this.vis.type.name === 'tile_map',
+        },
+        {
+          inspectorAdapters: params.inspectorAdapters,
+        }
+      );
     } catch (e) {
       params.searchSource.cancelQueued();
       this.vis.requestError = e;

x-pack/plugins/canvas/public/lib/interpreter.js

@@ -17,13 +17,13 @@ socket.emit('getFunctionList');
 export const getServerFunctions = new Promise(resolve => socket.once('functionList', resolve));
 
 // Use the above promise to seed the interpreter with the functions it can defer to
-export function interpretAst(ast, context) {
+export function interpretAst(ast, context, handlers) {
   // Load plugins before attempting to get functions, otherwise this gets racey
   return Promise.all([getServerFunctions, loadBrowserPlugins()])
     .then(([serverFunctionList]) => {
       return socketInterpreterProvider({
         types: typesRegistry.toJS(),
-        handlers: createHandlers(socket),
+        handlers: { ...createHandlers(socket), ...handlers },
         functions: functionsRegistry.toJS(),
         referableFunctions: serverFunctionList,
         socket: socket,