[ML] Explain Log Rate Spikes: Basic functional tests. (#138387) (#138595)

Adds first functional tests for Explain Log Rate Spikes. The test clicks the menu item, selects an index, clicks the "Use full data" button and asserts the page's elements.

(cherry picked from commit 9a1a963ae3)

Co-authored-by: Walter Rafelsberger <walter@elastic.co>

.buildkite/ftr_configs.yml

@@ -151,6 +151,7 @@ enabled:
   - x-pack/test/functional_synthetics/config.js
   - x-pack/test/functional_with_es_ssl/config.ts
   - x-pack/test/functional/apps/advanced_settings/config.ts
+  - x-pack/test/functional/apps/aiops/config.ts
   - x-pack/test/functional/apps/api_keys/config.ts
   - x-pack/test/functional/apps/apm/config.ts
   - x-pack/test/functional/apps/canvas/config.ts

x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes_page.tsx

@@ -171,7 +171,7 @@ export const ExplainLogRateSpikesPage: FC<ExplainLogRateSpikesPageProps> = ({
   }
 
   return (
-    <EuiPageBody data-test-subj="aiopsIndexPage" paddingSize="none" panelled={false}>
+    <EuiPageBody data-test-subj="aiopsExplainLogRateSpikesPage" paddingSize="none" panelled={false}>
       <EuiFlexGroup gutterSize="none">
         <EuiFlexItem>
           <EuiPageContentHeader className="aiopsPageHeader">
@@ -268,6 +268,7 @@ export const ExplainLogRateSpikesPage: FC<ExplainLogRateSpikesPageProps> = ({
                       />
                     </p>
                   }
+                  data-test-subj="aiopsNoWindowParametersEmptyPrompt"
                 />
               )}
             </EuiPanel>

x-pack/test/api_integration/apis/aiops/explain_log_rate_spikes.ts

@@ -12,7 +12,7 @@ import expect from '@kbn/expect';
 
 import type { ApiExplainLogRateSpikes } from '@kbn/aiops-plugin/common/api';
 
-import { FtrProviderContext } from '../../ftr_provider_context';
+import type { FtrProviderContext } from '../../ftr_provider_context';
 
 import { parseStream } from './parse_stream';
 

x-pack/test/api_integration/apis/aiops/index.ts

@@ -7,7 +7,7 @@
 
 import { AIOPS_ENABLED } from '@kbn/aiops-plugin/common';
 
-import { FtrProviderContext } from '../../ftr_provider_context';
+import type { FtrProviderContext } from '../../ftr_provider_context';
 
 export default function ({ loadTestFile }: FtrProviderContext) {
   describe('AIOps', function () {

x-pack/test/api_integration_basic/apis/aiops/index.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { FtrProviderContext } from '../../ftr_provider_context';
+import type { FtrProviderContext } from '../../ftr_provider_context';
 
 export default function ({ loadTestFile }: FtrProviderContext) {
   describe('aiops basic license', function () {

x-pack/test/api_integration_basic/apis/aiops/permissions.ts

@@ -12,7 +12,7 @@ import expect from '@kbn/expect';
 
 import type { ApiExplainLogRateSpikes } from '@kbn/aiops-plugin/common/api';
 
-import { FtrProviderContext } from '../../ftr_provider_context';
+import type { FtrProviderContext } from '../../ftr_provider_context';
 
 export default ({ getService }: FtrProviderContext) => {
   const supertest = getService('supertest');

x-pack/test/functional/apps/aiops/config.ts

@@ -0,0 +1,20 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { FtrConfigProviderContext } from '@kbn/test';
+
+export default async function ({ readConfigFile }: FtrConfigProviderContext) {
+  const functionalConfig = await readConfigFile(require.resolve('../../config.base.js'));
+
+  return {
+    ...functionalConfig.getAll(),
+    testFiles: [require.resolve('.')],
+    junit: {
+      reportName: 'Chrome X-Pack UI Functional Tests - aiops',
+    },
+  };
+}

x-pack/test/functional/apps/aiops/explain_log_rate_spikes.ts

@@ -0,0 +1,87 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import type { FtrProviderContext } from '../../ftr_provider_context';
+import type { TestData } from './types';
+import { farequoteDataViewTestData } from './test_data';
+
+export default function ({ getPageObject, getService }: FtrProviderContext) {
+  const headerPage = getPageObject('header');
+  const esArchiver = getService('esArchiver');
+  const aiops = getService('aiops');
+
+  // aiops / Explain Log Rate Spikes lives in the ML UI so we need some related services.
+  const ml = getService('ml');
+
+  function runTests(testData: TestData) {
+    it(`${testData.suiteTitle} loads the source data in explain log rate spikes`, async () => {
+      await ml.testExecution.logTestStep(
+        `${testData.suiteTitle} loads the saved search selection page`
+      );
+      await aiops.explainLogRateSpikes.navigateToIndexPatternSelection();
+
+      await ml.testExecution.logTestStep(
+        `${testData.suiteTitle} loads the explain log rate spikes page`
+      );
+      await ml.jobSourceSelection.selectSourceForExplainLogRateSpikes(
+        testData.sourceIndexOrSavedSearch
+      );
+    });
+
+    it(`${testData.suiteTitle} displays index details`, async () => {
+      await ml.testExecution.logTestStep(`${testData.suiteTitle} displays the time range step`);
+      await aiops.explainLogRateSpikes.assertTimeRangeSelectorSectionExists();
+
+      await ml.testExecution.logTestStep(`${testData.suiteTitle} loads data for full time range`);
+      await aiops.explainLogRateSpikes.clickUseFullDataButton(
+        testData.expected.totalDocCountFormatted
+      );
+      await headerPage.waitUntilLoadingHasFinished();
+
+      await ml.testExecution.logTestStep(
+        `${testData.suiteTitle} displays elements in the doc count panel correctly`
+      );
+      await aiops.explainLogRateSpikes.assertTotalDocCountHeaderExist();
+      await aiops.explainLogRateSpikes.assertTotalDocCountChartExist();
+
+      await ml.testExecution.logTestStep(
+        `${testData.suiteTitle} displays elements in the page correctly`
+      );
+
+      await aiops.explainLogRateSpikes.assertSearchPanelExist();
+
+      await ml.testExecution.logTestStep('displays empty prompt');
+      await aiops.explainLogRateSpikes.assertNoWindowParametersEmptyPromptExist();
+    });
+  }
+
+  describe('explain log rate spikes', function () {
+    this.tags(['aiops']);
+    before(async () => {
+      await esArchiver.loadIfNeeded('x-pack/test/functional/es_archives/ml/farequote');
+
+      await ml.testResources.createIndexPatternIfNeeded('ft_farequote', '@timestamp');
+      await ml.testResources.setKibanaTimeZoneToUTC();
+
+      await ml.securityUI.loginAsMlPowerUser();
+    });
+
+    after(async () => {
+      await ml.testResources.deleteIndexPatternByTitle('ft_farequote');
+    });
+
+    describe('with farequote', function () {
+      // Run tests on full farequote index.
+      it(`${farequoteDataViewTestData.suiteTitle} loads the explain log rate spikes page`, async () => {
+        // Start navigation from the base of the ML app.
+        await ml.navigation.navigateToMl();
+      });
+
+      runTests(farequoteDataViewTestData);
+    });
+  });
+}

x-pack/test/functional/apps/aiops/index.ts

@@ -0,0 +1,38 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import type { FtrProviderContext } from '../../ftr_provider_context';
+
+export default function ({ getService, loadTestFile }: FtrProviderContext) {
+  const esArchiver = getService('esArchiver');
+
+  // aiops / Explain Log Rate Spikes lives in the ML UI so we need some related services.
+  const ml = getService('ml');
+
+  describe('aiops', function () {
+    this.tags(['skipFirefox', 'aiops']);
+
+    before(async () => {
+      await ml.securityCommon.createMlRoles();
+      await ml.securityCommon.createMlUsers();
+    });
+
+    after(async () => {
+      // NOTE: Logout needs to happen before anything else to avoid flaky behavior
+      await ml.securityUI.logout();
+
+      await ml.securityCommon.cleanMlUsers();
+      await ml.securityCommon.cleanMlRoles();
+
+      await esArchiver.unload('x-pack/test/functional/es_archives/ml/farequote');
+
+      await ml.testResources.resetKibanaTimeZone();
+    });
+
+    loadTestFile(require.resolve('./explain_log_rate_spikes'));
+  });
+}

x-pack/test/functional/apps/aiops/test_data.ts

@@ -0,0 +1,17 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { TestData } from './types';
+
+export const farequoteDataViewTestData: TestData = {
+  suiteTitle: 'farequote index pattern',
+  isSavedSearch: false,
+  sourceIndexOrSavedSearch: 'ft_farequote',
+  expected: {
+    totalDocCountFormatted: '86,274',
+  },
+};

x-pack/test/functional/apps/aiops/types.ts

@@ -0,0 +1,16 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+export interface TestData {
+  suiteTitle: string;
+  isSavedSearch?: boolean;
+  sourceIndexOrSavedSearch: string;
+  rowsPerPage?: 10 | 25 | 50;
+  expected: {
+    totalDocCountFormatted: string;
+  };
+}

x-pack/test/functional/services/aiops/explain_log_rate_spikes.ts

@@ -0,0 +1,64 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import expect from '@kbn/expect';
+
+import type { FtrProviderContext } from '../../ftr_provider_context';
+
+export function ExplainLogRateSpikesProvider({ getService }: FtrProviderContext) {
+  const testSubjects = getService('testSubjects');
+  const retry = getService('retry');
+
+  return {
+    async assertTimeRangeSelectorSectionExists() {
+      await testSubjects.existOrFail('aiopsTimeRangeSelectorSection');
+    },
+
+    async assertTotalDocumentCount(expectedFormattedTotalDocCount: string) {
+      await retry.tryForTime(5000, async () => {
+        const docCount = await testSubjects.getVisibleText('aiopsTotalDocCount');
+        expect(docCount).to.eql(
+          expectedFormattedTotalDocCount,
+          `Expected total document count to be '${expectedFormattedTotalDocCount}' (got '${docCount}')`
+        );
+      });
+    },
+
+    async clickUseFullDataButton(expectedFormattedTotalDocCount: string) {
+      await retry.tryForTime(30 * 1000, async () => {
+        await testSubjects.clickWhenNotDisabled('aiopsExplainLogRatesSpikeButtonUseFullData');
+        await testSubjects.clickWhenNotDisabled('superDatePickerApplyTimeButton');
+        await this.assertTotalDocumentCount(expectedFormattedTotalDocCount);
+      });
+    },
+
+    async assertTotalDocCountHeaderExist() {
+      await retry.tryForTime(5000, async () => {
+        await testSubjects.existOrFail(`aiopsTotalDocCountHeader`);
+      });
+    },
+
+    async assertTotalDocCountChartExist() {
+      await retry.tryForTime(5000, async () => {
+        await testSubjects.existOrFail(`aiopsDocumentCountChart`);
+      });
+    },
+
+    async assertSearchPanelExist() {
+      await testSubjects.existOrFail(`aiopsSearchPanel`);
+    },
+
+    async assertNoWindowParametersEmptyPromptExist() {
+      await testSubjects.existOrFail(`aiopsNoWindowParametersEmptyPrompt`);
+    },
+
+    async navigateToIndexPatternSelection() {
+      await testSubjects.click('mlMainTab explainLogRateSpikes');
+      await testSubjects.existOrFail('mlPageSourceSelection');
+    },
+  };
+}

x-pack/test/functional/services/aiops/index.ts

@@ -0,0 +1,18 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import type { FtrProviderContext } from '../../ftr_provider_context';
+
+import { ExplainLogRateSpikesProvider } from './explain_log_rate_spikes';
+
+export function AiopsProvider(context: FtrProviderContext) {
+  const explainLogRateSpikes = ExplainLogRateSpikesProvider(context);
+
+  return {
+    explainLogRateSpikes,
+  };
+}

x-pack/test/functional/services/index.ts

@@ -70,6 +70,7 @@ import { SearchSessionsService } from './search_sessions';
 import { ObservabilityProvider } from './observability';
 import { CompareImagesProvider } from './compare_images';
 import { CasesServiceProvider } from './cases';
+import { AiopsProvider } from './aiops';
 
 // define the name and providers for services that should be
 // available to your tests. If you don't specify anything here
@@ -130,4 +131,5 @@ export const services = {
   observability: ObservabilityProvider,
   compareImages: CompareImagesProvider,
   cases: CasesServiceProvider,
+  aiops: AiopsProvider,
 };

x-pack/test/functional/services/ml/job_source_selection.ts

@@ -42,5 +42,9 @@ export function MachineLearningJobSourceSelectionProvider({ getService }: FtrPro
     async selectSourceForIndexBasedDataVisualizer(sourceName: string) {
       await this.selectSource(sourceName, 'dataVisualizerIndexPage');
     },
+
+    async selectSourceForExplainLogRateSpikes(sourceName: string) {
+      await this.selectSource(sourceName, 'aiopsExplainLogRateSpikesPage');
+    },
   };
 }