[ML] Update navigation tests to handle main and sub tabs (elastic#45793)

This PR updates the navigation tests to handle and validate the new main and sub tabs.
pheyos · Sep 20, 2019 · 1e75adc · 1e75adc
1 parent dbda7f4
commit 1e75adc
Show file tree

Hide file tree

Showing 7 changed files with 99 additions and 25 deletions.
diff --git a/x-pack/legacy/plugins/ml/public/components/navigation_menu/main_tabs.tsx b/x-pack/legacy/plugins/ml/public/components/navigation_menu/main_tabs.tsx
@@ -67,10 +67,10 @@ interface TabData {
 
 const TAB_DATA: Record<TabId, TabData> = {
   // overview: { testSubject: 'mlTabOverview', pathId: 'overview' },
-  anomaly_detection: { testSubject: 'mlTabAnomalyDetection', pathId: 'jobs' },
-  data_frames: { testSubject: 'mlTabDataFrames' },
-  data_frame_analytics: { testSubject: 'mlTabDataFrameAnalytics' },
-  datavisualizer: { testSubject: 'mlTabDataVisualizer' },
+  anomaly_detection: { testSubject: 'mlMainTab anomalyDetection', pathId: 'jobs' },
+  data_frames: { testSubject: 'mlMainTab dataFrames' },
+  data_frame_analytics: { testSubject: 'mlMainTab dataFrameAnalytics' },
+  datavisualizer: { testSubject: 'mlMainTab dataVisualizer' },
 };
 
 export const MainTabs: FC<Props> = ({ tabId, disableLinks }) => {
@@ -89,7 +89,7 @@ export const MainTabs: FC<Props> = ({ tabId, disableLinks }) => {
         const defaultPathId = TAB_DATA[id].pathId || id;
         return (
           <EuiLink
-            data-test-subj={testSubject}
+            data-test-subj={testSubject + (id === selectedTabId ? ' selected' : '')}
             href={`${chrome.getBasePath()}/app/ml#/${defaultPathId}`}
             key={`${id}-key`}
             color="text"

diff --git a/x-pack/legacy/plugins/ml/public/components/navigation_menu/tabs.tsx b/x-pack/legacy/plugins/ml/public/components/navigation_menu/tabs.tsx
@@ -60,11 +60,10 @@ export function getTabs(tabId: TabId, disableLinks: boolean): Tab[] {
 
 enum TAB_TEST_SUBJECT {
   // overview = 'mlOverview',
-  jobs = 'mlTabJobManagement',
-  explorer = 'mlTabAnomalyExplorer',
-  timeseriesexplorer = 'mlTabSingleMetricViewer',
-  datavisualizer = 'mlTabDataVisualizer',
-  settings = 'mlTabSettings',
+  jobs = 'mlSubTab jobManagement',
+  explorer = 'mlSubTab anomalyExplorer',
+  timeseriesexplorer = 'mlSubTab singleMetricViewer',
+  settings = 'mlSubTab settings',
 }
 
 type TAB_TEST_SUBJECTS = keyof typeof TAB_TEST_SUBJECT;
@@ -83,7 +82,9 @@ export const Tabs: FC<Props> = ({ tabId, mainTabId, disableLinks }) => {
         const id = tab.id;
         return (
           <EuiLink
-            data-test-subj={TAB_TEST_SUBJECT[id as TAB_TEST_SUBJECTS]}
+            data-test-subj={
+              TAB_TEST_SUBJECT[id as TAB_TEST_SUBJECTS] + (id === selectedTabId ? ' selected' : '')
+            }
             href={`${chrome.getBasePath()}/app/ml#/${id}`}
             key={`${id}-key`}
             color="text"

diff --git a/x-pack/test/functional/apps/machine_learning/pages.ts b/x-pack/test/functional/apps/machine_learning/pages.ts
@@ -24,6 +24,10 @@ export default function({ getService }: FtrProviderContext) {
       await ml.navigation.navigateToMl();
     });
 
+    it('loads the anomaly detection area', async () => {
+      await ml.navigation.navigateToAnomalyDetection();
+    });
+
     it('loads the job management page', async () => {
       await ml.navigation.navigateToJobManagement();
       await ml.jobManagement.assertJobStatsBarExists();
@@ -32,7 +36,7 @@ export default function({ getService }: FtrProviderContext) {
     });
 
     it('loads the anomaly explorer page', async () => {
-      await ml.navigation.navigateToAnomalyExplorert();
+      await ml.navigation.navigateToAnomalyExplorer();
       await ml.anomalyExplorer.assertAnomalyExplorerEmptyListMessageExists();
     });
 
@@ -52,6 +56,11 @@ export default function({ getService }: FtrProviderContext) {
       await ml.dataFrames.assertDataFrameEmptyListMessageExists();
     });
 
+    it('loads the data frame analytics page', async () => {
+      await ml.navigation.navigateToDataFrameAnalytics();
+      await ml.dataFrameAnalytics.assertEmptyListMessageExists();
+    });
+
     it('loads the data visualizer page', async () => {
       await ml.navigation.navigateToDataVisualizer();
       await ml.dataVisualizer.assertDataVisualizerImportDataCardExists();

diff --git a/x-pack/test/functional/services/machine_learning/data_frame_analytics.ts b/x-pack/test/functional/services/machine_learning/data_frame_analytics.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;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { FtrProviderContext } from '../../ftr_provider_context';
+
+export function MachineLearningDataFrameAnalyticsProvider({ getService }: FtrProviderContext) {
+  const testSubjects = getService('testSubjects');
+
+  return {
+    async assertEmptyListMessageExists() {
+      await testSubjects.existOrFail('mlNoDataFrameAnalyticsFound');
+    },
+  };
+}
diff --git a/x-pack/test/functional/services/machine_learning/index.ts b/x-pack/test/functional/services/machine_learning/index.ts
@@ -6,6 +6,7 @@
 
 export { MachineLearningAnomalyExplorerProvider } from './anomaly_explorer';
 export { MachineLearningAPIProvider } from './api';
+export { MachineLearningDataFrameAnalyticsProvider } from './data_frame_analytics';
 export { MachineLearningDataFramesProvider } from './data_frames';
 export { MachineLearningDataVisualizerProvider } from './data_visualizer';
 export { MachineLearningJobManagementProvider } from './job_management';

diff --git a/x-pack/test/functional/services/machine_learning/navigation.ts b/x-pack/test/functional/services/machine_learning/navigation.ts
@@ -3,6 +3,7 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
+import expect from '@kbn/expect';
 
 import { FtrProviderContext } from '../../ftr_provider_context';
 
@@ -19,37 +20,79 @@ export function MachineLearningNavigationProvider({
       return await PageObjects.common.navigateToApp('ml');
     },
 
+    async assertTabsExist(tabTypeSubject: string, areaSubjects: string[]) {
+      await retry.try(async () => {
+        expect(await testSubjects.findAll(`~${tabTypeSubject}`, 3)).to.have.length(
+          areaSubjects.length
+        );
+        for (const areaSubj of areaSubjects) {
+          await testSubjects.existOrFail(`~${tabTypeSubject}&~${areaSubj}`);
+        }
+      });
+    },
+
     async navigateToArea(linkSubject: string, pageSubject: string) {
       await retry.try(async () => {
-        if ((await testSubjects.exists(pageSubject)) === false) {
+        if ((await testSubjects.exists(`${linkSubject} selected`)) === false) {
           await testSubjects.click(linkSubject);
+          await testSubjects.existOrFail(`${linkSubject} selected`);
           await testSubjects.existOrFail(pageSubject);
         }
       });
     },
 
-    async navigateToJobManagement() {
-      await this.navigateToArea('mlTabJobManagement', 'mlPageJobManagement');
+    async assertMainTabsExist() {
+      await this.assertTabsExist('mlMainTab', [
+        'anomalyDetection',
+        'dataFrames',
+        'dataFrameAnalytics',
+        'dataVisualizer',
+      ]);
     },
 
-    async navigateToAnomalyExplorert() {
-      await this.navigateToArea('mlTabAnomalyExplorer', 'mlPageAnomalyExplorer');
+    async navigateToAnomalyDetection() {
+      await this.navigateToArea('mlMainTab anomalyDetection', 'mlPageJobManagement');
+      await this.assertTabsExist('mlSubTab', [
+        'jobManagement',
+        'anomalyExplorer',
+        'singleMetricViewer',
+        'settings',
+      ]);
     },
 
-    async navigateToSingleMetricViewer() {
-      await this.navigateToArea('mlTabSingleMetricViewer', 'mlPageSingleMetricViewer');
+    async navigateToDataFrames() {
+      await this.navigateToArea('mlMainTab dataFrames', 'mlPageDataFrame');
+      await this.assertTabsExist('mlSubTab', []);
     },
 
-    async navigateToSettings() {
-      await this.navigateToArea('mlTabSettings', 'mlPageSettings');
+    async navigateToDataFrameAnalytics() {
+      await this.navigateToArea('mlMainTab dataFrameAnalytics', 'mlPageDataFrameAnalytics');
+      await this.assertTabsExist('mlSubTab', []);
     },
 
-    async navigateToDataFrames() {
-      await this.navigateToArea('mlTabDataFrames', 'mlPageDataFrame');
+    async navigateToDataVisualizer() {
+      await this.navigateToArea('mlMainTab dataVisualizer', 'mlPageDataVisualizerSelector');
+      await this.assertTabsExist('mlSubTab', []);
     },
 
-    async navigateToDataVisualizer() {
-      await this.navigateToArea('mlTabDataVisualizer', 'mlPageDataVisualizerSelector');
+    async navigateToJobManagement() {
+      await this.navigateToAnomalyDetection();
+      await this.navigateToArea('mlSubTab jobManagement', 'mlPageJobManagement');
+    },
+
+    async navigateToAnomalyExplorer() {
+      await this.navigateToAnomalyDetection();
+      await this.navigateToArea('mlSubTab anomalyExplorer', 'mlPageAnomalyExplorer');
+    },
+
+    async navigateToSingleMetricViewer() {
+      await this.navigateToAnomalyDetection();
+      await this.navigateToArea('mlSubTab singleMetricViewer', 'mlPageSingleMetricViewer');
+    },
+
+    async navigateToSettings() {
+      await this.navigateToAnomalyDetection();
+      await this.navigateToArea('mlSubTab settings', 'mlPageSettings');
     },
   };
 }
diff --git a/x-pack/test/functional/services/ml.ts b/x-pack/test/functional/services/ml.ts
@@ -9,6 +9,7 @@ import { FtrProviderContext } from '../ftr_provider_context';
 import {
   MachineLearningAnomalyExplorerProvider,
   MachineLearningAPIProvider,
+  MachineLearningDataFrameAnalyticsProvider,
   MachineLearningDataFramesProvider,
   MachineLearningDataVisualizerProvider,
   MachineLearningJobManagementProvider,
@@ -26,6 +27,7 @@ import {
 export function MachineLearningProvider(context: FtrProviderContext) {
   const anomalyExplorer = MachineLearningAnomalyExplorerProvider(context);
   const api = MachineLearningAPIProvider(context);
+  const dataFrameAnalytics = MachineLearningDataFrameAnalyticsProvider(context);
   const dataFrames = MachineLearningDataFramesProvider(context);
   const dataVisualizer = MachineLearningDataVisualizerProvider(context);
   const jobManagement = MachineLearningJobManagementProvider(context);
@@ -42,6 +44,7 @@ export function MachineLearningProvider(context: FtrProviderContext) {
   return {
     anomalyExplorer,
     api,
+    dataFrameAnalytics,
     dataFrames,
     dataVisualizer,
     jobManagement,