Add tracking for commit northstar

https://gitlab.com/gitlab-org/gitlab/-/merge_requests/31350

app/assets/javascripts/static_site_editor/constants.js

@@ -15,3 +15,5 @@ export const LOAD_CONTENT_ERROR = __(
 );
 
 export const DEFAULT_HEADING = s__('StaticSiteEditor|Static site editor');
+
+export const TRACKING_ACTION_CREATE_COMMIT = 'create_commit';

app/assets/javascripts/static_site_editor/services/submit_content_changes.js

 import Api from '~/api';
+import Tracking from '~/tracking';
 import { s__, sprintf } from '~/locale';
 import { convertObjectPropsToSnakeCase } from '~/lib/utils/common_utils';
 import generateBranchName from '~/static_site_editor/services/generate_branch_name';
@@ -8,6 +9,7 @@ import {
   SUBMIT_CHANGES_BRANCH_ERROR,
   SUBMIT_CHANGES_COMMIT_ERROR,
   SUBMIT_CHANGES_MERGE_REQUEST_ERROR,
+  TRACKING_ACTION_CREATE_COMMIT,
 } from '../constants';
 
 const createBranch = (projectId, branch) =>
@@ -18,8 +20,10 @@ const createBranch = (projectId, branch) =>
     throw new Error(SUBMIT_CHANGES_BRANCH_ERROR);
   });
 
-const commitContent = (projectId, message, branch, sourcePath, content) =>
-  Api.commitMultiple(
+const commitContent = (projectId, message, branch, sourcePath, content) => {
+  Tracking.event(document.body.dataset.page, TRACKING_ACTION_CREATE_COMMIT);
+
+  return Api.commitMultiple(
     projectId,
     convertObjectPropsToSnakeCase({
       branch,
@@ -35,6 +39,7 @@ const commitContent = (projectId, message, branch, sourcePath, content) =>
   ).catch(() => {
     throw new Error(SUBMIT_CHANGES_COMMIT_ERROR);
   });
+};
 
 const createMergeRequest = (projectId, title, sourceBranch, targetBranch = DEFAULT_TARGET_BRANCH) =>
   Api.createProjectMergeRequest(

spec/frontend/static_site_editor/mock_data.js

@@ -45,3 +45,5 @@ export const createMergeRequestResponse = {
   iid: '123',
   web_url: '/merge_requests/123',
 };
+
+export const trackingCategory = 'projects:static_site_editor:show';

spec/frontend/static_site_editor/services/submit_content_changes_spec.js

 import Api from '~/api';
 import { convertObjectPropsToSnakeCase } from '~/lib/utils/common_utils';
+import { mockTracking, unmockTracking } from 'helpers/tracking_helper';
 
 import {
   DEFAULT_TARGET_BRANCH,
   SUBMIT_CHANGES_BRANCH_ERROR,
   SUBMIT_CHANGES_COMMIT_ERROR,
   SUBMIT_CHANGES_MERGE_REQUEST_ERROR,
+  TRACKING_ACTION_CREATE_COMMIT,
 } from '~/static_site_editor/constants';
 import generateBranchName from '~/static_site_editor/services/generate_branch_name';
 import submitContentChanges from '~/static_site_editor/services/submit_content_changes';
@@ -18,6 +20,7 @@ import {
   createMergeRequestResponse,
   sourcePath,
   sourceContent as content,
+  trackingCategory,
 } from '../mock_data';
 
 jest.mock('~/static_site_editor/services/generate_branch_name');
@@ -25,6 +28,8 @@ jest.mock('~/static_site_editor/services/generate_branch_name');
 describe('submitContentChanges', () => {
   const mergeRequestTitle = `Update ${sourcePath} file`;
   const branch = 'branch-name';
+  let trackingSpy;
+  let origPage;
 
   beforeEach(() => {
     jest.spyOn(Api, 'createBranch').mockResolvedValue({ data: commitBranchResponse });
@@ -34,6 +39,15 @@ describe('submitContentChanges', () => {
       .mockResolvedValue({ data: createMergeRequestResponse });
 
     generateBranchName.mockReturnValue(branch);
+
+    origPage = document.body.dataset.page;
+    document.body.dataset.page = trackingCategory;
+    trackingSpy = mockTracking(document.body.dataset.page, undefined, jest.spyOn);
+  });
+
+  afterEach(() => {
+    document.body.dataset.page = origPage;
+    unmockTracking();
   });
 
   it('creates a branch named after the username and target branch', () => {
@@ -69,6 +83,15 @@ describe('submitContentChanges', () => {
     });
   });
 
+  it('sends the correct tracking event when committing content changes', () => {
+    return submitContentChanges({ username, projectId, sourcePath, content }).then(() => {
+      expect(trackingSpy).toHaveBeenCalledWith(
+        document.body.dataset.page,
+        TRACKING_ACTION_CREATE_COMMIT,
+      );
+    });
+  });
+
   it('notifies error when content could not be committed', () => {
     Api.commitMultiple.mockRejectedValueOnce();