[Cases] Handle lens actions in Serverless

test/functional/page_objects/dashboard_page.ts

@@ -454,7 +454,8 @@ export class DashboardPageObject extends FtrService {
    */
   public async saveDashboard(
     dashboardName: string,
-    saveOptions: SaveDashboardOptions = { waitDialogIsClosed: true, exitFromEditMode: true }
+    saveOptions: SaveDashboardOptions = { waitDialogIsClosed: true, exitFromEditMode: true },
+    skipLoadingIndicatorHiddenCheck?: boolean,
   ) {
     await this.retry.try(async () => {
       await this.enterDashboardTitleAndClickSave(dashboardName, saveOptions);
@@ -468,14 +469,21 @@ export class DashboardPageObject extends FtrService {
       await this.testSubjects.existOrFail('saveDashboardSuccess');
     });
     const message = await this.common.closeToast();
-    await this.header.waitUntilLoadingHasFinished();
+
+    if(!skipLoadingIndicatorHiddenCheck) {
+      await this.header.waitUntilLoadingHasFinished();
+    }
+
     await this.common.waitForSaveModalToClose();
 
     const isInViewMode = await this.testSubjects.exists('dashboardEditMode');
     if (saveOptions.exitFromEditMode && !isInViewMode) {
       await this.clickCancelOutOfEditMode();
     }
-    await this.header.waitUntilLoadingHasFinished();
+
+    if(!skipLoadingIndicatorHiddenCheck) {
+      await this.header.waitUntilLoadingHasFinished();
+    }
 
     return message;
   }
@@ -557,15 +565,19 @@ export class DashboardPageObject extends FtrService {
 
   // use the search filter box to narrow the results down to a single
   // entry, or at least to a single page of results
-  public async loadSavedDashboard(dashboardName: string) {
+  public async loadSavedDashboard(dashboardName: string, skipLoadingIndicatorHiddenCheck?: boolean) {
     this.log.debug(`Load Saved Dashboard ${dashboardName}`);
 
     await this.gotoDashboardLandingPage();
 
     await this.listingTable.searchForItemWithName(dashboardName);
     await this.retry.try(async () => {
       await this.listingTable.clickItemLink('dashboard', dashboardName);
-      await this.header.waitUntilLoadingHasFinished();
+
+      if(!skipLoadingIndicatorHiddenCheck) {
+        await this.header.waitUntilLoadingHasFinished();
+      }
+
       // check Dashboard landing page is not present
       await this.testSubjects.missingOrFail('dashboardLandingPage', { timeout: 10000 });
     });

test/functional/page_objects/time_picker.ts

@@ -129,7 +129,7 @@ export class TimePickerPageObject extends FtrService {
    * @param {String} toTime MMM D, YYYY @ HH:mm:ss.SSS
    * @param {Boolean} force time picker force update, default is false
    */
-  public async setAbsoluteRange(fromTime: string, toTime: string, force = false) {
+  public async setAbsoluteRange(fromTime: string, toTime: string, force = false, skipLoadingIndicatorHiddenCheck = false) {
     if (!force) {
       const currentUrl = decodeURI(await this.browser.getCurrentUrl());
       const DEFAULT_DATE_FORMAT = 'MMM D, YYYY @ HH:mm:ss.SSS';
@@ -192,7 +192,9 @@ export class TimePickerPageObject extends FtrService {
       await this.testSubjects.click('querySubmitButton');
     }
 
-    await this.header.awaitGlobalLoadingIndicatorHidden();
+    if(!skipLoadingIndicatorHiddenCheck) {
+      await this.header.awaitGlobalLoadingIndicatorHidden();
+    }
   }
 
   public async isOff() {

test/functional/services/dashboard/add_panel.ts

@@ -24,14 +24,18 @@ export class DashboardAddPanelService extends FtrService {
     await this.common.sleep(500);
   }
 
-  async clickCreateNewLink() {
+  async clickCreateNewLink(skipLoadingIndicatorHiddenCheck?: boolean) {
     this.log.debug('DashboardAddPanel.clickAddNewPanelButton');
     await this.retry.try(async () => {
       // prevent query bar auto suggest from blocking button
       await this.browser.pressKeys(this.browser.keys.ESCAPE);
       await this.testSubjects.click('dashboardAddNewPanelButton');
       await this.testSubjects.waitForDeleted('dashboardAddNewPanelButton');
-      await this.header.waitUntilLoadingHasFinished();
+
+      if(!skipLoadingIndicatorHiddenCheck) {
+        await this.header.waitUntilLoadingHasFinished();
+      }
+
       await this.testSubjects.existOrFail('lnsApp', {
         timeout: 5000,
       });

x-pack/plugins/cases/public/components/create/form.test.tsx

@@ -24,18 +24,18 @@ import { useCaseConfigureResponse } from '../configure_cases/__mock__';
 import { TestProviders } from '../../common/mock';
 import { useGetSupportedActionConnectors } from '../../containers/configure/use_get_supported_action_connectors';
 import { useGetTags } from '../../containers/use_get_tags';
+import { useAvailableCasesOwners } from '../app/use_available_owners';
 
 jest.mock('../../containers/use_get_tags');
 jest.mock('../../containers/configure/use_get_supported_action_connectors');
 jest.mock('../../containers/configure/use_configure');
 jest.mock('../markdown_editor/plugins/lens/use_lens_draft_comment');
-jest.mock('../app/use_available_owners', () => ({
-  useAvailableCasesOwners: () => ['securitySolution', 'observability'],
-}));
+jest.mock('../app/use_available_owners');
 
 const useGetTagsMock = useGetTags as jest.Mock;
 const useGetConnectorsMock = useGetSupportedActionConnectors as jest.Mock;
 const useCaseConfigureMock = useCaseConfigure as jest.Mock;
+const useAvailableOwnersMock = useAvailableCasesOwners as jest.Mock;
 
 const initialCaseValue: FormProps = {
   description: '',
@@ -77,6 +77,7 @@ describe('CreateCaseForm', () => {
 
   beforeEach(() => {
     jest.clearAllMocks();
+    useAvailableOwnersMock.mockReturnValue(['securitySolution', 'observability']);
     useGetTagsMock.mockReturnValue({ data: ['test'] });
     useGetConnectorsMock.mockReturnValue({ isLoading: false, data: connectorsMock });
     useCaseConfigureMock.mockImplementation(() => useCaseConfigureResponse);
@@ -138,6 +139,18 @@ describe('CreateCaseForm', () => {
     expect(wrapper.find(`[data-test-subj="caseOwnerSelector"]`).exists()).toBeTruthy();
   });
 
+  it('does not render solution picker when only one owner is available', async () => {
+    useAvailableOwnersMock.mockReturnValue(['securitySolution']);
+
+    const wrapper = mount(
+      <MockHookWrapperComponent>
+        <CreateCaseForm {...casesFormProps} />
+      </MockHookWrapperComponent>
+    );
+
+    expect(wrapper.find(`[data-test-subj="caseOwnerSelector"]`).exists()).toBeFalsy();
+  });
+
   it('hides the sync alerts toggle', () => {
     const { queryByText } = render(
       <MockHookWrapperComponent testProviderProps={{ features: { alerts: { sync: false } } }}>

x-pack/plugins/cases/public/components/create/form.tsx

@@ -86,9 +86,8 @@ export const CreateCaseFormFields: React.FC<CreateCaseFormFieldsProps> = React.m
   ({ connectors, isLoadingConnectors, withSteps, owner, draftStorageKey }) => {
     const { isSubmitting } = useFormContext();
     const { isSyncAlertsEnabled, caseAssignmentAuthorized } = useCasesFeatures();
-
     const availableOwners = useAvailableCasesOwners();
-    const canShowCaseSolutionSelection = !owner.length && availableOwners.length;
+    const canShowCaseSolutionSelection = !owner.length && availableOwners.length > 1;
 
     const firstStep = useMemo(
       () => ({

x-pack/plugins/cases/public/components/create/form_context.tsx

@@ -26,6 +26,7 @@ import {
   getConnectorsFormDeserializer,
   getConnectorsFormSerializer,
 } from '../utils';
+import { useAvailableCasesOwners } from '../app/use_available_owners';
 import type { CaseAttachmentsWithoutOwner } from '../../types';
 import { useGetSupportedActionConnectors } from '../../containers/configure/use_get_supported_action_connectors';
 import { useCreateCaseWithAttachmentsTransaction } from '../../common/apm/use_cases_transactions';
@@ -68,6 +69,7 @@ export const FormContext: React.FC<Props> = ({
   const { mutateAsync: createAttachments } = useCreateAttachments();
   const { mutateAsync: pushCaseToExternalService } = usePostPushToService();
   const { startTransaction } = useCreateCaseWithAttachmentsTransaction();
+  const availableOwners = useAvailableCasesOwners();
 
   const submitCase = useCallback(
     async (
@@ -82,6 +84,7 @@ export const FormContext: React.FC<Props> = ({
       if (isValid) {
         const { selectedOwner, ...userFormData } = dataWithoutConnectorId;
         const caseConnector = getConnectorById(dataConnectorId, connectors);
+        const defaultOwner = owner[0] ?? availableOwners[0];
 
         startTransaction({ appId, attachments });
 
@@ -94,7 +97,7 @@ export const FormContext: React.FC<Props> = ({
             ...userFormData,
             connector: connectorToUpdate,
             settings: { syncAlerts },
-            owner: selectedOwner ?? owner[0],
+            owner: selectedOwner ?? defaultOwner,
           },
         });
 
@@ -131,6 +134,7 @@ export const FormContext: React.FC<Props> = ({
       attachments,
       postCase,
       owner,
+      availableOwners,
       afterCaseCreated,
       onSuccess,
       createAttachments,

x-pack/test_serverless/functional/test_suites/observability/cases/attachment_framework.ts

@@ -0,0 +1,167 @@
+/*
+ * 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 'expect';
+import { v4 as uuidv4 } from 'uuid';
+import { FtrProviderContext } from '../../../ftr_provider_context';
+import { createCase } from './helper/api';
+import { ConnectorTypes } from '@kbn/cases-plugin/common/types/domain';
+
+export default ({ getPageObject, getService }: FtrProviderContext) => {
+  const common = getPageObject('common');
+  const dashboard = getPageObject('dashboard');
+  const lens = getPageObject('lens');
+  const timePicker = getPageObject('timePicker');
+  const svlCommonNavigation = getPageObject('svlCommonNavigation');
+  const svlObltNavigation = getService('svlObltNavigation');
+  const testSubjects = getService('testSubjects');
+  const esArchiver = getService('esArchiver');
+  const kibanaServer = getService('kibanaServer');
+  const dashboardAddPanel = getService('dashboardAddPanel');
+  const cases = getService('cases');
+  const find = getService('find');
+  const listingTable = getService('listingTable');
+  const supertest = getService('supertest');
+
+  // duplicated from x-pack/test/functional/page_objects/lens_page.ts to convert args into object for better readability 
+  const goToTimeRange = async ({ fromTime, toTime, skipLoadingIndicatorHiddenCheck }: { fromTime?: string, toTime?: string, skipLoadingIndicatorHiddenCheck?: boolean }) => {
+    await timePicker.ensureHiddenNoDataPopover();
+    fromTime = fromTime || timePicker.defaultStartTime;
+    toTime = toTime || timePicker.defaultEndTime;
+    await timePicker.setAbsoluteRange(fromTime, toTime, false, skipLoadingIndicatorHiddenCheck);
+    await common.sleep(500);
+  };
+
+  describe('persistable attachment', () => {
+    describe('lens visualization', () => {
+      const skipLoadingIndicatorHiddenCheck = true;
+      const myDashboardName = `My-dashboard-${uuidv4()}`;
+
+      before(async () => {
+        await esArchiver.loadIfNeeded('x-pack/test/functional/es_archives/logstash_functional');
+        await kibanaServer.importExport.load(
+          'x-pack/test/functional/fixtures/kbn_archiver/lens/lens_basic.json'
+        );
+
+        await svlObltNavigation.navigateToLandingPage();
+
+        await svlCommonNavigation.sidenav.clickLink({ deepLinkId: 'dashboards' });
+
+        await dashboard.clickNewDashboard();
+
+        await dashboardAddPanel.clickCreateNewLink(skipLoadingIndicatorHiddenCheck);
+
+        await goToTimeRange({ skipLoadingIndicatorHiddenCheck });
+
+        await lens.configureDimension({
+          dimension: 'lnsXY_xDimensionPanel > lns-empty-dimension',
+          operation: 'date_histogram',
+          field: '@timestamp',
+        });
+
+        await lens.configureDimension({
+          dimension: 'lnsXY_yDimensionPanel > lns-empty-dimension',
+          operation: 'average',
+          field: 'bytes',
+        });
+
+        await lens.configureDimension({
+          dimension: 'lnsXY_splitDimensionPanel > lns-empty-dimension',
+          operation: 'terms',
+          field: 'ip',
+        });
+
+        await lens.saveAndReturn();
+        await dashboard.waitForRenderComplete();
+        await dashboard.saveDashboard(myDashboardName, {}, skipLoadingIndicatorHiddenCheck);   
+      });
+
+      after(async () => {
+        await cases.api.deleteAllCases();
+
+        await svlCommonNavigation.sidenav.clickLink({ deepLinkId: 'dashboards' });
+
+        await testSubjects.click('~breadcrumb-deepLinkId-dashboards');
+
+        await listingTable.checkListingSelectAllCheckbox();
+        await listingTable.clickDeleteSelected();
+
+        await esArchiver.unload('x-pack/test/functional/es_archives/logstash_functional');
+        await kibanaServer.importExport.unload(
+          'x-pack/test/functional/fixtures/kbn_archiver/lens/lens_basic.json'
+        );
+      });
+
+      it('adds lens visualization to a new case', async () => {
+        const caseTitle = 'case created in observability from my dashboard with lens visualization';
+
+        await testSubjects.click('embeddablePanelToggleMenuIcon');
+        await testSubjects.click('embeddablePanelMore-mainMenu');
+        await testSubjects.click('embeddablePanelAction-embeddable_addToNewCase');
+
+        await cases.create.createCase({
+          title: caseTitle,
+          description: 'test description',
+        });
+
+        // verify that solution picker is not visible
+        await testSubjects.missingOrFail('caseOwnerSelector');
+
+        await testSubjects.click('create-case-submit');
+
+        await cases.common.expectToasterToContain(`${caseTitle} has been updated`);
+
+        await testSubjects.click('toaster-content-case-view-link');
+
+        const title = await find.byCssSelector('[data-test-subj="editable-title-header-value"]');
+        expect(await title.getVisibleText()).toEqual(caseTitle);
+
+        await testSubjects.existOrFail('comment-persistableState-.lens');
+      });
+
+      it('adds lens visualization to an existing case from dashboard', async () => {
+        const theCaseTitle = 'case already exists in observability!!';
+        const postCaseReq = {
+          description: 'This is a test case to verify existing action scenario!!',
+          title: theCaseTitle,
+          tags: ['defacement'],
+          connector: {
+            id: 'none',
+            name: 'none',
+            type: ConnectorTypes.none,
+            fields: null,
+          },
+          settings: {
+            syncAlerts: true,
+          },
+          owner: 'observability',
+          assignees: [],
+        }
+        const theCase = await createCase(supertest, postCaseReq);
+
+        await svlCommonNavigation.sidenav.clickLink({ deepLinkId: 'dashboards' });
+
+        await testSubjects.click('embeddablePanelToggleMenuIcon');
+        await testSubjects.click('embeddablePanelMore-mainMenu');
+        await testSubjects.click('embeddablePanelAction-embeddable_addToExistingCase');
+
+        // verify that solution filter is not visible
+        await testSubjects.missingOrFail('solution-filter-popover-button');
+
+        await testSubjects.click(`cases-table-row-select-${theCase.id}`);
+
+        await cases.common.expectToasterToContain(`${theCaseTitle} has been updated`);
+        await testSubjects.click('toaster-content-case-view-link');
+
+        const title = await find.byCssSelector('[data-test-subj="editable-title-header-value"]');
+        expect(await title.getVisibleText()).toEqual(theCaseTitle);
+
+        await testSubjects.existOrFail('comment-persistableState-.lens');
+      });
+    });
+  });
+};