[Cloud Security] fix creation flow pop-ups in ess and use accordian f…

…or cloud credentials (elastic#190471) ## Summary Summarize your PR. If it involves visual changes include a screenshot or gif. `isAgentlessPackagePolicy` is checks for agentless integration for Serverless. Agnostic check that tells is integration is agentless so for now we use `isAgentlessAgentPolicy` which checks if integration is agentless for both ESS and Serverless. Also, my last PR was missing the added accordian fix and test case to ensure Popup is disabled for Agentless and enabled for Agent-based policy. ### Checklist Delete any items that are not applicable to this PR. - [X] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios
rshen91 · Aug 15, 2024 · d24105d · d24105d
1 parent 1aeecaf
commit d24105d
Show file tree

Hide file tree

Showing 5 changed files with 48 additions and 12 deletions.
diff --git a/...ublic/components/fleet_extensions/aws_credentials_form/aws_credentials_form_agentless.tsx b/...ublic/components/fleet_extensions/aws_credentials_form/aws_credentials_form_agentless.tsx
@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { EuiButton, EuiCallOut, EuiLink, EuiSpacer, EuiText } from '@elastic/eui';
+import { EuiAccordion, EuiButton, EuiCallOut, EuiLink, EuiSpacer, EuiText } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 import semverCompare from 'semver/functions/compare';
 import semverValid from 'semver/functions/valid';
@@ -68,7 +68,7 @@ Utilize AWS CloudFormation (a built-in AWS tool) or a series of manual steps to
           ),
         }}
       />
