Leverage fixtures to mock DAST scanner profiles

ee/spec/frontend/fixtures/dast_profiles.rb

@@ -161,6 +161,46 @@ RSpec.describe 'DAST profiles (GraphQL fixtures)' do
       end
     end
 
+    describe 'dast_scanner_profiles' do
+      path = 'security_configuration/dast_profiles/graphql/dast_scanner_profiles.query.graphql'
+
+      # DAST scanner profiles
+      let_it_be(:dast_scanner_profiles) do
+        [
+          create(
+            :dast_scanner_profile,
+            name: "Active scanner",
+            spider_timeout: 5,
+            target_timeout: 10,
+            scan_type: 'active',
+            use_ajax_spider: true,
+            show_debug_messages: true,
+            project: project
+          ),
+          create(
+            :dast_scanner_profile,
+            name: "Passive scanner",
+            spider_timeout: 5,
+            target_timeout: 10,
+            scan_type: 'passive',
+            project: project
+          )
+        ]
+      end
+
+      it "graphql/#{path}.basic.json" do
+        query = get_graphql_query_as_string(path, ee: true)
+
+        post_graphql(query, current_user: current_user, variables: {
+          fullPath: project.full_path,
+          first: 20
+        })
+
+        expect_graphql_errors_to_be_empty
+        expect(graphql_data_at(:project, :scannerProfiles, :edges)).to have_attributes(size: 2)
+      end
+    end
+
     describe 'scheduled_dast_profiles' do
       path = 'on_demand_scans/graphql/scheduled_dast_profiles.query.graphql'
 

ee/spec/frontend/on_demand_scans_form/components/on_demand_scans_form_spec.js

@@ -21,11 +21,11 @@ import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
 import { getIdFromGraphQLId } from '~/graphql_shared/utils';
 import {
   siteProfiles,
+  scannerProfiles,
   nonValidatedSiteProfile,
   validatedSiteProfile,
 } from 'ee_jest/security_configuration/dast_profiles/mocks/mock_data';
 import * as responses from '../mocks/apollo_mocks';
-import { scannerProfiles } from '../mocks/mock_data';
 
 const dastSiteValidationDocsPath = '/application_security/dast/index#dast-site-validation';
 const projectPath = 'group/project';
