Connect backend to scans referenced in policies

- add new graphql field
- pass up new model propery through the view
- add tests

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

@@ -114,19 +114,19 @@ export default {
 
       return [...dataFields, ...staticFields];
     },
-    isPolicyProfile() {
-      return true;
-    },
-    deleteTitle() {
-      return this.isPolicyProfile
+  },
+  methods: {
+    deleteTitle(item) {
+      return this.isPolicyProfile(item)
         ? s__('DastProfiles|This profile is currently being used in a policy.')
         : s__('DastProfiles|Delete profile');
     },
-  },
-  methods: {
     handleDelete() {
       this.$emit('delete-profile', this.toBeDeletedProfileId);
     },
+    isPolicyProfile(item) {
+      return Boolean(item?.referencedInSecurityPolicies?.length);
+    },
     prepareProfileDeletion(profileId) {
       this.toBeDeletedProfileId = profileId;
       this.$refs[this.modalId].show();
@@ -207,20 +207,20 @@ export default {
               </gl-dropdown-item>
 
               <gl-dropdown-item
-                v-gl-tooltip.viewport
+                v-gl-tooltip="{ boundary: 'viewport', disabled: !isPolicyProfile(item) }"
                 boundary="viewport"
                 :class="{
-                  'gl-cursor-default': isPolicyProfile,
+                  'gl-cursor-default': isPolicyProfile(item),
                 }"
-                :disabled="isPolicyProfile"
-                :aria-disabled="isPolicyProfile"
+                :disabled="isPolicyProfile(item)"
+                :aria-disabled="isPolicyProfile(item)"
                 variant="danger"
-                :title="deleteTitle"
+                :title="deleteTitle(item)"
                 @click="prepareProfileDeletion(item.id)"
               >
                 <span
                   :class="{
-                    'gl-text-gray-200!': isPolicyProfile,
+                    'gl-text-gray-200!': isPolicyProfile(item),
                   }"
                 >
                   {{ __('Delete') }}
@@ -236,15 +236,20 @@ export default {
             >
               {{ __('Edit') }}
             </gl-button>
-            <span v-gl-tooltip.hover.focus :title="deleteTitle">
+            <span
+              v-gl-tooltip.hover.focus
+              :title="deleteTitle(item)"
+              data-testid="dast-profile-delete-tooltip"
+            >
               <gl-button
                 category="tertiary"
                 icon="remove"
                 variant="danger"
                 size="small"
                 class="gl-mx-3 gl-my-1 gl-md-display-none"
-                :disabled="isPolicyProfile"
-                :aria-disabled="isPolicyProfile"
+                data-testid="dast-profile-delete-button"
+                :disabled="isPolicyProfile(item)"
+                :aria-disabled="isPolicyProfile(item)"
                 @click="prepareProfileDeletion(item.id)"
               />
             </span>

ee/app/assets/javascripts/security_configuration/dast_profiles/graphql/dast_profiles.query.graphql

@@ -13,10 +13,12 @@ query DastProfiles($fullPath: ID!, $after: String, $before: String, $first: Int,
           dastSiteProfile {
             id
             targetUrl
+            referencedInSecurityPolicies
           }
           dastScannerProfile {
             id
             scanType
+            referencedInSecurityPolicies
           }
           branch {
             name

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

@@ -153,7 +153,7 @@ export default {
       return this.formHasErrors || this.requiredFieldEmpty || this.isPolicyProfile;
     },
     isPolicyProfile() {
-      return true;
+      return Boolean(this.profile?.referencedInSecurityPolicies?.length);
     },
   },
 
@@ -247,7 +247,13 @@ export default {
   <gl-form @submit.prevent="onSubmit">
     <h2 class="gl-mb-6">{{ i18n.title }}</h2>
 
-    <gl-alert v-if="isPolicyProfile" variant="info" class="gl-mb-5" :dismissible="false">
+    <gl-alert
+      v-if="isPolicyProfile"
+      data-testid="dast-policy-scanner-profile-alert"
+      variant="info"
+      class="gl-mb-5"
+      :dismissible="false"
+    >
       {{
         sprintf(
           s__(
@@ -258,7 +264,13 @@ export default {
       }}
     </gl-alert>
 
-    <gl-alert v-if="showAlert" variant="danger" class="gl-mb-5" @dismiss="hideErrors">
+    <gl-alert
+      v-if="showAlert"
+      data-testid="dast-scanner-profile-alert"
+      variant="danger"
+      class="gl-mb-5"
+      @dismiss="hideErrors"
+    >
       {{ s__('DastProfiles|Could not create the scanner profile. Please try again.') }}
       <ul v-if="errors.length" class="gl-mt-3 gl-mb-0">
         <li v-for="error in errors" :key="error" v-text="error"></li>

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

@@ -14,7 +14,7 @@ export default {
     validation: validation(),
   },
   props: {
-    isPolicyProfile: {
+    disabled: {
       type: Boolean,
       required: false,
       default: false,
@@ -82,7 +82,7 @@ export default {
 
 <template>
   <section>
-    <gl-form-group :disabled="isPolicyProfile" :label="s__('DastProfiles|Authentication')">
+    <gl-form-group :disabled="disabled" :label="s__('DastProfiles|Authentication')">
       <gl-form-checkbox v-model="form.fields.enabled.value" data-testid="auth-enable-checkbox">{{
         s__('DastProfiles|Enable Authentication')
       }}</gl-form-checkbox>
@@ -90,7 +90,7 @@ export default {
     <div v-if="form.fields.enabled.value" data-testid="auth-form">
       <div class="row">
         <gl-form-group
-          :disabled="isPolicyProfile"
+          :disabled="disabled"
           :label="s__('DastProfiles|Authentication URL')"
           :invalid-feedback="form.fields.url.feedback"
           class="col-md-6"
@@ -107,7 +107,7 @@ export default {
       </div>
       <div class="row">
         <gl-form-group
-          :disabled="isPolicyProfile"
+          :disabled="disabled"
           :label="s__('DastProfiles|Username')"
           :invalid-feedback="form.fields.username.feedback"
           class="col-md-6"
@@ -123,7 +123,7 @@ export default {
           />
         </gl-form-group>
         <gl-form-group
-          :disabled="isPolicyProfile"
+          :disabled="disabled"
           :label="s__('DastProfiles|Password')"
           :invalid-feedback="form.fields.password.feedback"
           class="col-md-6"
@@ -142,7 +142,7 @@ export default {
       </div>
       <div class="row">
         <gl-form-group
-          :disabled="isPolicyProfile"
+          :disabled="disabled"
           :label="s__('DastProfiles|Username form field')"
           :invalid-feedback="form.fields.usernameField.feedback"
           class="col-md-6"
@@ -157,7 +157,7 @@ export default {
           />
         </gl-form-group>
         <gl-form-group
-          :disabled="isPolicyProfile"
+          :disabled="disabled"
           :label="s__('DastProfiles|Password form field')"
           :invalid-feedback="form.fields.passwordField.feedback"
           class="col-md-6"

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

@@ -141,7 +141,7 @@ export default {
       return !isEqual(serializeFormObject(this.form.fields), this.initialFormValues);
     },
     isPolicyProfile() {
-      return true;
+      return Boolean(this.siteProfile?.referencedInSecurityPolicies?.length);
     },
   },
   async mounted() {
@@ -247,11 +247,17 @@ export default {
       {{ i18n.title }}
     </h2>
 
-    <gl-alert v-if="isPolicyProfile" variant="info" class="gl-mb-5" :dismissible="false">
+    <gl-alert
+      v-if="isPolicyProfile"
+      data-testid="dast-policy-site-profile-form-alert"
+      variant="info"
+      class="gl-mb-5"
+      :dismissible="false"
+    >
       {{
         sprintf(
           s__(
-            'DastProfiles|This site profile is currently being used by a policy. To make edits you must it from the active policy.',
+            'DastProfiles|This site profile is currently being used by a policy. To make edits you must remove it from the active policy.',
           ),
           { profileName: form.fields.profileName.value },
         )
@@ -364,7 +370,7 @@ export default {
     <dast-site-auth-section
       v-if="glFeatures.securityDastSiteProfilesAdditionalFields"
       v-model="authSection"
-      :is-policy-profile="isPolicyProfile"
+      :disabled="isPolicyProfile"
       :show-validation="form.showValidation"
     />
 

ee/app/views/projects/security/dast_scanner_profiles/edit.html.haml

@@ -8,5 +8,5 @@ profiles_library_path: project_security_configuration_dast_profiles_path(@projec
 scanner_profile: { id: @scanner_profile.to_global_id.to_s, name: @scanner_profile.name,
 spider_timeout: @scanner_profile.spider_timeout, target_timeout: @scanner_profile.target_timeout,
 scan_type: @scanner_profile.scan_type.upcase, use_ajax_spider: @scanner_profile.use_ajax_spider,
-show_debug_messages: @scanner_profile.show_debug_messages }.to_json,
+show_debug_messages: @scanner_profile.show_debug_messages, referenced_in_security_policies: @scanner_profile.referenced_in_security_policies }.to_json,
 on_demand_scans_path: Feature.enabled?(:dast_saved_scans, @project, default_enabled: :yaml) ? new_project_on_demand_scan_path(@project) : project_on_demand_scans_path(@project) } }

ee/app/views/projects/security/dast_site_profiles/edit.html.haml

@@ -7,5 +7,5 @@
 profiles_library_path: project_security_configuration_dast_profiles_path(@project, anchor: 'site-profiles'),
 site_profile: { id: @site_profile.to_global_id.to_s, name: @site_profile.name, target_url: @site_profile.dast_site.url,
 excluded_urls: 'https://example.com/logout', request_headers: 'new-header',
-auth: { enabled: true, url: 'https://example.com', username: 'admin', usernameField: 'username', passwordField: 'password' }}.to_json,
+auth: { enabled: true, url: 'https://example.com', username: 'admin', usernameField: 'username', passwordField: 'password' }, referenced_in_security_policies: @site_profile.referenced_in_security_policies}.to_json,
 on_demand_scans_path: Feature.enabled?(:dast_saved_scans, @project, default_enabled: :yaml) ? new_project_on_demand_scan_path(@project) : project_on_demand_scans_path(@project) } }

ee/changelogs/unreleased/321886-disable-policy-dast-profile.yml

+---
+title: Disable policy DAST scan profile modification
+merge_request: 55704
+author:
+type: changed

ee/spec/frontend/on_demand_scans/mocks/mock_data.js

@@ -21,6 +21,18 @@ export const scannerProfiles = [
   },
 ];
 
+export const policyScannerProfile = {
+  id: 'gid://gitlab/DastScannerProfile/3',
+  profileName: 'Scanner profile #3',
+  spiderTimeout: 20,
+  targetTimeout: 150,
+  scanType: 'ACTIVE',
+  useAjaxSpider: true,
+  showDebugMessages: true,
+  editPath: '/scanner_profile/edit/3',
+  referencedInSecurityPolicies: ['some_policy'],
+};
+
 export const siteProfiles = [
   {
     id: 'gid://gitlab/DastSiteProfile/1',
@@ -54,3 +66,17 @@ export const siteProfiles = [
     requestHeaders: 'auth: gitlab-dast',
   },
 ];
+
+export const policySiteProfile = {
+  id: 'gid://gitlab/DastSiteProfile/6',
+  profileName: 'Profile 6',
+  targetUrl: 'http://example-6.com',
+  normalizedTargetUrl: 'http://example-6.com',
+  editPath: '/6/edit',
+  validationStatus: 'NONE',
+  auth: {
+    enabled: false,
+  },
+  excludedUrls: 'https://bar.com/logout',
+  referencedInSecurityPolicies: ['some_policy'],
+};

ee/spec/frontend/security_configuration/dast_profiles/components/dast_profiles_list_spec.js

@@ -4,7 +4,7 @@ import { mount, shallowMount, createWrapper } from '@vue/test-utils';
 import { merge } from 'lodash';
 import DastProfilesList from 'ee/security_configuration/dast_profiles/components/dast_profiles_list.vue';
 import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
-import { siteProfiles as profiles } from '../mocks/mock_data';
+import { siteProfiles as profiles, policySiteProfile } from '../mocks/mock_data';
 
 const TEST_ERROR_MESSAGE = 'something went wrong';
 
@@ -58,8 +58,9 @@ describe('EE - DastProfilesList', () => {
   const getErrorMessage = () => withinComponent().queryByText(TEST_ERROR_MESSAGE);
   const getErrorDetails = () => withinComponent().queryByRole('list', { name: /error details/i });
   const getDeleteButtonWithin = (element) =>
-    createWrapper(within(element).queryByRole('button', { name: /delete/i }));
+    createWrapper(within(element).queryByTestId('dast-profile-delete-button'));
   const getModal = () => wrapper.find(GlModal);
+  const getDeleteTooltip = () => wrapper.find('[data-testid="dast-profile-delete-tooltip"');
 
   afterEach(() => {
     wrapper.destroy();
@@ -133,7 +134,7 @@ describe('EE - DastProfilesList', () => {
 
         expect(profileCell.innerText).toContain(profile.profileName);
         expect(targetUrlCell.innerText).toContain(profile.targetUrl);
-        expect(within(actionsCell).getByRole('button', { name: /delete/i })).not.toBe(null);
+        expect(within(actionsCell).queryByTestId('dast-profile-delete-button')).not.toBe(null);
 
         const editLink = within(actionsCell).getByRole('link', { name: /edit/i });
         expect(editLink).not.toBe(null);
@@ -194,10 +195,8 @@ describe('EE - DastProfilesList', () => {
         getDeleteButtonWithin(getTableRowForProfile(profile));
 
       it('shows a tooltip on the delete button', () => {
-        expect(getBinding(getCurrentProfileDeleteButton().element, 'gl-tooltip')).not.toBe(
-          undefined,
-        );
-        expect(getCurrentProfileDeleteButton().attributes().title).toBe('Delete profile');
+        expect(getBinding(getDeleteTooltip().element, 'gl-tooltip')).not.toBe(undefined);
+        expect(getDeleteTooltip().attributes('title')).toBe('Delete profile');
       });
 
       it('opens a modal with the correct title when a delete button is clicked', async () => {
@@ -246,4 +245,22 @@ describe('EE - DastProfilesList', () => {
       expect(within(getErrorDetails()).getByText(errorDetails[1])).not.toBe(null);
     });
   });
+
+  describe('profile referenced in a security policy', () => {
+    it('disables the delete button', () => {
+      createFullComponent({ propsData: { profiles: policySiteProfile } });
+      const disabledRow = getAllTableRows()[0];
+      const deleteButton = getDeleteButtonWithin(disabledRow);
+      expect(deleteButton.attributes('disabled')).toBe('disabled');
+      expect(deleteButton.attributes('aria-disabled')).toBe('true');
+    });
+
+    it('shows the correct tooltip text', () => {
+      createFullComponent({ propsData: { profiles: policySiteProfile } });
+      expect(getBinding(getDeleteTooltip().element, 'gl-tooltip')).not.toBe(undefined);
+      expect(getDeleteTooltip().attributes('title')).toBe(
+        'This profile is currently being used in a policy.',
+      );
+    });
+  });
 });

ee/spec/frontend/security_configuration/dast_profiles/mocks/mock_data.js

@@ -6,6 +6,7 @@ export const siteProfiles = [
     normalizedTargetUrl: 'http://example-1.com',
     editPath: '/1/edit',
     validationStatus: 'PENDING_VALIDATION',
+    referencedInSecurityPolicies: [],
   },
   {
     id: 'gid://gitlab/DastSiteProfile/2',
@@ -14,6 +15,7 @@ export const siteProfiles = [
     normalizedTargetUrl: 'http://example-2.com',
     editPath: '/2/edit',
     validationStatus: 'INPROGRESS_VALIDATION',
+    referencedInSecurityPolicies: [],
   },
   {
     id: 'gid://gitlab/DastSiteProfile/3',
@@ -22,6 +24,7 @@ export const siteProfiles = [
     normalizedTargetUrl: 'http://example-2.com',
     editPath: '/3/edit',
     validationStatus: 'PASSED_VALIDATION',
+    referencedInSecurityPolicies: [],
   },
   {
     id: 'gid://gitlab/DastSiteProfile/4',
@@ -30,6 +33,7 @@ export const siteProfiles = [
     normalizedTargetUrl: 'http://example-3.com',
     editPath: '/3/edit',
     validationStatus: 'FAILED_VALIDATION',
+    referencedInSecurityPolicies: [],
   },
   {
     id: 'gid://gitlab/DastSiteProfile/5',
@@ -38,6 +42,19 @@ export const siteProfiles = [
     normalizedTargetUrl: 'http://example-5.com',
     editPath: '/5/edit',
     validationStatus: 'NONE',
+    referencedInSecurityPolicies: [],
+  },
+];
+
+export const policySiteProfile = [
+  {
+    id: 'gid://gitlab/DastSiteProfile/6',
+    profileName: 'Profile 6',
+    targetUrl: 'http://example-6.com',
+    normalizedTargetUrl: 'http://example-6.com',
+    editPath: '/6/edit',
+    validationStatus: 'NONE',
+    referencedInSecurityPolicies: ['some_policy'],
   },
 ];
 

ee/spec/frontend/security_configuration/dast_scanner_profiles_form/components/dast_scanner_profiles_form_spec.js

-import { GlAlert, GlForm, GlModal } from '@gitlab/ui';
+import { GlForm, GlFormGroup, GlModal } from '@gitlab/ui';
 import { within } from '@testing-library/dom';
 import { mount, shallowMount } from '@vue/test-utils';
 import merge from 'lodash/merge';
@@ -6,7 +6,7 @@ import DastScannerProfileForm from 'ee/security_configuration/dast_scanner_profi
 import { SCAN_TYPE } from 'ee/security_configuration/dast_scanner_profiles/constants';
 import dastScannerProfileCreateMutation from 'ee/security_configuration/dast_scanner_profiles/graphql/dast_scanner_profile_create.mutation.graphql';
 import dastScannerProfileUpdateMutation from 'ee/security_configuration/dast_scanner_profiles/graphql/dast_scanner_profile_update.mutation.graphql';
-import { scannerProfiles } from 'ee_jest/on_demand_scans/mocks/mock_data';
+import { scannerProfiles, policyScannerProfile } from 'ee_jest/on_demand_scans/mocks/mock_data';
 import { TEST_HOST } from 'helpers/test_constants';
 import { redirectTo } from '~/lib/utils/url_utility';
 
@@ -40,6 +40,7 @@ describe('DAST Scanner Profile', () => {
   const withinComponent = () => within(wrapper.element);
   const findByTestId = (testId) => wrapper.find(`[data-testid="${testId}"`);
 
+  const findAllFormGroups = () => wrapper.findAllComponents(GlFormGroup);
   const findForm = () => wrapper.find(GlForm);
   const findProfileNameInput = () => findByTestId('profile-name-input');
   const findSpiderTimeoutInput = () => findByTestId('spider-timeout-input');
@@ -49,7 +50,8 @@ describe('DAST Scanner Profile', () => {
   const findScanType = () => findByTestId('scan-type-option');
 
   const findCancelModal = () => wrapper.find(GlModal);
-  const findAlert = () => wrapper.find(GlAlert);
+  const findAlert = () => findByTestId('dast-scanner-profile-alert');
+  const findPolicyProfileAlert = () => findByTestId('dast-policy-scanner-profile-alert');
   const submitForm = () => findForm().vm.$emit('submit', { preventDefault: () => {} });
 
   const componentFactory = (mountFn = shallowMount) => (options) => {
@@ -281,4 +283,50 @@ describe('DAST Scanner Profile', () => {
       });
     });
   });
+
+  describe('when profile does not come from a policy', () => {
+    beforeEach(() => {
+      createComponent({
+        propsData: {
+          profile: defaultProfile,
+        },
+      });
+    });
+
+    it('should enable all form groups', () => {
+      const formGroups = findAllFormGroups();
+      for (let i = 0; i < formGroups.length; i += 1) {
+        expect(formGroups.at(i).attributes('disabled')).toBe(undefined);
+      }
+    });
+
+    it('should show the policy profile alert', () => {
+      expect(findPolicyProfileAlert().exists()).toBe(false);
+    });
+  });
+
+  describe('when profile does comes from a policy', () => {
+    beforeEach(() => {
+      createComponent({
+        propsData: {
+          profile: policyScannerProfile,
+        },
+      });
+    });
+
+    it('should show the policy profile alert', () => {
+      expect(findPolicyProfileAlert().exists()).toBe(true);
+    });
+
+    it('should disable all form groups', () => {
+      const formGroups = findAllFormGroups();
+      for (let i = 0; i < formGroups.length; i += 1) {
+        expect(formGroups.at(i).attributes('disabled')).toBe('true');
+      }
+    });
+
+    it('should disable the save button', () => {
+      expect(findSubmitButton().props('disabled')).toBe(true);
+    });
+  });
 });

ee/spec/frontend/security_configuration/dast_site_profiles_form/components/dast_site_auth_section_spec.js

-import { GlFormCheckbox } from '@gitlab/ui';
-import { mount } from '@vue/test-utils';
+import { GlFormCheckbox, GlFormGroup } from '@gitlab/ui';
+import { mount, shallowMount } from '@vue/test-utils';
 import DastSiteAuthSection from 'ee/security_configuration/dast_site_profiles_form/components/dast_site_auth_section.vue';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
 
 describe('DastSiteAuthSection', () => {
   let wrapper;
 
-  const createComponent = ({ fields = {} } = {}) => {
+  const createComponent = ({ mountFn = mount, fields = {}, disabled = false } = {}) => {
     wrapper = extendedWrapper(
-      mount(DastSiteAuthSection, {
+      mountFn(DastSiteAuthSection, {
         propsData: {
+          disabled,
           value: { fields },
         },
       }),
@@ -24,6 +25,7 @@ describe('DastSiteAuthSection', () => {
     wrapper.destroy();
   });
 
+  const findAllFormGroups = () => wrapper.findAllComponents(GlFormGroup);
   const findByNameAttribute = (name) => wrapper.find(`[name="${name}"]`);
   const findAuthForm = () => wrapper.findByTestId('auth-form');
   const findAuthCheckbox = () => wrapper.find(GlFormCheckbox);
@@ -115,5 +117,25 @@ describe('DastSiteAuthSection', () => {
         expect(getLatestInputEventPayload().state).toBe(true);
       });
     });
+
+    describe('when profile does not come from a policy', () => {
+      it('should enable all form groups', () => {
+        createComponent({ mountFn: shallowMount, fields: { enabled: true } });
+        const formGroups = findAllFormGroups();
+        for (let i = 0; i < formGroups.length; i += 1) {
+          expect(formGroups.at(i).attributes('disabled')).toBe(undefined);
+        }
+      });
+    });
+
+    describe('when profile does comes from a policy', () => {
+      it('should disable all form groups', () => {
+        createComponent({ mountFn: shallowMount, disabled: true, fields: { enabled: true } });
+        const formGroups = findAllFormGroups();
+        for (let i = 0; i < formGroups.length; i += 1) {
+          expect(formGroups.at(i).attributes('disabled')).toBe('true');
+        }
+      });
+    });
   });
 });

ee/spec/frontend/security_configuration/dast_site_profiles_form/components/dast_site_profile_form_spec.js

-import { GlForm, GlModal } from '@gitlab/ui';
+import { GlForm, GlFormGroup, GlModal } from '@gitlab/ui';
 import { within } from '@testing-library/dom';
 import { createLocalVue, mount, shallowMount } from '@vue/test-utils';
 import merge from 'lodash/merge';
@@ -8,7 +8,7 @@ import DastSiteAuthSection from 'ee/security_configuration/dast_site_profiles_fo
 import DastSiteProfileForm from 'ee/security_configuration/dast_site_profiles_form/components/dast_site_profile_form.vue';
 import dastSiteProfileCreateMutation from 'ee/security_configuration/dast_site_profiles_form/graphql/dast_site_profile_create.mutation.graphql';
 import dastSiteProfileUpdateMutation from 'ee/security_configuration/dast_site_profiles_form/graphql/dast_site_profile_update.mutation.graphql';
-import { siteProfiles } from 'ee_jest/on_demand_scans/mocks/mock_data';
+import { siteProfiles, policySiteProfile } from 'ee_jest/on_demand_scans/mocks/mock_data';
 import * as responses from 'ee_jest/security_configuration/dast_site_profiles_form/mock_data/apollo_mock';
 import { TEST_HOST } from 'helpers/test_constants';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
@@ -46,6 +46,7 @@ describe('DastSiteProfileForm', () => {
   const withinComponent = () => within(wrapper.element);
 
   const findForm = () => wrapper.findComponent(GlForm);
+  const findAllFormGroups = () => wrapper.findAllComponents(GlFormGroup);
   const findAuthSection = () => wrapper.findComponent(DastSiteAuthSection);
   const findCancelModal = () => wrapper.findComponent(GlModal);
   const findByNameAttribute = (name) => wrapper.find(`[name="${name}"]`);
@@ -57,6 +58,7 @@ describe('DastSiteProfileForm', () => {
   const findSubmitButton = () => wrapper.findByTestId('dast-site-profile-form-submit-button');
   const findCancelButton = () => wrapper.findByTestId('dast-site-profile-form-cancel-button');
   const findAlert = () => wrapper.findByTestId('dast-site-profile-form-alert');
+  const findPolicyAlert = () => wrapper.findByTestId('dast-policy-site-profile-form-alert');
   const submitForm = () => findForm().vm.$emit('submit', { preventDefault: () => {} });
 
   const setFieldValue = async (field, value) => {
@@ -333,4 +335,50 @@ describe('DastSiteProfileForm', () => {
       expect(findRequestHeadersInput().exists()).toBe(false);
     });
   });
+
+  describe('when profile does not come from a policy', () => {
+    beforeEach(() => {
+      createComponent({
+        propsData: {
+          siteProfile: siteProfileOne,
+        },
+      });
+    });
+
+    it('should enable all form groups', () => {
+      const formGroups = findAllFormGroups();
+      for (let i = 0; i < formGroups.length; i += 1) {
+        expect(formGroups.at(i).attributes('disabled')).toBe(undefined);
+      }
+    });
+
+    it('should show the policy profile alert', () => {
+      expect(findPolicyAlert().exists()).toBe(false);
+    });
+  });
+
+  describe('when profile does comes from a policy', () => {
+    beforeEach(() => {
+      createComponent({
+        propsData: {
+          siteProfile: policySiteProfile,
+        },
+      });
+    });
+
+    it('should show the policy profile alert', () => {
+      expect(findPolicyAlert().exists()).toBe(true);
+    });
+
+    it('should disable all form groups', () => {
+      const formGroups = findAllFormGroups();
+      for (let i = 0; i < formGroups.length; i += 1) {
+        expect(formGroups.at(i).attributes('disabled')).toBe('true');
+      }
+    });
+
+    it('should disable the save button', () => {
+      expect(findSubmitButton().props('disabled')).toBe(true);
+    });
+  });
 });

locale/gitlab.pot

@@ -9643,7 +9643,7 @@ msgstr ""
 msgid "DastProfiles|This scanner profile is currently being used by a policy. To make edits you must remove it from the active policy."
 msgstr ""
 
-msgid "DastProfiles|This site profile is currently being used by a policy. To make edits you must it from the active policy."
+msgid "DastProfiles|This site profile is currently being used by a policy. To make edits you must remove it from the active policy."
 msgstr ""
 
 msgid "DastProfiles|Turn on AJAX spider"