-      <EuiSpacer size="m" />
+      <EuiSpacer size="l" />
       <EuiText size="s" color="subdued">
         <ol>
           {isOrganization ? (
@@ -251,8 +251,16 @@ export const AwsCredentialsFormAgentless = ({
       {awsCredentialsType === DEFAULT_AGENTLESS_AWS_CREDENTIALS_TYPE &&
         showCloudCredentialsButton && (
           <>
-            <CloudFormationCloudCredentialsGuide isOrganization={isOrganization} />
             <EuiSpacer size="m" />
+            <EuiAccordion
+              id="cloudFormationAccordianInstructions"
+              data-test-subj="launchGoogleCloudFormationAccordianInstructions"
+              buttonContent={<EuiLink>Steps to Generate AWS Account Credentials</EuiLink>}
+              paddingSize="l"
+            >
+              <CloudFormationCloudCredentialsGuide isOrganization={isOrganization} />
+            </EuiAccordion>
+            <EuiSpacer size="l" />
             <EuiButton
               data-test-subj="launchCloudFormationAgentlessButton"
               target="_blank"

diff --git a/...ublic/components/fleet_extensions/gcp_credentials_form/gcp_credentials_form_agentless.tsx b/...ublic/components/fleet_extensions/gcp_credentials_form/gcp_credentials_form_agentless.tsx
@@ -6,7 +6,15 @@
  */
 
 import React from 'react';
-import { EuiButton, EuiCallOut, EuiCodeBlock, EuiLink, EuiSpacer, EuiText } from '@elastic/eui';
+import {
+  EuiAccordion,
+  EuiButton,
+  EuiCallOut,
+  EuiCodeBlock,
+  EuiLink,
+  EuiSpacer,
+  EuiText,
+} from '@elastic/eui';
 import semverCompare from 'semver/functions/compare';
 import semverValid from 'semver/functions/valid';
 import { FormattedMessage } from '@kbn/i18n-react';
@@ -64,7 +72,7 @@ const GoogleCloudShellCredentialsGuide = (props: {
             ),
           }}
         />
-        <EuiSpacer size="m" />
+        <EuiSpacer size="l" />
         <EuiText size="s" color="subdued">
           <ol>
             <li>
@@ -102,7 +110,7 @@ const GoogleCloudShellCredentialsGuide = (props: {
             <li>
               <FormattedMessage
                 id="xpack.csp.googleCloudShellCredentials.guide.steps.cloudShellButton"
-                defaultMessage="Click the {cloudShellButton} button above and login into your account"
+                defaultMessage="Click the {cloudShellButton} button below and login into your account"
                 values={{
                   cloudShellButton: <strong>Launch Google Cloud Shell</strong>,
                 }}
@@ -206,11 +214,19 @@ export const GcpCredentialsFormAgentless = ({
       )}
       {showCloudCredentialsButton && (
         <>
-          <GoogleCloudShellCredentialsGuide
-            isOrganization={isOrganization}
-            commandText={commandText}
-          />
           <EuiSpacer size="m" />
+          <EuiAccordion
+            id="cloudShellAccordianInstructions"
+            data-test-subj="launchGoogleCloudShellAccordianInstructions"
+            buttonContent={<EuiLink>Steps to Generate GCP Account Credentials</EuiLink>}
+            paddingSize="l"
+          >
+            <GoogleCloudShellCredentialsGuide
+              isOrganization={isOrganization}
+              commandText={commandText}
+            />
+          </EuiAccordion>
+          <EuiSpacer size="l" />
           <EuiButton
             data-test-subj="launchGoogleCloudShellAgentlessButton"
             target="_blank"

diff --git a/.../fleet/sections/agent_policy/create_package_policy_page/single_page_layout/hooks/form.tsx b/.../fleet/sections/agent_policy/create_package_policy_page/single_page_layout/hooks/form.tsx
@@ -386,9 +386,12 @@ export function useOnSubmit({
       if (!error) {
         setSavedPackagePolicy(data!.item);
 
+        // Check if agentless is configured in ESS and Serverless until Agentless API migrates to Serverless
+        const isAgentlessConfigured =
+          isAgentlessAgentPolicy(createdPolicy) || isAgentlessPackagePolicy(data!.item);
         const promptForAgentEnrollment =
           !(agentCount && agentPolicies.length > 0) &&
-          !isAgentlessPackagePolicy(data!.item) &&
+          !isAgentlessConfigured &&
           hasFleetAddAgentsPrivileges;
 
         if (promptForAgentEnrollment && hasAzureArmTemplate) {

diff --git a/x-pack/test/cloud_security_posture_functional/agentless/create_agent.ts b/x-pack/test/cloud_security_posture_functional/agentless/create_agent.ts
@@ -27,11 +27,13 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
 
   describe('Agentless cloud', function () {
     let cisIntegration: typeof pageObjects.cisAddIntegration;
+    let cisIntegrationAws: typeof pageObjects.cisAddIntegration.cisAws;
     let mockApiServer: http.Server;
 
     before(async () => {
       cisIntegration = pageObjects.cisAddIntegration;
-      mockApiServer = mockAgentlessApiService.listen(8089); // Start the usage api mock server on port 8089
+      cisIntegrationAws = pageObjects.cisAddIntegration.cisAws;
+      mockApiServer = await mockAgentlessApiService.listen(8089); // Start the usage api mock server on port 8081
     });
 
     after(async () => {
@@ -58,6 +60,8 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
       await cisIntegration.clickSaveButton();
       await pageObjects.header.waitUntilLoadingHasFinished();
 
+      expect(await cisIntegrationAws.showPostInstallCloudFormationModal()).to.be(false);
+
       await cisIntegration.navigateToIntegrationCspList();
       await pageObjects.header.waitUntilLoadingHasFinished();
 
@@ -84,6 +88,8 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
       await cisIntegration.clickSaveButton();
       await pageObjects.header.waitUntilLoadingHasFinished();
 
+      expect(await cisIntegrationAws.showPostInstallCloudFormationModal()).to.be(true);
+
       const agentPolicyName = await cisIntegration.getAgentBasedPolicyValue();
 
       await cisIntegration.navigateToIntegrationCspList();

diff --git a/x-pack/test/cloud_security_posture_functional/page_objects/add_cis_integration_form_page.ts b/x-pack/test/cloud_security_posture_functional/page_objects/add_cis_integration_form_page.ts
@@ -54,6 +54,9 @@ export function AddCisIntegrationFormPageProvider({
     getPostInstallCloudFormationModal: async () => {
       return await testSubjects.find('postInstallCloudFormationModal');
     },
+    showPostInstallCloudFormationModal: async () => {
+      return await testSubjects.exists('postInstallCloudFormationModal');
+    },
     showLaunchCloudFormationAgentlessButton: async () => {
       return await testSubjects.exists('launchCloudFormationAgentlessButton');
     },