Refactor Unit Tests

app/assets/javascripts/security_configuration/components/constants.js

@@ -18,7 +18,7 @@ import {
  * Translations & helpPagePaths for Static Security Configuration Page
  */
 export const SAST_NAME = __('Static Application Security Testing (SAST)');
-export const SAST_SHORT_NAME = __('SAST');
+export const SAST_SHORT_NAME = s__('ciReport|SAST');
 export const SAST_DESCRIPTION = __('Analyze your source code for known vulnerabilities.');
 export const SAST_HELP_PATH = helpPagePath('user/application_security/sast/index');
 export const SAST_CONFIG_HELP_PATH = helpPagePath('user/application_security/sast/index', {
@@ -26,7 +26,7 @@ export const SAST_CONFIG_HELP_PATH = helpPagePath('user/application_security/sas
 });
 
 export const DAST_NAME = __('Dynamic Application Security Testing (DAST)');
-export const DAST_SHORT_NAME = __('DAST');
+export const DAST_SHORT_NAME = s__('ciReport|DAST');
 export const DAST_DESCRIPTION = __('Analyze a review version of your web application.');
 export const DAST_HELP_PATH = helpPagePath('user/application_security/dast/index');
 export const DAST_CONFIG_HELP_PATH = helpPagePath('user/application_security/dast/index', {
@@ -165,7 +165,7 @@ export const securityFeatures = [
     helpPath: SAST_HELP_PATH,
     configurationHelpPath: SAST_CONFIG_HELP_PATH,
     type: REPORT_TYPE_SAST,
-    // This field is currently hardcoded because SAST is always availabled
+    // This field is currently hardcoded because SAST is always available.
     // It will eventually come from the Backend, the progress is tracked in
     // https://gitlab.com/gitlab-org/gitlab/-/issues/331622
     available: true,

app/assets/javascripts/security_configuration/utils.js

@@ -18,7 +18,7 @@ export const augmentFeatures = (securityFeatures, complianceFeatures, features =
   };
 
   return {
-    augmentedSecurityFeatures: securityFeatures.map((e) => augmentFeature(e)),
-    augmentedComplianceFeatures: complianceFeatures.map((e) => augmentFeature(e)),
+    augmentedSecurityFeatures: securityFeatures.map((feature) => augmentFeature(feature)),
+    augmentedComplianceFeatures: complianceFeatures.map((feature) => augmentFeature(feature)),
   };
 };

locale/gitlab.pot

@@ -10006,9 +10006,6 @@ msgstr ""
 msgid "DAG visualization requires at least 3 dependent jobs."
 msgstr ""
-msgid "DAST"
-msgstr ""
-
 msgid "DAST Configuration"
 msgstr ""
@@ -28483,9 +28480,6 @@ msgstr ""
 msgid "SAML for %{group_name}"
 msgstr ""
-msgid "SAST"
-msgstr ""
-
 msgid "SAST Configuration"
 msgstr ""

spec/frontend/security_configuration/components/redesigned_app_spec.js

 import { GlTab, GlTabs } from '@gitlab/ui';
 import { mount } from '@vue/test-utils';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
+import {
+  SAST_NAME,
+  SAST_SHORT_NAME,
+  SAST_DESCRIPTION,
+  SAST_HELP_PATH,
+  SAST_CONFIG_HELP_PATH,
+} from '~/security_configuration/components/constants';
 import FeatureCard from '~/security_configuration/components/feature_card.vue';
 import RedesignedSecurityConfigurationApp from '~/security_configuration/components/redesigned_app.vue';
 
@@ -17,18 +24,18 @@ describe('NewApp component', () => {
 
   const findMainHeading = () => wrapper.find('h1');
   const findSubHeading = () => wrapper.find('h2');
-  const findTab = () => wrapper.find(GlTab);
-  const findTabs = () => wrapper.findAll(GlTabs);
+  const findTab = () => wrapper.findComponent(GlTab);
+  const findTabs = () => wrapper.findAllComponents(GlTabs);
   const findByTestId = (id) => wrapper.findByTestId(id);
-  const findFeatureCards = () => wrapper.findAll(FeatureCard);
+  const findFeatureCards = () => wrapper.findAllComponents(FeatureCard);
 
   const securityFeaturesMock = [
     {
-      name: 'Static Application Security Testing (SAST)',
-      shortName: 'SAST',
-      description: 'Analyze your source code for known vulnerabilities.',
-      helpPath: '/help/user/application_security/sast/index',
-      configurationHelpPath: '/help/user/application_security/sast/index#configuration',
+      name: SAST_NAME,
+      shortName: SAST_SHORT_NAME,
+      description: SAST_DESCRIPTION,
+      helpPath: SAST_HELP_PATH,
+      configurationHelpPath: SAST_CONFIG_HELP_PATH,
       type: 'sast',
       available: true,
     },
@@ -66,7 +73,7 @@ describe('NewApp component', () => {
     it('renders sub-heading with correct text', () => {
       const subHeading = findSubHeading();
       expect(subHeading).toExist();
-      expect(subHeading.text()).toContain('Security testing');
+      expect(subHeading.text()).toContain(RedesignedSecurityConfigurationApp.i18n.securityTesting);
     });
 
     it('renders right amount of feature cards for given props with correct props', () => {
@@ -91,11 +98,9 @@ describe('NewApp component', () => {
     it('should show latest pipeline info with correct link when latestPipelinePath is defined', () => {
       expect(findByTestId('latest-pipeline-info').exists()).toBe(true);
       expect(findByTestId('latest-pipeline-info').text()).toMatchInterpolatedText(
-        "The status of the tools only applies to the default branch and is based on the latest pipeline. Once you've enabled a scan for the default branch, any subsequent feature branch you create will include the scan.",
-      );
-      expect(findByTestId('latest-pipeline-info').find('a').element.href).toEqual(
-        'http://test.host/test/path',
+        RedesignedSecurityConfigurationApp.i18n.securityTestingDescription,
       );
+      expect(findByTestId('latest-pipeline-info').find('a').attributes('href')).toBe('test/path');
     });
   });
 });