Merge branch 'test/lens/chart-data-test-2' of github.com:dej611/kiban…

…a into test/lens/chart-data-test-2

package.json

@@ -824,7 +824,7 @@
     "url-loader": "^2.2.0",
     "use-resize-observer": "^6.0.0",
     "val-loader": "^1.1.1",
-    "vega": "^5.17.1",
+    "vega": "^5.17.3",
     "vega-lite": "^4.17.0",
     "vega-schema-url-parser": "^2.1.0",
     "vega-tooltip": "^0.24.2",

src/plugins/expressions/public/react_expression_renderer.test.tsx

@@ -304,4 +304,22 @@ describe('ExpressionRenderer', () => {
     expect(onEvent).toHaveBeenCalledTimes(1);
     expect(onEvent.mock.calls[0][0]).toBe(event);
   });
+
+  it('should correctly assign classes to the wrapper node', () => {
+    (ExpressionLoader as jest.Mock).mockImplementation(() => {
+      return {
+        render$: new Subject(),
+        data$: new Subject(),
+        loading$: new Subject(),
+        update: jest.fn(),
+        destroy: jest.fn(),
+      };
+    });
+
+    const instance = mount(<ReactExpressionRenderer className="myClassName" expression="" />);
+    // Counte is 2 because the class is applied to ReactExpressionRenderer + internal component
+    expect(instance.find('.myClassName').length).toBe(2);
+
+    instance.unmount();
+  });
 });

src/plugins/expressions/public/react_expression_renderer.tsx

@@ -211,10 +211,9 @@ export const ReactExpressionRenderer = ({
     }
   }, [state.error]);
 
-  const classes = classNames('expExpressionRenderer', {
+  const classes = classNames('expExpressionRenderer', className, {
     'expExpressionRenderer-isEmpty': state.isEmpty,
     'expExpressionRenderer-hasError': !!state.error,
-    className,
   });
 
   const expressionStyles: React.CSSProperties = {};

src/plugins/vis_type_vislib/public/vis_wrapper.tsx

@@ -61,7 +61,7 @@ const VislibWrapper = ({ core, charts, visData, visConfig, handlers }: VislibWra
       visController.current?.destroy();
       visController.current = null;
     };
-  }, [core, charts, handlers]);
+  }, [core, charts]);
 
   useEffect(updateChart, [updateChart]);
 

src/plugins/vis_type_xy/kibana.json

@@ -3,6 +3,6 @@
   "version": "kibana",
   "server": true,
   "ui": true,
-  "requiredPlugins": ["charts", "data", "expressions", "visualizations"],
+  "requiredPlugins": ["charts", "data", "expressions", "visualizations", "usageCollection"],
   "requiredBundles": ["kibanaUtils", "visDefaultEditor"]
 }

src/plugins/vis_type_xy/public/editor/components/options/point_series/elastic_charts_options.tsx

@@ -20,14 +20,17 @@
 import React from 'react';
 
 import { i18n } from '@kbn/i18n';
+import { METRIC_TYPE } from '@kbn/analytics';
 
 import { SelectOption, SwitchOption } from '../../../../../../vis_default_editor/public';
 
 import { ChartType } from '../../../../../common';
 import { VisParams } from '../../../../types';
 import { ValidationVisOptionsProps } from '../../common';
+import { getTrackUiMetric } from '../../../../services';
 
 export function ElasticChartsOptions(props: ValidationVisOptionsProps<VisParams>) {
+  const trackUiMetric = getTrackUiMetric();
   const { stateParams, setValue, vis, aggs } = props;
 
   const hasLineChart = stateParams.seriesParams.some(
@@ -49,7 +52,12 @@ export function ElasticChartsOptions(props: ValidationVisOptionsProps<VisParams>
         })}
         paramName="detailedTooltip"
         value={stateParams.detailedTooltip}
