Merge branch '240941-fe-link-to-sast-config-ui-in-projects-with-ci-file' into 'master'

Allow SAST configuration with existing CI file

See merge request gitlab-org/gitlab!40528

doc/user/application_security/sast/index.md

@@ -147,17 +147,18 @@ always take the latest SAST artifact available.
 
 ### Configure SAST in the UI
 
-> [Introduced](https://gitlab.com/groups/gitlab-org/-/epics/3659) in GitLab Ultimate 13.3.
+> - [Introduced](https://gitlab.com/groups/gitlab-org/-/epics/3659) in GitLab Ultimate 13.3.
+> - [Improved](https://gitlab.com/gitlab-org/gitlab/-/issues/232862) in GitLab Ultimate 13.4.
 
-For a project that does not have a `.gitlab-ci.yml` file, you can enable SAST with a basic
-configuration using the **SAST Configuration** page:
+You can enable and configure SAST with a basic configuration using the **SAST Configuration**
+page:
 
 1. From the project's home page, go to **Security & Compliance** > **Configuration** in the
    left sidebar.
-1. Click **Enable via Merge Request** on the Static Application Security Testing (SAST) row.
-1. Enter the appropriate SAST details into the fields on the page. See [Available variables](#available-variables)
-   for a description of these variables.
-1. Click **Create Merge Request**.
+1. If the project does not have a `gitlab-ci.yml` file, click **Enable** in the Static Application Security Testing (SAST) row, otherwise click **Configure**.
+1. Enter the custom SAST values, then click **Create Merge Request**.
+
+    Custom values are stored in the `.gitlab-ci.yml` file. For variables not in the SAST Configuration page, their values are left unchanged. Default values are inherited from the GitLab SAST template.
 1. Review and merge the merge request.
 
 ### Customizing the SAST settings

ee/app/assets/javascripts/security_configuration/components/app.vue

@@ -180,7 +180,6 @@ export default {
       <template #cell(manage)="{ item }">
         <manage-feature
           :feature="item"
-          :gitlab-ci-present="gitlabCiPresent"
           :auto-devops-enabled="autoDevopsEnabled"
           :create-sast-merge-request-path="createSastMergeRequestPath"
         />

ee/app/assets/javascripts/security_configuration/components/manage_feature.vue

@@ -20,10 +20,6 @@ export default {
       type: Boolean,
       required: true,
     },
-    gitlabCiPresent: {
-      type: Boolean,
-      required: true,
-    },
     createSastMergeRequestPath: {
       type: String,
       required: true,
@@ -31,17 +27,11 @@ export default {
   },
   computed: {
     canConfigureFeature() {
-      return Boolean(
-        this.glFeatures.sastConfigurationUi &&
-          this.feature.configuration_path &&
-          !this.gitlabCiPresent,
-      );
+      return Boolean(this.glFeatures.sastConfigurationUi && this.feature.configuration_path);
     },
     // TODO: Remove as part of https://gitlab.com/gitlab-org/gitlab/-/issues/227575
     canCreateSASTMergeRequest() {
-      return Boolean(
-        this.feature.type === 'sast' && this.createSastMergeRequestPath && !this.gitlabCiPresent,
-      );
+      return Boolean(this.feature.type === 'sast' && this.createSastMergeRequestPath);
     },
     getFeatureDocumentationLinkLabel() {
       return sprintf(s__('SecurityConfiguration|Feature documentation for %{featureName}'), {
@@ -54,7 +44,7 @@ export default {
 
 <template>
   <gl-button
-    v-if="canConfigureFeature && autoDevopsEnabled"
+    v-if="canConfigureFeature && feature.configured"
     :href="feature.configuration_path"
     data-testid="configureButton"
     >{{ s__('SecurityConfiguration|Configure') }}</gl-button

ee/changelogs/unreleased/240941-fe-link-to-sast-config-ui-in-projects-with-ci-file.yml

+---
+title: Allow SAST Configuration UI to be used when there's an existing CI file
+merge_request: 40528
+author:
+type: changed

ee/spec/frontend/security_configuration/components/app_spec.js

@@ -177,7 +177,6 @@ describe('Security Configuration App', () => {
         expect(manage.find(ManageFeature).props()).toMatchObject({
           feature: features[i],
           autoDevopsEnabled: propsData.autoDevopsEnabled,
-          gitlabCiPresent: propsData.gitlabCiPresent,
           createSastMergeRequestPath: propsData.createSastMergeRequestPath,
         });
       }

ee/spec/frontend/security_configuration/components/manage_feature_spec.js

@@ -17,7 +17,6 @@ describe('ManageFeature component', () => {
         {
           propsData: {
             createSastMergeRequestPath,
-            gitlabCiPresent: false,
             autoDevopsEnabled: false,
           },
         },
@@ -28,7 +27,6 @@ describe('ManageFeature component', () => {
 
   afterEach(() => {
     wrapper.destroy();
-    wrapper = null;
   });
 
   const findCreateMergeRequestButton = () => wrapper.find(CreateMergeRequestButton);
@@ -44,17 +42,17 @@ describe('ManageFeature component', () => {
     };
 
     describe.each`
-      autoDevopsEnabled | expectedTestId
-      ${true}           | ${'configureButton'}
-      ${false}          | ${'enableButton'}
-    `('given autoDevopsEnabled is $autoDevopsEnabled', ({ autoDevopsEnabled, expectedTestId }) => {
-      describe('given no CI file and feature with a configuration path', () => {
+      configured | expectedTestId
+      ${true}    | ${'configureButton'}
+      ${false}   | ${'enableButton'}
+    `('given feature.configured is $configured', ({ configured, expectedTestId }) => {
+      describe('given a configuration path', () => {
         beforeEach(() => {
-          [feature] = generateFeatures(1, { configuration_path: 'foo' });
+          [feature] = generateFeatures(1, { configured, configuration_path: 'foo' });
 
           createComponent({
             ...featureFlagEnabled,
-            propsData: { feature, gitlabCiPresent: false, autoDevopsEnabled },
+            propsData: { feature },
           });
         });
 
@@ -67,14 +65,14 @@ describe('ManageFeature component', () => {
     });
   });
 
-  describe('given a feature with type "sast" and no CI file', () => {
+  describe('given a feature with type "sast"', () => {
     const autoDevopsEnabled = true;
 
     beforeEach(() => {
       [feature] = generateFeatures(1, { type: 'sast' });
 
       createComponent({
-        propsData: { feature, gitlabCiPresent: false, autoDevopsEnabled },
+        propsData: { feature, autoDevopsEnabled },
       });
     });
 
@@ -88,27 +86,20 @@ describe('ManageFeature component', () => {
     });
   });
 
-  describe.each`
-    featureProps        | gitlabCiPresent
-    ${{ type: 'sast' }} | ${true}
-    ${{}}               | ${false}
-  `(
-    'given a featureProps with $featureProps and gitlabCiPresent is $gitlabCiPresent',
-    ({ featureProps, gitlabCiPresent }) => {
-      beforeEach(() => {
-        [feature] = generateFeatures(1, featureProps);
-
-        createComponent({
-          propsData: { feature, gitlabCiPresent },
-        });
-      });
+  describe('given a feature type that is not "sast"', () => {
+    beforeEach(() => {
+      [feature] = generateFeatures(1, { type: 'something_that_is_not_sast' });
 
-      it('shows docs link for feature', () => {
-        const link = findTestId('docsLink');
-        expect(link.exists()).toBe(true);
-        expect(link.attributes('aria-label')).toContain(feature.name);
-        expect(link.attributes('href')).toBe(feature.link);
+      createComponent({
+        propsData: { feature },
       });
-    },
-  );
+    });
+
+    it('shows docs link for feature', () => {
+      const link = findTestId('docsLink');
+      expect(link.exists()).toBe(true);
+      expect(link.attributes('aria-label')).toContain(feature.name);
+      expect(link.attributes('href')).toBe(feature.link);
+    });
+  });
 });