[RAC] create functional tests for add to case (elastic#114075)

* [RAC] create functional tests for add to case

* use observability test helpers for user creation

* basic tests for add to case options

* add two more cases

* test case for clicking on add to new case button

* remove unused expect statement

* clicking on add to existing case should open a modal

* move add to case functionality in a separate file

* address comments in the PR review

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

x-pack/plugins/timelines/public/components/actions/timeline/cases/add_to_existing_case_button.tsx

@@ -32,7 +32,7 @@ const AddToCaseActionComponent: React.FC<AddToCaseActionProps> = ({
       {userCanCrud && (
         <EuiContextMenuItem
           aria-label={ariaLabel}
-          data-test-subj="attach-alert-to-case-button"
+          data-test-subj="add-existing-case-menu-item"
           onClick={addExistingCaseClick}
           // needs forced size="s" since it is lazy loaded and the EuiContextMenuPanel can not initialize the size
           size="s"

x-pack/plugins/timelines/public/components/actions/timeline/cases/add_to_new_case_button.tsx

@@ -33,7 +33,7 @@ const AddToCaseActionComponent: React.FC<AddToCaseActionProps> = ({
       {userCanCrud && (
         <EuiContextMenuItem
           aria-label={ariaLabel}
-          data-test-subj="attach-alert-to-case-button"
+          data-test-subj="add-new-case-item"
           onClick={addNewCaseClick}
           // needs forced size="s" since it is lazy loaded and the EuiContextMenuPanel can not initialize the size
           size="s"

x-pack/test/functional/services/observability/alerts/add_to_case.ts

@@ -0,0 +1,75 @@
+/*
+ * 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 { FtrProviderContext } from '../../../ftr_provider_context';
+
+const ADD_TO_EXISTING_CASE_SELECTOR = 'add-existing-case-menu-item';
+const ADD_TO_NEW_CASE_SELECTOR = 'add-new-case-item';
+const CREATE_CASE_FLYOUT = 'create-case-flyout';
+const SELECT_CASE_MODAL = 'all-cases-modal';
+
+export function ObservabilityAlertsAddToCaseProvider({ getService }: FtrProviderContext) {
+  const testSubjects = getService('testSubjects');
+
+  const getAddToExistingCaseSelector = async () => {
+    return await testSubjects.find(ADD_TO_EXISTING_CASE_SELECTOR);
+  };
+
+  const getAddToExistingCaseSelectorOrFail = async () => {
+    return await testSubjects.existOrFail(ADD_TO_EXISTING_CASE_SELECTOR);
+  };
+
+  const missingAddToExistingCaseSelectorOrFail = async () => {
+    return await testSubjects.missingOrFail(ADD_TO_EXISTING_CASE_SELECTOR);
+  };
+
+  const getAddToNewCaseSelector = async () => {
+    return await testSubjects.find(ADD_TO_NEW_CASE_SELECTOR);
+  };
+
+  const getAddToNewCaseSelectorOrFail = async () => {
+    return await testSubjects.existOrFail(ADD_TO_NEW_CASE_SELECTOR);
+  };
+
+  const missingAddToNewCaseSelectorOrFail = async () => {
+    return await testSubjects.missingOrFail(ADD_TO_NEW_CASE_SELECTOR);
+  };
+
+  const addToNewCaseButtonClick = async () => {
+    return await (await getAddToNewCaseSelector()).click();
+  };
+
+  const addToExistingCaseButtonClick = async () => {
+    return await (await getAddToExistingCaseSelector()).click();
+  };
+
+  const getCreateCaseFlyoutOrFail = async () => {
+    return await testSubjects.existOrFail(CREATE_CASE_FLYOUT);
+  };
+
+  const closeFlyout = async () => {
+    return await (await testSubjects.find('euiFlyoutCloseButton')).click();
+  };
+
+  const getAddtoExistingCaseModalOrFail = async () => {
+    return await testSubjects.existOrFail(SELECT_CASE_MODAL);
+  };
+
+  return {
+    getAddToExistingCaseSelector,
+    getAddToExistingCaseSelectorOrFail,
+    missingAddToExistingCaseSelectorOrFail,
+    getAddToNewCaseSelector,
+    getAddToNewCaseSelectorOrFail,
+    missingAddToNewCaseSelectorOrFail,
+    getCreateCaseFlyoutOrFail,
+    closeFlyout,
+    addToNewCaseButtonClick,
+    addToExistingCaseButtonClick,
+    getAddtoExistingCaseModalOrFail,
+  };
+}

x-pack/test/functional/services/observability/alerts/common.ts

@@ -204,5 +204,6 @@ export function ObservabilityAlertsCommonProvider({
     setWorkflowStatusFilter,
     submitQuery,
     typeInQueryBar,
+    openActionsMenuForRow,
   };
 }

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

@@ -7,15 +7,17 @@
 
 import { ObservabilityAlertsPaginationProvider } from './pagination';
 import { ObservabilityAlertsCommonProvider } from './common';
+import { ObservabilityAlertsAddToCaseProvider } from './add_to_case';
 
 import { FtrProviderContext } from '../../../ftr_provider_context';
 
 export function ObservabilityAlertsProvider(context: FtrProviderContext) {
   const common = ObservabilityAlertsCommonProvider(context);
   const pagination = ObservabilityAlertsPaginationProvider(context);
-
+  const addToCase = ObservabilityAlertsAddToCaseProvider(context);
   return {
     common,
     pagination,
+    addToCase,
   };
 }

x-pack/test/observability_functional/apps/observability/alerts/add_to_case.ts

@@ -0,0 +1,92 @@
+/*
+ * 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 { FtrProviderContext } from '../../../ftr_provider_context';
+
+export default ({ getService, getPageObjects }: FtrProviderContext) => {
+  const esArchiver = getService('esArchiver');
+  const observability = getService('observability');
+  const retry = getService('retry');
+
+  describe('Observability alerts / Add to case', function () {
+    this.tags('includeFirefox');
+
+    before(async () => {
+      await esArchiver.load('x-pack/test/functional/es_archives/observability/alerts');
+    });
+
+    after(async () => {
+      await esArchiver.unload('x-pack/test/functional/es_archives/observability/alerts');
+    });
+
+    describe('When user has all priviledges for cases', () => {
+      before(async () => {
+        await observability.users.setTestUserRole(
+          observability.users.defineBasicObservabilityRole({
+            observabilityCases: ['all'],
+            logs: ['all'],
+          })
+        );
+        await observability.alerts.common.navigateToTimeWithData();
+      });
+
+      after(async () => {
+        await observability.users.restoreDefaultTestUserRole();
+      });
+
+      it('renders case options in the overflow menu', async () => {
+        await observability.alerts.common.openActionsMenuForRow(0);
+        await retry.try(async () => {
+          await observability.alerts.addToCase.getAddToExistingCaseSelectorOrFail();
+          await observability.alerts.addToCase.getAddToNewCaseSelectorOrFail();
+        });
+      });
+
+      it('opens a flyout when Add to new case is clicked', async () => {
+        await observability.alerts.addToCase.addToNewCaseButtonClick();
+
+        await retry.try(async () => {
+          await observability.alerts.addToCase.getCreateCaseFlyoutOrFail();
+          await observability.alerts.addToCase.closeFlyout();
+        });
+      });
+
+      it('opens a modal when Add to existing case is clicked', async () => {
+        await observability.alerts.common.openActionsMenuForRow(0);
+
+        await retry.try(async () => {
+          await observability.alerts.addToCase.addToExistingCaseButtonClick();
+          await observability.alerts.addToCase.getAddtoExistingCaseModalOrFail();
+        });
+      });
+    });
+
+    describe('When user has read permissions for cases', () => {
+      before(async () => {
+        await observability.users.setTestUserRole(
+          observability.users.defineBasicObservabilityRole({
+            observabilityCases: ['read'],
+            logs: ['all'],
+          })
+        );
+        await observability.alerts.common.navigateToTimeWithData();
+      });
+
+      after(async () => {
+        await observability.users.restoreDefaultTestUserRole();
+      });
+
+      it('does not render case options in the overflow menu', async () => {
+        await observability.alerts.common.openActionsMenuForRow(0);
+        await retry.try(async () => {
+          await observability.alerts.addToCase.missingAddToExistingCaseSelectorOrFail();
+          await observability.alerts.addToCase.missingAddToNewCaseSelectorOrFail();
+        });
+      });
+    });
+  });
+};

x-pack/test/observability_functional/apps/observability/index.ts

@@ -15,5 +15,6 @@ export default function ({ loadTestFile }: FtrProviderContext) {
     loadTestFile(require.resolve('./alerts'));
     loadTestFile(require.resolve('./alerts/workflow_status'));
     loadTestFile(require.resolve('./alerts/pagination'));
+    loadTestFile(require.resolve('./alerts/add_to_case'));
   });
 }