DAST site profiles: Add header validation

This commit adds the http header validation method to the form
that let's a user create or edit a DAST on-demand site profile.

config/feature_flags/development/security_on_demand_scans_http_header_validation.yml

+---
+name: security_on_demand_scans_http_header_validation
+introduced_by_url: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/42812
+rollout_issue_url: https://gitlab.com/gitlab-org/gitlab/-/issues/276403
+milestone: '13.6'
+type: development
+group: group::dynamic analysis
+default_enabled: false

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

@@ -11,11 +11,16 @@ import {
   GlInputGroupText,
   GlLoadingIcon,
 } from '@gitlab/ui';
+import { omit } from 'lodash';
 import * as Sentry from '~/sentry/wrapper';
+import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
 import download from '~/lib/utils/downloader';
+import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import { cleanLeadingSeparator, joinPaths, stripPathTail } from '~/lib/utils/url_utility';
 import { fetchPolicies } from '~/lib/graphql';
 import {
+  DAST_SITE_VALIDATION_HTTP_HEADER_KEY,
+  DAST_SITE_VALIDATION_METHOD_HTTP_HEADER,
   DAST_SITE_VALIDATION_METHOD_TEXT_FILE,
   DAST_SITE_VALIDATION_METHODS,
   DAST_SITE_VALIDATION_STATUS,
@@ -27,6 +32,7 @@ import dastSiteValidationQuery from '../graphql/dast_site_validation.query.graph
 export default {
   name: 'DastSiteValidation',
   components: {
+    ClipboardButton,
     GlAlert,
     GlButton,
     GlCard,
@@ -38,6 +44,7 @@ export default {
     GlInputGroupText,
     GlLoadingIcon,
   },
+  mixins: [glFeatureFlagsMixin()],
   apollo: {
     dastSiteValidation: {
       query: dastSiteValidationQuery,
@@ -103,6 +110,16 @@ export default {
     };
   },
   computed: {
+    validationMethodOptions() {
+      const isHttpHeaderValidationEnabled = this.glFeatures
+        .securityOnDemandScansHttpHeaderValidation;
+
+      const enabledValidationMethods = omit(DAST_SITE_VALIDATION_METHODS, [
+        !isHttpHeaderValidationEnabled ? DAST_SITE_VALIDATION_METHOD_HTTP_HEADER : '',
+      ]);
+
+      return Object.values(enabledValidationMethods);
+    },
     urlObject() {
       try {
         return new URL(this.targetUrl);
@@ -119,12 +136,18 @@ export default {
     isTextFileValidation() {
       return this.validationMethod === DAST_SITE_VALIDATION_METHOD_TEXT_FILE;
     },
+    isHttpHeaderValidation() {
+      return this.validationMethod === DAST_SITE_VALIDATION_METHOD_HTTP_HEADER;
+    },
     textFileName() {
       return `GitLab-DAST-Site-Validation-${this.token}.txt`;
     },
     locationStepLabel() {
       return DAST_SITE_VALIDATION_METHODS[this.validationMethod].i18n.locationStepLabel;
     },
+    httpHeader() {
+      return `${DAST_SITE_VALIDATION_HTTP_HEADER_KEY}: uuid-code-${this.token}`;
+    },
   },
   watch: {
     targetUrl() {
@@ -132,13 +155,22 @@ export default {
     },
   },
   created() {
-    this.unsubscribe = this.$watch(() => this.token, this.updateValidationPath, {
-      immediate: true,
-    });
+    this.unsubscribe = this.$watch(
+      () => [this.token, this.validationMethod],
+      this.updateValidationPath,
+      {
+        immediate: true,
+      },
+    );
   },
   methods: {
     updateValidationPath() {
-      this.validationPath = joinPaths(stripPathTail(this.path), this.textFileName);
+      this.validationPath = this.isTextFileValidation
+        ? this.getTextFileValidationPath()
+        : this.path;
+    },
+    getTextFileValidationPath() {
+      return joinPaths(stripPathTail(this.path), this.textFileName);
     },
     onValidationPathInput() {
       this.unsubscribe();
@@ -189,7 +221,6 @@ export default {
       this.hasValidationError = true;
     },
   },
-  validationMethodOptions: Object.values(DAST_SITE_VALIDATION_METHODS),
 };
 </script>
 
@@ -199,7 +230,7 @@ export default {
       {{ s__('DastProfiles|Site is not validated yet, please follow the steps.') }}
     </gl-alert>
     <gl-form-group :label="s__('DastProfiles|Step 1 - Choose site validation method')">
-      <gl-form-radio-group v-model="validationMethod" :options="$options.validationMethodOptions" />
+      <gl-form-radio-group v-model="validationMethod" :options="validationMethodOptions" />
     </gl-form-group>
     <gl-form-group
       v-if="isTextFileValidation"
@@ -217,6 +248,16 @@ export default {
         {{ textFileName }}
       </gl-button>
     </gl-form-group>
+    <gl-form-group
+      v-else-if="isHttpHeaderValidation"
+      :label="s__('DastProfiles|Step 2 - Add following HTTP header to your site')"
+    >
+      <code class="gl-p-3 gl-bg-black gl-text-white">{{ httpHeader }}</code>
+      <clipboard-button
+        :text="httpHeader"
+        :title="s__('DastProfiles|Copy HTTP header to clipboard')"
+      />
+    </gl-form-group>
     <gl-form-group :label="locationStepLabel" class="mw-460">
       <gl-form-input-group>
         <template #prepend>
@@ -255,7 +296,7 @@ export default {
         <gl-icon name="status_failed" />
         {{
           s__(
-            'DastProfiles|Validation failed, please make sure that you follow the steps above with the choosen method.',
+            'DastProfiles|Validation failed, please make sure that you follow the steps above with the chosen method.',
           )
         }}
       </template>

ee/app/assets/javascripts/security_configuration/dast_site_profiles_form/constants.js

 import { s__ } from '~/locale';
 
 export const DAST_SITE_VALIDATION_METHOD_TEXT_FILE = 'TEXT_FILE';
+export const DAST_SITE_VALIDATION_METHOD_HTTP_HEADER = 'HTTP_HEADER';
+
 export const DAST_SITE_VALIDATION_METHODS = {
   [DAST_SITE_VALIDATION_METHOD_TEXT_FILE]: {
     value: DAST_SITE_VALIDATION_METHOD_TEXT_FILE,
@@ -9,6 +11,13 @@ export const DAST_SITE_VALIDATION_METHODS = {
       locationStepLabel: s__('DastProfiles|Step 3 - Confirm text file location and validate'),
     },
   },
+  [DAST_SITE_VALIDATION_METHOD_HTTP_HEADER]: {
+    value: DAST_SITE_VALIDATION_METHOD_HTTP_HEADER,
+    text: s__('DastProfiles|Header validation'),
+    i18n: {
+      locationStepLabel: s__('DastProfiles|Step 3 - Confirm header location and validate'),
+    },
+  },
 };
 
 export const DAST_SITE_VALIDATION_STATUS = {
@@ -19,3 +28,4 @@ export const DAST_SITE_VALIDATION_STATUS = {
 };
 
 export const DAST_SITE_VALIDATION_POLL_INTERVAL = 1000;
+export const DAST_SITE_VALIDATION_HTTP_HEADER_KEY = 'Gitlab-On-Demand-DAST';

ee/app/controllers/projects/security/dast_site_profiles_controller.rb

@@ -6,6 +6,7 @@ module Projects
       before_action do
         authorize_read_on_demand_scans!
         push_frontend_feature_flag(:security_on_demand_scans_site_validation, @project)
+        push_frontend_feature_flag(:security_on_demand_scans_http_header_validation, @project)
       end
 
       feature_category :dynamic_application_security_testing

ee/spec/frontend/security_configuration/dast_site_profiles_form/mock_data/apollo_mock.js

@@ -14,7 +14,7 @@ export const dastSiteValidation = (status = DAST_SITE_VALIDATION_STATUS.PENDING)
 
 export const dastSiteValidationCreate = (errors = []) => ({
   data: {
-    dastSiteValidationCreate: { status: DAST_SITE_VALIDATION_STATUS.PASSED, id: '1', errors },
+    dastSiteValidationCreate: { status: DAST_SITE_VALIDATION_STATUS.PENDING, id: '1', errors },
   },
 });
 

locale/gitlab.pot

@@ -8319,6 +8319,9 @@ msgstr ""
 msgid "DastProfiles|Authentication URL"
 msgstr ""
 
+msgid "DastProfiles|Copy HTTP header to clipboard"
+msgstr ""
+
 msgid "DastProfiles|Could not create site validation token. Please refresh the page, or try again later."
 msgstr ""
 
@@ -8385,6 +8388,9 @@ msgstr ""
 msgid "DastProfiles|Error Details"
 msgstr ""
 
+msgid "DastProfiles|Header validation"
+msgstr ""
+
 msgid "DastProfiles|Hide debug messages"
 msgstr ""
 
@@ -8469,9 +8475,15 @@ msgstr ""
 msgid "DastProfiles|Step 1 - Choose site validation method"
 msgstr ""
 
+msgid "DastProfiles|Step 2 - Add following HTTP header to your site"
+msgstr ""
+
 msgid "DastProfiles|Step 2 - Add following text to the target site"
 msgstr ""
 
+msgid "DastProfiles|Step 3 - Confirm header location and validate"
+msgstr ""
+
 msgid "DastProfiles|Step 3 - Confirm text file location and validate"
 msgstr ""
 
@@ -8508,7 +8520,7 @@ msgstr ""
 msgid "DastProfiles|Validating..."
 msgstr ""
 
-msgid "DastProfiles|Validation failed, please make sure that you follow the steps above with the choosen method."
+msgid "DastProfiles|Validation failed, please make sure that you follow the steps above with the chosen method."
 msgstr ""
 
 msgid "DastProfiles|Validation failed. Please try again."