@@ -95,6 +95,7 @@ describe('OnDemandScansForm', () => {
     findBranchInput().vm.$emit('input', selectedBranch);
     findScannerProfilesSelector().vm.$emit('input', passiveScannerProfile.id);
     findSiteProfilesSelector().vm.$emit('input', nonValidatedSiteProfile.id);
+
     return wrapper.vm.$nextTick();
   };
   const setupSuccess = ({ edit = false } = {}) => {
@@ -305,7 +306,7 @@ describe('OnDemandScansForm', () => {
           LOCAL_STORAGE_KEY,
           JSON.stringify({
             name: 'My daily scan',
-            selectedScannerProfileId: 'gid://gitlab/DastScannerProfile/1',
+            selectedScannerProfileId: passiveScannerProfile.id,
             selectedSiteProfileId: nonValidatedSiteProfile.id,
             selectedBranch,
           }),
@@ -618,7 +619,7 @@ describe('OnDemandScansForm', () => {
     const [scannerProfile] = scannerProfiles;
 
     it('scanner profile', () => {
-      setWindowLocation('?scanner_profile_id=1');
+      setWindowLocation(`?scanner_profile_id=${getIdFromGraphQLId(scannerProfile.id)}`);
       createShallowComponent();
 
       expect(wrapper.find(ScannerProfileSelector).attributes('value')).toBe(scannerProfile.id);
@@ -633,7 +634,9 @@ describe('OnDemandScansForm', () => {
 
     it('both scanner & site profile', () => {
       setWindowLocation(
-        `?site_profile_id=${getIdFromGraphQLId(siteProfile.id)}&scanner_profile_id=1`,
+        `?site_profile_id=${getIdFromGraphQLId(
+          siteProfile.id,
+        )}&scanner_profile_id=${getIdFromGraphQLId(scannerProfile.id)}`,
       );
       createShallowComponent();
 

ee/spec/frontend/on_demand_scans_form/components/profile_selector/__snapshots__/scanner_profile_selector_spec.js.snap

 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`OnDemandScansScannerProfileSelector renders properly with profiles 1`] = `
-<div
-  class="gl-card"
-  data-foo="bar"
-  value="gid://gitlab/DastScannerProfile/1"
->
-  <div
-    class="gl-card-header"
-  >
-    <div
-      class="row"
-    >
-      <div
-        class="col-7 gl-display-flex gl-align-items-center"
-      >
-        <h3
-          class="gl-font-lg gl-my-0"
-        >
-          Scanner profile
-        </h3>
-      </div>
-    </div>
-  </div>
-   
-  <div
-    class="gl-card-body"
-  >
-     
-    <fieldset
-      aria-describedby=""
-      class="form-group gl-form-group"
-    >
-      <legend
-        class="bv-no-focus-ring col-form-label pt-0 col-form-label"
-        tabindex="-1"
-      >
-        Use existing scanner profile
-      </legend>
-      <div
-        class="bv-no-focus-ring"
-        role="group"
-        tabindex="-1"
-      >
-         
-        <div
-          class="dropdown b-dropdown gl-new-dropdown mw-460 btn-group"
-          data-testid="profiles-dropdown"
-        >
-          <!---->
-          <button
-            aria-expanded="false"
-            aria-haspopup="true"
-            class="btn dropdown-toggle btn-default btn-md gl-button gl-dropdown-toggle"
-            type="button"
-          >
-            <!---->
-             
-            <!---->
-             
-            <span
-              class="gl-new-dropdown-button-text"
-            >
-              Scanner profile #1
-            </span>
-             
-            <svg
-              aria-hidden="true"
-              class="gl-button-icon dropdown-chevron gl-icon s16"
-              data-testid="chevron-down-icon"
-              role="img"
-            >
-              <use
-                href="#chevron-down"
-              />
-            </svg>
-          </button>
-          <ul
-            class="dropdown-menu"
-            role="menu"
-            tabindex="-1"
-          >
-            <div
-              class="gl-new-dropdown-inner"
-            >
-              <div
-                class="gl-new-dropdown-header gl-border-b-0!"
-              >
-                <!---->
-                 
-                <div
-                  class="gl-search-box-by-type"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="gl-search-box-by-type-search-icon gl-icon s16"
-                    data-testid="search-icon"
-                    role="img"
-                  >
-                    <use
-                      href="#search"
-                    />
-                  </svg>
-                   
-                  <input
-                    aria-label="Search"
-                    class="gl-form-input gl-search-box-by-type-input form-control"
-                    placeholder="Search"
-                    type="search"
-                  />
-                   
-                  <div
-                    class="gl-search-box-by-type-right-icons"
-                  >
-                    <!---->
-                     
-                    <!---->
-                  </div>
-                </div>
-              </div>
-               
-              <!---->
-               
-              <div
-                class="gl-new-dropdown-contents"
-              >
-                <!---->
-                  
-                <li
-                  class="gl-new-dropdown-item"
-                  role="presentation"
-                >
-                  <button
-                    class="dropdown-item"
-                    role="menuitem"
-                    type="button"
-                  >
-                    <svg
-                      aria-hidden="true"
-                      class="gl-icon s16 gl-new-dropdown-item-check-icon gl-mt-3 gl-align-self-start"
-                      data-testid="dropdown-item-checkbox"
-                      role="img"
-                    >
-                      <use
-                        href="#mobile-issue-close"
-                      />
-                    </svg>
-                     
-                    <!---->
-                     
-                    <!---->
-                     
-                    <div
-                      class="gl-new-dropdown-item-text-wrapper"
-                    >
-                      <p
-                        class="gl-new-dropdown-item-text-primary"
-                      >
-                        
-        Scanner profile #1
-      
-                      </p>
-                       
-                      <!---->
-                    </div>
-                     
-                    <!---->
-                  </button>
-                </li>
-                <li
-                  class="gl-new-dropdown-item"
-                  role="presentation"
-                >
-                  <button
-                    class="dropdown-item"
-                    role="menuitem"
-                    type="button"
-                  >
-                    <svg
-                      aria-hidden="true"
-                      class="gl-icon s16 gl-new-dropdown-item-check-icon gl-visibility-hidden gl-mt-3 gl-align-self-start"
-                      data-testid="dropdown-item-checkbox"
-                      role="img"
-                    >
-                      <use
-                        href="#mobile-issue-close"
-                      />
-                    </svg>
-                     
-                    <!---->
-                     
-                    <!---->
-                     
-                    <div
-                      class="gl-new-dropdown-item-text-wrapper"
-                    >
-                      <p
-                        class="gl-new-dropdown-item-text-primary"
-                      >
-                        
-        Scanner profile #2
-      
-                      </p>
-                       
-                      <!---->
-                    </div>
-                     
-                    <!---->
-                  </button>
-                </li>
-                 
-                <div
-                  class="gl-p-3 gl-text-center"
-                  style="display: none;"
-                >
-                  
-        No matching results...
-      
-                </div>
-              </div>
-               
-              <div
-                class="gl-new-dropdown-footer"
-              >
-                <li
-                  class="gl-new-dropdown-item"
-                  role="presentation"
-                >
-                  <a
-                    class="dropdown-item"
-                    data-testid="create-profile-option"
-                    href="/test/new/scanner/profile/path"
-                    role="menuitem"
-                    target="_self"
-                  >
-                    <!---->
-                     
-                    <!---->
-                     
-                    <!---->
-                     
-                    <div
-                      class="gl-new-dropdown-item-text-wrapper"
-                    >
-                      <p
-                        class="gl-new-dropdown-item-text-primary"
-                      >
-                        Create new scanner profile
-                      </p>
-                       
-                      <!---->
-                    </div>
-                     
-                    <!---->
-                  </a>
-                </li>
-                 
-                <li
-                  class="gl-new-dropdown-item"
-                  role="presentation"
-                >
-                  <a
-                    class="dropdown-item"
-                    data-testid="manage-profiles-option"
-                    href="/test/scanner/profiles/library/path"
-                    role="menuitem"
-                    target="_self"
-                  >
-                    <!---->
-                     
-                    <!---->
-                     
-                    <!---->
-                     
-                    <div
-                      class="gl-new-dropdown-item-text-wrapper"
-                    >
-                      <p
-                        class="gl-new-dropdown-item-text-primary"
-                      >
-                        Manage scanner profiles
-                      </p>
-                       
-                      <!---->
-                    </div>
-                     
-                    <!---->
-                  </a>
-                </li>
-              </div>
-            </div>
-          </ul>
-        </div>
-         
-        <div
-          class="gl-mt-6 gl-pt-6 gl-border-t-solid gl-border-gray-100 gl-border-t-1"
-          data-testid="selected-profile-summary"
-        >
-          <a
-            aria-label="Edit profile"
-            class="btn gl-absolute gl-right-7 gl-z-index-1 btn-default btn-md gl-button btn-icon"
-            href="/scanner_profile/edit/1"
-            title="Edit profile"
-          >
-            <!---->
-             
-            <svg
-              aria-hidden="true"
-              class="gl-button-icon gl-icon s16"
-              data-testid="pencil-icon"
-              role="img"
-            >
-              <use
-                href="#pencil"
-              />
-            </svg>
-              
-            <!---->
-          </a>
-           
-        </div>
-        <!---->
-        <!---->
-        <!---->
-      </div>
-    </fieldset>
-  </div>
-   
-  <!---->
-</div>
-`;
-
 exports[`OnDemandScansScannerProfileSelector renders properly without profiles 1`] = `
 <div
   class="gl-card"

ee/spec/frontend/on_demand_scans_form/components/profile_selector/dast_profiles_selector_spec.js

@@ -14,11 +14,11 @@ import waitForPromises from 'helpers/wait_for_promises';
 import { getIdFromGraphQLId } from '~/graphql_shared/utils';
 import {
   siteProfiles,
+  scannerProfiles,
   nonValidatedSiteProfile,
   validatedSiteProfile,
 } from 'ee_jest/security_configuration/dast_profiles/mocks/mock_data';
 import * as responses from '../../mocks/apollo_mocks';
-import { scannerProfiles } from '../../mocks/mock_data';
 
 const URL_HOST = 'https://localhost/';
 
@@ -188,7 +188,7 @@ describe('EE - DAST Profiles Selector', () => {
     const [scannerProfile] = scannerProfiles;
 
     it('scanner profile', () => {
-      setWindowLocation(`?scanner_profile_id=1`);
+      setWindowLocation(`?scanner_profile_id=${getIdFromGraphQLId(scannerProfile.id)}`);
       createComponent();
 
       expect(findScannerProfilesSelector().attributes('value')).toBe(scannerProfile.id);
@@ -203,7 +203,9 @@ describe('EE - DAST Profiles Selector', () => {
 
     it('both scanner & site profile', () => {
       setWindowLocation(
-        `?site_profile_id=${getIdFromGraphQLId(siteProfile.id)}&scanner_profile_id=1`,
+        `?site_profile_id=${getIdFromGraphQLId(
+          siteProfile.id,
+        )}&scanner_profile_id=${getIdFromGraphQLId(scannerProfile.id)}`,
       );
       createComponent();
 

ee/spec/frontend/on_demand_scans_form/components/profile_selector/profile_selector_spec.js

@@ -2,7 +2,7 @@ import { GlDropdownItem } from '@gitlab/ui';
 import { mount } from '@vue/test-utils';
 import { merge } from 'lodash';
 import OnDemandScansProfileSelector from 'ee/on_demand_scans_form/components/profile_selector/profile_selector.vue';
-import { scannerProfiles } from '../../mocks/mock_data';
+import { scannerProfiles } from 'ee_jest/security_configuration/dast_profiles/mocks/mock_data';
 
 describe('OnDemandScansProfileSelector', () => {
   let wrapper;

ee/spec/frontend/on_demand_scans_form/components/profile_selector/scanner_profile_selector_spec.js

-import { mount, shallowMount } from '@vue/test-utils';
+import { shallowMount } from '@vue/test-utils';
 import { merge } from 'lodash';
+import { mountExtended } from 'helpers/vue_test_utils_helper';
 import ProfileSelector from 'ee/on_demand_scans_form/components/profile_selector/profile_selector.vue';
 import OnDemandScansScannerProfileSelector from 'ee/on_demand_scans_form/components/profile_selector/scanner_profile_selector.vue';
 import ScannerProfileSummary from 'ee/on_demand_scans_form/components/profile_selector/scanner_profile_summary.vue';
-import { scannerProfiles } from '../../mocks/mock_data';
+import { scannerProfiles } from 'ee_jest/security_configuration/dast_profiles/mocks/mock_data';
 
 const TEST_LIBRARY_PATH = '/test/scanner/profiles/library/path';
 const TEST_NEW_PATH = '/test/new/scanner/profile/path';
@@ -39,20 +40,26 @@ describe('OnDemandScansScannerProfileSelector', () => {
     );
   };
   const createComponent = wrapperFactory();
-  const createFullComponent = wrapperFactory(mount);
+  const createFullComponent = wrapperFactory(mountExtended);
 
-  const findProfileSelector = () => wrapper.find(ProfileSelector);
+  const findProfileSelector = () => wrapper.findComponent(ProfileSelector);
+  const findSelectorOptions = () => wrapper.findAll('li');
+  const findProfileSummary = () => wrapper.findByTestId('selected-profile-summary');
 
   afterEach(() => {
     wrapper.destroy();
   });
 
   it('renders properly with profiles', () => {
+    const [selectedProfile] = profiles;
     createFullComponent({
       propsData: { profiles, value: profiles[0].id },
     });
 
-    expect(wrapper.element).toMatchSnapshot();
+    expect(findProfileSummary().html()).toContain(selectedProfile.editPath);
+    profiles.forEach((profile, index) => {
+      expect(findSelectorOptions().at(index).text()).toContain(profile.profileName);
+    });
   });
 
   it('renders properly without profiles', () => {

ee/spec/frontend/on_demand_scans_form/components/profile_selector/scanner_profile_summary_spec.js

 import { shallowMount } from '@vue/test-utils';
 import App from 'ee/on_demand_scans_form/components/profile_selector/scanner_profile_summary.vue';
-import { scannerProfiles } from 'ee_jest/on_demand_scans_form/mocks/mock_data';
+import { scannerProfiles } from 'ee_jest/security_configuration/dast_profiles/mocks/mock_data';
 
 const [profile] = scannerProfiles;
 

ee/spec/frontend/on_demand_scans_form/mocks/apollo_mocks.js

-import { siteProfiles } from 'ee_jest/security_configuration/dast_profiles/mocks/mock_data';
-import { scannerProfiles } from './mock_data';
+import {
+  siteProfiles,
+  scannerProfiles,
+} from 'ee_jest/security_configuration/dast_profiles/mocks/mock_data';
 
 const defaults = {
   pageInfo: {

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

-export const scannerProfiles = [
-  {
-    id: 'gid://gitlab/DastScannerProfile/1',
-    profileName: 'Scanner profile #1',
-    spiderTimeout: 5,
-    targetTimeout: 10,
-    scanType: 'PASSIVE',
-    useAjaxSpider: false,
-    showDebugMessages: false,
-    editPath: '/scanner_profile/edit/1',
-    referencedInSecurityPolicies: [],
-  },
-  {
-    id: 'gid://gitlab/DastScannerProfile/2',
-    profileName: 'Scanner profile #2',
-    spiderTimeout: 20,
-    targetTimeout: 150,
-    scanType: 'ACTIVE',
-    useAjaxSpider: true,
-    showDebugMessages: true,
-    editPath: '/scanner_profile/edit/2',
-    referencedInSecurityPolicies: [],
-  },
-];
-
 export const policyScannerProfile = {
   id: 'gid://gitlab/DastScannerProfile/3',
   profileName: 'Scanner profile #3',

ee/spec/frontend/security_configuration/dast/components/configuration_form_spec.js

@@ -5,7 +5,8 @@ import DastProfilesSelector from 'ee/on_demand_scans_form/components/profile_sel
 import ConfigurationSnippetModal from 'ee/security_configuration/components/configuration_snippet_modal.vue';
 import { CONFIGURATION_SNIPPET_MODAL_ID } from 'ee/security_configuration/components/constants';
 import ConfigurationForm from 'ee/security_configuration/dast/components/configuration_form.vue';
-import { scannerProfiles, siteProfiles } from 'ee_jest/on_demand_scans_form/mocks/mock_data';
+import { scannerProfiles } from 'ee_jest/security_configuration/dast_profiles/mocks/mock_data';
+import { siteProfiles } from 'ee_jest/on_demand_scans_form/mocks/mock_data';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
 import { CODE_SNIPPET_SOURCE_DAST } from '~/pipeline_editor/components/code_snippet_alert/constants';
 import { DAST_HELP_PATH } from '~/security_configuration/components/constants';

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

@@ -6,10 +6,8 @@ import DastScannerProfileForm from 'ee/security_configuration/dast_profiles/dast
 import { SCAN_TYPE } from 'ee/security_configuration/dast_profiles/dast_scanner_profiles/constants';
 import dastScannerProfileCreateMutation from 'ee/security_configuration/dast_profiles/dast_scanner_profiles/graphql/dast_scanner_profile_create.mutation.graphql';
 import dastScannerProfileUpdateMutation from 'ee/security_configuration/dast_profiles/dast_scanner_profiles/graphql/dast_scanner_profile_update.mutation.graphql';
-import {
-  scannerProfiles,
-  policyScannerProfile,
-} from 'ee_jest/on_demand_scans_form/mocks/mock_data';
+import { policyScannerProfile } from 'ee_jest/on_demand_scans_form/mocks/mock_data';
+import { scannerProfiles } from 'ee_jest/security_configuration/dast_profiles/mocks/mock_data';
 import { TEST_HOST } from 'helpers/test_constants';
 import { mountExtended, shallowMountExtended } from 'helpers/vue_test_utils_helper';
 

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

 import siteProfilesFixture from 'test_fixtures/graphql/security_configuration/dast_profiles/graphql/dast_site_profiles.query.graphql.basic.json';
+import scannerProfilesFixtures from 'test_fixtures/graphql/security_configuration/dast_profiles/graphql/dast_scanner_profiles.query.graphql.basic.json';
 
 export const siteProfiles = siteProfilesFixture.data.project.siteProfiles.edges.map(
   ({ node }) => node,
@@ -23,26 +24,9 @@ export const policySiteProfile = [
   },
 ];
 
-export const scannerProfiles = [
-  {
-    id: 'gid://gitlab/DastScannerProfile/1',
-    profileName: 'Scanner profile #1',
-    spiderTimeout: 5,
-    targetTimeout: 10,
-    scanType: 'PASSIVE',
-    useAjaxSpider: false,
-    showDebugMessages: false,
-  },
-  {
-    id: 'gid://gitlab/DastScannerProfile/2',
-    profileName: 'Scanner profile #2',
-    spiderTimeout: 20,
-    targetTimeout: 150,
-    scanType: 'ACTIVE',
-    useAjaxSpider: true,
-    showDebugMessages: true,
-  },
-];
+export const scannerProfiles = scannerProfilesFixtures.data.project.scannerProfiles.edges.map(
+  ({ node }) => node,
+);
 
 export const savedScans = [
   {