-        setValue={setValue}
+        setValue={(paramName, value) => {
+          if (trackUiMetric) {
+            trackUiMetric(METRIC_TYPE.CLICK, 'detailed_tooltip_switched');
+          }
+          setValue(paramName, value);
+        }}
       />
 
       {hasLineChart && (
@@ -61,7 +69,12 @@ export function ElasticChartsOptions(props: ValidationVisOptionsProps<VisParams>
           options={vis.type.editorConfig.collections.fittingFunctions}
           paramName="fittingFunction"
           value={stateParams.fittingFunction}
-          setValue={setValue}
+          setValue={(paramName, value) => {
+            if (trackUiMetric) {
+              trackUiMetric(METRIC_TYPE.CLICK, 'fitting_function_selected');
+            }
+            setValue(paramName, value);
+          }}
         />
       )}
     </>

src/plugins/vis_type_xy/public/plugin.ts

@@ -22,6 +22,7 @@ import { Plugin as ExpressionsPublicPlugin } from '../../expressions/public';
 import { VisualizationsSetup, VisualizationsStart } from '../../visualizations/public';
 import { ChartsPluginSetup } from '../../charts/public';
 import { DataPublicPluginStart } from '../../data/public';
+import { UsageCollectionSetup } from '../../usage_collection/public';
 
 import { createVisTypeXyVisFn } from './xy_vis_fn';
 import {
@@ -32,6 +33,7 @@ import {
   setTimefilter,
   setUISettings,
   setDocLinks,
+  setTrackUiMetric,
 } from './services';
 import { visTypesDefinitions } from './vis_types';
 import { LEGACY_CHARTS_LIBRARY } from '../common';
@@ -47,6 +49,7 @@ export interface VisTypeXyPluginSetupDependencies {
   expressions: ReturnType<ExpressionsPublicPlugin['setup']>;
   visualizations: VisualizationsSetup;
   charts: ChartsPluginSetup;
+  usageCollection: UsageCollectionSetup;
 }
 
 /** @internal */
@@ -69,7 +72,7 @@ export class VisTypeXyPlugin
     > {
   public async setup(
     core: VisTypeXyCoreSetup,
-    { expressions, visualizations, charts }: VisTypeXyPluginSetupDependencies
+    { expressions, visualizations, charts, usageCollection }: VisTypeXyPluginSetupDependencies
   ) {
     if (!core.uiSettings.get(LEGACY_CHARTS_LIBRARY, false)) {
       setUISettings(core.uiSettings);
@@ -81,6 +84,8 @@ export class VisTypeXyPlugin
       visTypesDefinitions.forEach(visualizations.createBaseVisualization);
     }
 
+    setTrackUiMetric(usageCollection?.reportUiCounter.bind(usageCollection, 'vis_type_xy'));
+
     return {};
   }
 

src/plugins/vis_type_xy/public/services.ts

@@ -17,6 +17,7 @@
  * under the License.
  */
 
+import { UiCounterMetricType } from '@kbn/analytics';
 import { CoreSetup, DocLinksStart } from '../../../core/public';
 import { createGetterSetter } from '../../kibana_utils/public';
 import { DataPublicPluginStart } from '../../data/public';
@@ -47,3 +48,7 @@ export const [getColorsService, setColorsService] = createGetterSetter<
 >('xy charts.color');
 
 export const [getDocLinks, setDocLinks] = createGetterSetter<DocLinksStart>('DocLinks');
+
+export const [getTrackUiMetric, setTrackUiMetric] = createGetterSetter<
+  (metricType: UiCounterMetricType, eventName: string | string[]) => void
+>('trackUiMetric');

x-pack/plugins/apm/public/components/app/RumDashboard/UXMetrics/__tests__/KeyUXMetrics.test.tsx

@@ -23,7 +23,7 @@ describe('KeyUXMetrics', () => {
       <KeyUXMetrics
         loading={false}
         data={{
-          cls: '0.01',
+          cls: 0.01,
           fid: 6,
           lcp: 1701.1142857142856,
           tbt: 270.915,

x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list.tsx

@@ -4,26 +4,26 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React from 'react';
 import {
-  EuiPanel,
-  EuiTitle,
-  EuiText,
-  EuiSpacer,
   EuiButton,
   EuiFlexGroup,
   EuiFlexItem,
+  EuiPanel,
+  EuiSpacer,
+  EuiText,
+  EuiTitle,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
+import React from 'react';
+import { getEnvironmentLabel } from '../../../../../common/environment_filter_values';
 import { FETCH_STATUS } from '../../../../hooks/use_fetcher';
-import { ITableColumn, ManagedTable } from '../../../shared/ManagedTable';
-import { LoadingStatePrompt } from '../../../shared/LoadingStatePrompt';
-import { MLSingleMetricLink } from '../../../shared/Links/MachineLearningLinks/MLSingleMetricLink';
+import { MLExplorerLink } from '../../../shared/Links/MachineLearningLinks/MLExplorerLink';
 import { MLManageJobsLink } from '../../../shared/Links/MachineLearningLinks/MLManageJobsLink';
-import { getEnvironmentLabel } from '../../../../../common/environment_filter_values';
-import { LegacyJobsCallout } from './legacy_jobs_callout';
+import { LoadingStatePrompt } from '../../../shared/LoadingStatePrompt';
+import { ITableColumn, ManagedTable } from '../../../shared/ManagedTable';
 import { AnomalyDetectionApiResponse } from './index';
+import { LegacyJobsCallout } from './legacy_jobs_callout';
 
 type Jobs = AnomalyDetectionApiResponse['jobs'];
 
@@ -44,14 +44,14 @@ const columns: Array<ITableColumn<Jobs[0]>> = [
       { defaultMessage: 'Action' }
     ),
     render: (jobId: string) => (
-      <MLSingleMetricLink jobId={jobId}>
+      <MLExplorerLink jobId={jobId}>
         {i18n.translate(
           'xpack.apm.settings.anomalyDetection.jobList.mlJobLinkText',
           {
             defaultMessage: 'View job in ML',
           }
         )}
-      </MLSingleMetricLink>
+      </MLExplorerLink>
     ),
   },
 ];

x-pack/plugins/apm/public/components/app/service_inventory/ServiceList/__fixtures__/service_api_mock_data.ts

@@ -0,0 +1,29 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+import { APIReturnType } from '../../../../../services/rest/createCallApmApi';
+
+type ServiceListAPIResponse = APIReturnType<'GET /api/apm/services'>;
+
+export const items: ServiceListAPIResponse['items'] = [
+  {
+    serviceName: 'opbeans-node',
+    transactionType: 'request',
+    agentName: 'nodejs',
+    transactionsPerMinute: { value: 0, timeseries: [] },
+    transactionErrorRate: { value: 46.06666666666667, timeseries: [] },
+    avgResponseTime: { value: null, timeseries: [] },
+    environments: ['test'],
+  },
+  {
+    serviceName: 'opbeans-python',
+    transactionType: 'page-load',
+    agentName: 'python',
+    transactionsPerMinute: { value: 86.93333333333334, timeseries: [] },
+    transactionErrorRate: { value: 12.6, timeseries: [] },
+    avgResponseTime: { value: 91535.42944785276, timeseries: [] },
+    environments: [],
+  },
+];