Merge branch 'pedropombeiro/448507/add-unit-tests' into 'master'

Add unit tests for runner creation metrics

See merge request https://gitlab.com/gitlab-org/gitlab/-/merge_requests/147376



Merged-by: Miguel Rincon <mrincon@gitlab.com>
Approved-by: Laura Callahan <lmeckley@gitlab.com>
Approved-by: Miguel Rincon <mrincon@gitlab.com>
Reviewed-by: Pedro Pombeiro <noreply@pedro.pombei.ro>
Reviewed-by: Laura Callahan <lmeckley@gitlab.com>
Co-authored-by: Pedro Pombeiro <noreply@pedro.pombei.ro>

ee/spec/frontend/analytics/analytics_dashboards/components/dashboards_list_spec.js

@@ -361,7 +361,7 @@ describe('DashboardsList', () => {
         });
       });
 
-      it('dimisses the alert when the component is destroyed', async () => {
+      it('dismisses the alert when the component is destroyed', async () => {
         wrapper.destroy();
 
         await nextTick();

spec/frontend/ci/runner/group_new_runner_app/group_new_runner_app_spec.js

 import { GlSprintf } from '@gitlab/ui';
 import { s__ } from '~/locale';
 
+import { mockTracking } from 'helpers/tracking_helper';
 import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import { createAlert, VARIANT_SUCCESS } from '~/alert';
 
@@ -12,6 +13,7 @@ import {
   PARAM_KEY_PLATFORM,
   GROUP_TYPE,
   DEFAULT_PLATFORM,
+  GOOGLE_CLOUD_PLATFORM,
   WINDOWS_PLATFORM,
 } from '~/ci/runner/constants';
 import RunnerCreateForm from '~/ci/runner/components/runner_create_form.vue';
@@ -31,6 +33,7 @@ const mockCreatedRunner = runnerCreateResult.data.runnerCreate.runner;
 
 describe('GroupRunnerRunnerApp', () => {
   let wrapper;
+  let trackingSpy;
 
   const findRunnerPlatformsRadioGroup = () => wrapper.findComponent(RunnerPlatformsRadioGroup);
   const findRegistrationCompatibilityAlert = () =>
@@ -38,6 +41,7 @@ describe('GroupRunnerRunnerApp', () => {
   const findRunnerCreateForm = () => wrapper.findComponent(RunnerCreateForm);
 
   const createComponent = () => {
+    trackingSpy = mockTracking(undefined, window.document, jest.spyOn);
     wrapper = shallowMountExtended(GroupRunnerRunnerApp, {
       propsData: {
         groupId: mockGroupId,
@@ -84,6 +88,14 @@ describe('GroupRunnerRunnerApp', () => {
           });
         });
 
+        it('tracks that create runner button has been clicked', () => {
+          expect(trackingSpy).toHaveBeenCalledWith(
+            undefined,
+            'click_create_group_runner_button',
+            expect.any(Object),
+          );
+        });
+
         it('redirects to the registration page', () => {
           const url = `${mockCreatedRunner.ephemeralRegisterUrl}?${PARAM_KEY_PLATFORM}=${DEFAULT_PLATFORM}`;
 
@@ -104,6 +116,21 @@ describe('GroupRunnerRunnerApp', () => {
         });
       });
 
+      describe('When Google Cloud platform is selected and a runner is saved', () => {
+        beforeEach(() => {
+          findRunnerPlatformsRadioGroup().vm.$emit('input', GOOGLE_CLOUD_PLATFORM);
+          findRunnerCreateForm().vm.$emit('saved', mockCreatedRunner);
+        });
+
+        it('tracks that runner was provisioned on Google Cloud', () => {
+          expect(trackingSpy).toHaveBeenCalledWith(
+            undefined,
+            'provision_group_runner_on_google_cloud',
+            expect.any(Object),
+          );
+        });
+      });
+
       describe('When runner fails to save', () => {
         const ERROR_MSG = 'Cannot save!';
 

spec/frontend/ci/runner/group_register_runner_app/group_register_runner_app_spec.js

@@ -4,7 +4,9 @@ import { GlButton } from '@gitlab/ui';
 import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import setWindowLocation from 'helpers/set_window_location_helper';
 import { TEST_HOST } from 'helpers/test_constants';
+import { mockTracking } from 'helpers/tracking_helper';
 
+import { InternalEvents } from '~/tracking';
 import { updateHistory } from '~/lib/utils/url_utility';
 import {
   PARAM_KEY_PLATFORM,
@@ -29,6 +31,7 @@ jest.mock('~/lib/utils/url_utility', () => ({
 
 describe('GroupRegisterRunnerApp', () => {
   let wrapper;
+  let trackingSpy;
 
   const findCloudRegistrationInstructions = () =>
     wrapper.findComponent(GoogleCloudRegistrationInstructions);
@@ -37,6 +40,7 @@ describe('GroupRegisterRunnerApp', () => {
   const findBtn = () => wrapper.findComponent(GlButton);
 
   const createComponent = (googleCloudSupportFeatureFlag = false) => {
+    trackingSpy = mockTracking(undefined, window.document, jest.spyOn);
     wrapper = shallowMountExtended(GroupRegisterRunnerApp, {
       propsData: {
         runnerId: mockRunnerId,
@@ -73,9 +77,28 @@ describe('GroupRegisterRunnerApp', () => {
 
       it('shows runner list button', () => {
         expect(findBtn().attributes('href')).toBe(mockRunnersPath);
+        expect(findBtn().attributes('data-event-tracking')).toBe(
+          'click_view_runners_button_in_new_group_runner_form',
+        );
         expect(findBtn().props('variant')).toBe('confirm');
       });
     });
+
+    describe('when runners list button is clicked', () => {
+      beforeEach(async () => {
+        InternalEvents.bindInternalEventDocument(findBtn().element);
+        await findBtn().trigger('click');
+        await nextTick();
+      });
+
+      it('tracks that view runners button has been clicked', () => {
+        expect(trackingSpy).toHaveBeenCalledWith(
+          undefined,
+          'click_view_runners_button_in_new_group_runner_form',
+          expect.any(Object),
+        );
+      });
+    });
   });
 
   describe('When another platform has been selected', () => {

spec/frontend/ci/runner/project_new_runner_app/project_new_runner_app_spec.js

 import { GlSprintf } from '@gitlab/ui';
 import { s__ } from '~/locale';
 
+import { mockTracking } from 'helpers/tracking_helper';
 import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import { createAlert, VARIANT_SUCCESS } from '~/alert';
 
@@ -12,6 +13,7 @@ import {
   PARAM_KEY_PLATFORM,
   PROJECT_TYPE,
   DEFAULT_PLATFORM,
+  GOOGLE_CLOUD_PLATFORM,
   WINDOWS_PLATFORM,
 } from '~/ci/runner/constants';
 import RunnerCreateForm from '~/ci/runner/components/runner_create_form.vue';
@@ -31,6 +33,7 @@ const mockCreatedRunner = runnerCreateResult.data.runnerCreate.runner;
 
 describe('ProjectRunnerRunnerApp', () => {
   let wrapper;
+  let trackingSpy;
 
   const findRunnerPlatformsRadioGroup = () => wrapper.findComponent(RunnerPlatformsRadioGroup);
   const findRegistrationCompatibilityAlert = () =>
@@ -38,6 +41,7 @@ describe('ProjectRunnerRunnerApp', () => {
   const findRunnerCreateForm = () => wrapper.findComponent(RunnerCreateForm);
 
   const createComponent = () => {
+    trackingSpy = mockTracking(undefined, window.document, jest.spyOn);
     wrapper = shallowMountExtended(ProjectRunnerRunnerApp, {
       propsData: {
         projectId: mockProjectId,
@@ -85,6 +89,14 @@ describe('ProjectRunnerRunnerApp', () => {
           });
         });
 
+        it('tracks that create runner button has been clicked', () => {
+          expect(trackingSpy).toHaveBeenCalledWith(
+            undefined,
+            'click_create_project_runner_button',
+            expect.any(Object),
+          );
+        });
+
         it('redirects to the registration page', () => {
           const url = `${mockCreatedRunner.ephemeralRegisterUrl}?${PARAM_KEY_PLATFORM}=${DEFAULT_PLATFORM}`;
 
@@ -105,6 +117,21 @@ describe('ProjectRunnerRunnerApp', () => {
         });
       });
 
+      describe('When Google Cloud platform is selected and a runner is saved', () => {
+        beforeEach(() => {
+          findRunnerPlatformsRadioGroup().vm.$emit('input', GOOGLE_CLOUD_PLATFORM);
+          findRunnerCreateForm().vm.$emit('saved', mockCreatedRunner);
+        });
+
+        it('tracks that runner was provisioned on Google Cloud', () => {
+          expect(trackingSpy).toHaveBeenCalledWith(
+            undefined,
+            'provision_project_runner_on_google_cloud',
+            expect.any(Object),
+          );
+        });
+      });
+
       describe('When runner fails to save', () => {
         const ERROR_MSG = 'Cannot save!';
 

spec/frontend/ci/runner/project_register_runner_app/project_register_runner_app_spec.js

@@ -4,7 +4,9 @@ import { GlButton } from '@gitlab/ui';
 import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import setWindowLocation from 'helpers/set_window_location_helper';
 import { TEST_HOST } from 'helpers/test_constants';
+import { mockTracking } from 'helpers/tracking_helper';
 
+import { InternalEvents } from '~/tracking';
 import { updateHistory } from '~/lib/utils/url_utility';
 import {
   PARAM_KEY_PLATFORM,
@@ -29,6 +31,7 @@ jest.mock('~/lib/utils/url_utility', () => ({
 
 describe('ProjectRegisterRunnerApp', () => {
   let wrapper;
+  let trackingSpy;
 
   const findCloudRegistrationInstructions = () =>
     wrapper.findComponent(GoogleCloudRegistrationInstructions);
@@ -37,6 +40,7 @@ describe('ProjectRegisterRunnerApp', () => {
   const findBtn = () => wrapper.findComponent(GlButton);
 
   const createComponent = (googleCloudSupportFeatureFlag = false) => {
+    trackingSpy = mockTracking(undefined, window.document, jest.spyOn);
     wrapper = shallowMountExtended(ProjectRegisterRunnerApp, {
       propsData: {
         runnerId: mockRunnerId,
@@ -73,9 +77,28 @@ describe('ProjectRegisterRunnerApp', () => {
 
       it('shows runner list button', () => {
         expect(findBtn().attributes('href')).toBe(mockRunnersPath);
+        expect(findBtn().attributes('data-event-tracking')).toBe(
+          'click_view_runners_button_in_new_project_runner_form',
+        );
         expect(findBtn().props('variant')).toBe('confirm');
       });
     });
+
+    describe('when runners list button is clicked', () => {
+      beforeEach(async () => {
+        InternalEvents.bindInternalEventDocument(findBtn().element);
+        await findBtn().trigger('click');
+        await nextTick();
+      });
+
+      it('tracks that view runners button has been clicked', () => {
+        expect(trackingSpy).toHaveBeenCalledWith(
+          undefined,
+          'click_view_runners_button_in_new_project_runner_form',
+          expect.any(Object),
+        );
+      });
+    });
   });
 
   describe('When another platform has been selected', () => {