Reviewer feedback: url-util and improve specs

ee/app/assets/javascripts/vue_shared/security_reports/components/vulnerability_details.vue

@@ -11,6 +11,7 @@ import {
   convertObjectPropsToCamelCase,
   convertArrayOfObjectsToCamelCase,
 } from '~/lib/utils/common_utils';
+import { cleanLeadingSeparator } from '~/lib/utils/url_utility';
 import { s__, sprintf } from '~/locale';
 import CodeBlock from '~/vue_shared/components/code_block.vue';
 import VulnerabilityTraining from 'ee/vulnerabilities/components/vulnerability_training.vue';
@@ -155,9 +156,9 @@ export default {
       return Boolean(this.constructedRecordedResponse);
     },
     normalizedProjectFullPath() {
-      const projectFullPath = this.vulnerability.project?.full_path || '';
-      // in some cases the project's full path contains a leading slash and we need to remove it
-      return projectFullPath.startsWith('/') ? projectFullPath.substr(1) : projectFullPath;
+      const projectFullPath = this.vulnerability.project?.full_path;
+
+      return projectFullPath ? cleanLeadingSeparator(projectFullPath) : '';
     },
     camelCaseFormattedIdentifiers() {
       return convertArrayOfObjectsToCamelCase(this.identifiers);

ee/spec/frontend/vue_shared/security_reports/components/vulnerability_details_spec.js

@@ -7,7 +7,7 @@ import VulnerabilityDetails from 'ee/vue_shared/security_reports/components/vuln
 import FalsePositiveAlert from 'ee/vulnerabilities/components/false_positive_alert.vue';
 import GenericReportSection from 'ee/vulnerabilities/components/generic_report/report_section.vue';
 import VulnerabilityTraining from 'ee/vulnerabilities/components/vulnerability_training.vue';
-import { SUPPORTING_MESSAGE_TYPES } from 'ee/vulnerabilities/constants';
+import { SUPPORTED_IDENTIFIER_TYPES, SUPPORTING_MESSAGE_TYPES } from 'ee/vulnerabilities/constants';
 import { mountExtended } from 'helpers/vue_test_utils_helper';
 import { TEST_HOST } from 'helpers/test_constants';
 import { mockFindings } from '../mock_data';
@@ -404,11 +404,13 @@ describe('VulnerabilityDetails component', () => {
 
   describe('vulnerability training', () => {
     describe('with vulnerability identifiers', () => {
-      const identifiers = [{ externalType: 'cwe', externalId: 'cwe-123' }];
+      const identifiers = [{ externalType: SUPPORTED_IDENTIFIER_TYPES.cwe, externalId: 'cwe-123' }];
+      const projectFullPathLeadingSlash = '/namespace/project';
+      const projectFullPathWithoutLeadingSlash = 'namespace/project';
       const project = {
         id: 7071551,
         name: 'project',
-        full_path: '/namespace/project',
+        full_path: projectFullPathLeadingSlash,
         full_name: 'GitLab.org / gitlab-ui',
       };
 
@@ -425,7 +427,7 @@ describe('VulnerabilityDetails component', () => {
 
       it(`passes the project's full path without a leading slash`, () => {
         expect(wrapper.findComponent(VulnerabilityTraining).props('projectFullPath')).toBe(
-          'namespace/project',
+          projectFullPathWithoutLeadingSlash,
         );
       });
     });