Merge branch '340345-update-profile-conflict-alert' into 'master'

DAST configuration - update unvalidated site profile alert banner

See merge request gitlab-org/gitlab!69900

ee/app/assets/javascripts/on_demand_scans/components/on_demand_scans_form.vue

@@ -37,6 +37,7 @@ import {
   SCANNER_PROFILES_QUERY,
   SITE_PROFILES_QUERY,
 } from '../settings';
+import ProfileConflictAlert from './profile_selector/profile_conflict_alert.vue';
 import ScannerProfileSelector from './profile_selector/scanner_profile_selector.vue';
 import SiteProfileSelector from './profile_selector/site_profile_selector.vue';
 import ScanSchedule from './scan_schedule.vue';
@@ -69,6 +70,7 @@ export default {
   saveScanBtnId: 'scan-save-button',
   components: {
     RefSelector,
+    ProfileConflictAlert,
     ScannerProfileSelector,
     SiteProfileSelector,
     ScanSchedule,
@@ -102,7 +104,7 @@ export default {
       SITE_PROFILES_QUERY,
     ),
   },
-  inject: ['projectPath', 'helpPagePath', 'dastSiteValidationDocsPath', 'profilesLibraryPath'],
+  inject: ['projectPath', 'helpPagePath', 'profilesLibraryPath'],
   props: {
     defaultBranch: {
       type: String,
@@ -454,25 +456,10 @@ export default {
 
       <scan-schedule v-if="glFeatures.dastOnDemandScansScheduler" v-model="profileSchedule" />
 
-      <gl-alert
+      <profile-conflict-alert
         v-if="hasProfilesConflict"
-        :title="s__('OnDemandScans|You cannot run an active scan against an unvalidated site.')"
-        :dismissible="false"
-        variant="danger"
         data-testid="on-demand-scans-profiles-conflict-alert"
-      >
-        <gl-sprintf
-          :message="
-            s__(
-              'OnDemandScans|You can either choose a passive scan or validate the target site in your chosen site profile. %{docsLinkStart}Learn more about site validation.%{docsLinkEnd}',
-            )
-          "
-        >
-          <template #docsLink="{ content }">
-            <gl-link :href="dastSiteValidationDocsPath">{{ content }}</gl-link>
-          </template>
-        </gl-sprintf>
-      </gl-alert>
+      />
 
       <div class="gl-mt-6 gl-pt-6">
         <gl-button

ee/app/assets/javascripts/on_demand_scans/components/profile_selector/dast_profiles_selector.vue

 <script>
-import { GlCard, GlSkeletonLoader, GlAlert, GlSprintf, GlLink } from '@gitlab/ui';
+import { GlCard, GlSkeletonLoader } from '@gitlab/ui';
 import * as Sentry from '@sentry/browser';
 import { SCAN_TYPE } from 'ee/security_configuration/dast_profiles/dast_scanner_profiles/constants';
 import { DAST_SITE_VALIDATION_STATUS } from 'ee/security_configuration/dast_site_validation/constants';
 import { TYPE_SCANNER_PROFILE, TYPE_SITE_PROFILE } from '~/graphql_shared/constants';
 import { convertToGraphQLId } from '~/graphql_shared/utils';
-import { helpPagePath } from '~/helpers/help_page_helper';
 import { queryToObject } from '~/lib/utils/url_utility';
 import { ERROR_MESSAGES, SCANNER_PROFILES_QUERY, SITE_PROFILES_QUERY } from '../../settings';
+import ProfileConflictAlert from './profile_conflict_alert.vue';
 import ScannerProfileSelector from './scanner_profile_selector.vue';
 import SiteProfileSelector from './site_profile_selector.vue';
 
@@ -36,11 +36,9 @@ export default {
   components: {
     GlCard,
     GlSkeletonLoader,
-    GlAlert,
-    GlSprintf,
+    ProfileConflictAlert,
     ScannerProfileSelector,
     SiteProfileSelector,
-    GlLink,
   },
   inject: ['fullPath'],
   apollo: {
@@ -63,9 +61,6 @@ export default {
       selectedSiteProfileId: null,
       errorType: null,
       errors: [],
-      dastSiteValidationDocsPath: helpPagePath('user/application_security/dast/index', {
-        anchor: 'site-profile-validation',
-      }),
     };
   },
   computed: {
@@ -158,26 +153,11 @@ export default {
         :has-conflict="hasProfilesConflict"
       />
 
-      <gl-alert
+      <profile-conflict-alert
         v-if="hasProfilesConflict"
-        :title="s__('DastProfiles|You cannot run an active scan against an unvalidated site.')"
         class="gl-mb-5"
-        :dismissible="false"
-        variant="danger"
         data-testid="dast-profiles-conflict-alert"
-      >
-        <gl-sprintf
-          :message="
-            s__(
-              'DastProfiles|You can either choose a passive scan or validate the target site in your chosen site profile. %{docsLinkStart}Learn more about site validation.%{docsLinkEnd}',
-            )
-          "
-        >
-          <template #docsLink="{ content }">
-            <gl-link :href="dastSiteValidationDocsPath">{{ content }}</gl-link>
-          </template>
-        </gl-sprintf>
-      </gl-alert>
+      />
     </template>
   </div>
 </template>

ee/app/assets/javascripts/on_demand_scans/components/profile_selector/profile_conflict_alert.vue

+<script>
+import { GlAlert, GlSprintf, GlLink } from '@gitlab/ui';
+import { helpPagePath } from '~/helpers/help_page_helper';
+import { s__ } from '~/locale';
+
+export default {
+  components: {
+    GlAlert,
+    GlSprintf,
+    GlLink,
+  },
+  inject: ['siteProfilesLibraryPath'],
+  dastSiteValidationDocsPath: helpPagePath('user/application_security/dast/index', {
+    anchor: 'site-profile-validation',
+  }),
+  i18n: {
+    title: s__('DastProfiles|You cannot run an active scan against an unvalidated site.'),
+    primaryButtonText: s__('DastProfiles|Manage site profiles'),
+    message: s__(
+      'DastProfiles|You can either choose a passive scan or validate the target site from the site profile management page. %{docsLinkStart}Learn more about site validation.%{docsLinkEnd}',
+    ),
+  },
+};
+</script>
+
+<template>
+  <gl-alert
+    :title="$options.i18n.title"
+    :dismissible="false"
+    :primary-button-text="$options.i18n.primaryButtonText"
+    :primary-button-link="siteProfilesLibraryPath"
+    variant="danger"
+  >
+    <gl-sprintf :message="$options.i18n.message">
+      <template #docsLink="{ content }">
+        <gl-link :href="$options.dastSiteValidationDocsPath">{{ content }}</gl-link>
+      </template>
+    </gl-sprintf>
+  </gl-alert>
+</template>

ee/app/assets/javascripts/on_demand_scans/index.js

@@ -9,7 +9,6 @@ export default () => {
   }
 
   const {
-    dastSiteValidationDocsPath,
     projectPath,
     defaultBranch,
     profilesLibraryPath,
@@ -33,7 +32,6 @@ export default () => {
       siteProfilesLibraryPath,
       newScannerProfilePath,
       newSiteProfilePath,
-      dastSiteValidationDocsPath,
       timezones,
     },
     render(h) {

ee/app/helpers/projects/on_demand_scans_helper.rb

@@ -4,7 +4,6 @@ module Projects::OnDemandScansHelper
   def on_demand_scans_data(project)
     {
       'help-page-path' => help_page_path('user/application_security/dast/index', anchor: 'on-demand-scans'),
-      'dast-site-validation-docs-path' => help_page_path('user/application_security/dast/index', anchor: 'dast-site-validation'),
       'empty-state-svg-path' => image_path('illustrations/empty-state/ondemand-scan-empty.svg'),
       'default-branch' => project.default_branch,
       'project-path' => project.path_with_namespace,

ee/spec/frontend/on_demand_scans/components/profile_selector/__snapshots__/profile_conflict_alert_spec.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ProfileConflictAlert renders properly 1`] = `
+<gl-alert-stub
+  dismisslabel="Dismiss"
+  primarybuttonlink="/dast_scans#site-profiles"
+  primarybuttontext="Manage site profiles"
+  secondarybuttonlink=""
+  secondarybuttontext=""
+  title="You cannot run an active scan against an unvalidated site."
+  variant="danger"
+>
+  You can either choose a passive scan or validate the target site from the site profile management page. 
+  <gl-link-stub
+    href="/help/user/application_security/dast/index#site-profile-validation"
+  >
+    Learn more about site validation.
+  </gl-link-stub>
+</gl-alert-stub>
+`;

ee/spec/frontend/on_demand_scans/components/profile_selector/profile_conflict_alert_spec.js

+import { GlSprintf } from '@gitlab/ui';
+import { shallowMount } from '@vue/test-utils';
+import ProfileConflictAlert from 'ee/on_demand_scans/components/profile_selector/profile_conflict_alert.vue';
+
+describe('ProfileConflictAlert', () => {
+  let wrapper;
+
+  const createComponent = () => {
+    wrapper = shallowMount(ProfileConflictAlert, {
+      stubs: {
+        GlSprintf,
+      },
+      provide: {
+        siteProfilesLibraryPath: '/dast_scans#site-profiles',
+      },
+    });
+  };
+
+  it('renders properly', () => {
+    createComponent();
+    expect(wrapper.element).toMatchSnapshot();
+  });
+});

ee/spec/helpers/projects/on_demand_scans_helper_spec.rb

@@ -9,7 +9,6 @@ RSpec.describe Projects::OnDemandScansHelper do
     it 'returns proper data' do
       expect(helper.on_demand_scans_data(project)).to match(
         'help-page-path' => help_page_path('user/application_security/dast/index', anchor: 'on-demand-scans'),
-        'dast-site-validation-docs-path' => help_page_path('user/application_security/dast/index', anchor: 'dast-site-validation'),
         'empty-state-svg-path' => match_asset_path('/assets/illustrations/empty-state/ondemand-scan-empty.svg'),
         'default-branch' => project.default_branch,
         'project-path' => project.path_with_namespace,

locale/gitlab.pot

@@ -10345,6 +10345,9 @@ msgstr ""
 msgid "DastProfiles|Manage profiles"
 msgstr ""
 
+msgid "DastProfiles|Manage site profiles"
+msgstr ""
+
 msgid "DastProfiles|Minimum = 0 (no timeout enabled), Maximum = 2880 minutes"
 msgstr ""
 
@@ -10489,7 +10492,7 @@ msgstr ""
 msgid "DastProfiles|Website"
 msgstr ""
 
-msgid "DastProfiles|You can either choose a passive scan or validate the target site in your chosen site profile. %{docsLinkStart}Learn more about site validation.%{docsLinkEnd}"
+msgid "DastProfiles|You can either choose a passive scan or validate the target site from the site profile management page. %{docsLinkStart}Learn more about site validation.%{docsLinkEnd}"
 msgstr ""
 
 msgid "DastProfiles|You cannot run an active scan against an unvalidated site."
@@ -23472,12 +23475,6 @@ msgstr ""
 msgid "OnDemandScans|Use existing site profile"
 msgstr ""
 
-msgid "OnDemandScans|You can either choose a passive scan or validate the target site in your chosen site profile. %{docsLinkStart}Learn more about site validation.%{docsLinkEnd}"
-msgstr ""
-
-msgid "OnDemandScans|You cannot run an active scan against an unvalidated site."
-msgstr ""
-
 msgid "OnDemandScans|You must create a repository within your project to run an on-demand scan."
 msgstr ""