Update pipeline editor specs

Since there are no feature changes, most of this is just making sure
that the components are set up correctly in the tests.

app/assets/javascripts/pipeline_editor/pipeline_editor_app.vue

@@ -333,7 +333,6 @@ export default {
         @showError="showErrorAlert"
         @refetchContent="refetchContent"
         @updateCiConfig="updateCiConfig"
-        @updateCommitSha="updateCommitSha"
       />
       <confirm-unsaved-changes-dialog :has-unsaved-changes="hasUnsavedChanges" />
     </div>

spec/frontend/pipeline_editor/components/commit/commit_section_spec.js

 import { GlFormTextarea, GlFormInput, GlLoadingIcon } from '@gitlab/ui';
 import { mount } from '@vue/test-utils';
+import { nextTick } from 'vue';
 import { objectToQuery, redirectTo } from '~/lib/utils/url_utility';
 import CommitForm from '~/pipeline_editor/components/commit/commit_form.vue';
 import CommitSection from '~/pipeline_editor/components/commit/commit_section.vue';
@@ -48,7 +49,10 @@ describe('Pipeline Editor | Commit section', () => {
   let wrapper;
   let mockMutate;
 
-  const defaultProps = { ciFileContent: mockCiYml };
+  const defaultProps = {
+    ciFileContent: mockCiYml,
+    commitSha: mockCommitSha,
+  };
 
   const createComponent = ({ props = {}, options = {}, provide = {} } = {}) => {
     mockMutate = jest.fn().mockResolvedValue({
@@ -67,7 +71,6 @@ describe('Pipeline Editor | Commit section', () => {
       provide: { ...mockProvide, ...provide },
       data() {
         return {
-          commitSha: mockCommitSha,
           currentBranch: mockDefaultBranch,
           isNewCiConfigFile: Boolean(options?.isNewCiConfigfile),
         };
@@ -97,8 +100,6 @@ describe('Pipeline Editor | Commit section', () => {
       await findCommitForm().find('[data-testid="new-mr-checkbox"]').setChecked(openMergeRequest);
     }
     await findCommitForm().find('[type="submit"]').trigger('click');
-    // Simulate the write to local cache that occurs after a commit
-    await wrapper.setData({ commitSha: mockCommitNextSha });
   };
 
   const cancelCommitForm = async () => {
@@ -156,6 +157,7 @@ describe('Pipeline Editor | Commit section', () => {
     beforeEach(async () => {
       createComponent();
       await submitCommit();
+      await nextTick();
     });
 
     it('calls the mutation with the current branch', () => {
@@ -181,6 +183,7 @@ describe('Pipeline Editor | Commit section', () => {
 
     it('a second commit submits the latest sha, keeping the form updated', async () => {
       await submitCommit();
+      await nextTick();
 
       expect(mockMutate).toHaveBeenCalledTimes(6);
       expect(mockMutate).toHaveBeenCalledWith({
@@ -188,7 +191,6 @@ describe('Pipeline Editor | Commit section', () => {
         update: expect.any(Function),
         variables: {
           ...mockVariables,
-          lastCommitId: mockCommitNextSha,
           branch: mockDefaultBranch,
         },
       });

spec/frontend/pipeline_editor/components/editor/text_editor_spec.js

@@ -42,15 +42,12 @@ describe('Pipeline Editor | Text editor component', () => {
         defaultBranch: mockDefaultBranch,
         glFeatures,
       },
+      propsData: {
+        commitSha: mockCommitSha,
+      },
       attrs: {
         value: mockCiYml,
       },
-      // Simulate graphQL client query result
-      data() {
-        return {
-          commitSha: mockCommitSha,
-        };
-      },
       listeners: {
         [EDITOR_READY_EVENT]: editorReadyListener,
       },

spec/frontend/pipeline_editor/components/file-nav/branch_switcher_spec.js

@@ -247,15 +247,6 @@ describe('Pipeline editor branch switcher', () => {
 
       expect(wrapper.emitted('refetchContent')).toBeUndefined();
     });
-
-    it('emits the updateCommitSha event when selecting a different branch', async () => {
-      expect(wrapper.emitted('updateCommitSha')).toBeUndefined();
-
-      const branch = findDropdownItems().at(1);
-      branch.vm.$emit('click');
-
-      expect(wrapper.emitted('updateCommitSha')).toHaveLength(1);
-    });
   });
 
   describe('when searching', () => {

spec/frontend/pipeline_editor/components/header/pipeline_status_spec.js

@@ -27,13 +27,11 @@ describe('Pipeline Status', () => {
     wrapper = shallowMount(PipelineStatus, {
       localVue,
       apolloProvider: mockApollo,
-      provide: mockProvide,
-      stubs: { GlLink, GlSprintf },
-      data() {
-        return {
+      propsData: {
         commitSha: mockCommitSha,
-        };
       },
+      provide: mockProvide,
+      stubs: { GlLink, GlSprintf },
     });
   };
 

spec/frontend/pipeline_editor/mock_data.js

@@ -156,30 +156,28 @@ export const mergeUnwrappedCiConfig = (mergedConfig) => {
   };
 };
 
-export const mockNewCommitShaResults = {
+export const mockCommitShaResults = {
   data: {
     project: {
       pipelines: {
         nodes: [
           {
             id: 'gid://gitlab/Ci::Pipeline/1',
-            sha: 'd0d56d363d8a3f67a8ab9fc00207d468f30032ca',
+            sha: mockCommitSha,
             path: `/${mockProjectFullPath}/-/pipelines/488`,
             commitPath: `/${mockProjectFullPath}/-/commit/d0d56d363d8a3f67a8ab9fc00207d468f30032ca`,
           },
-          {
-            id: 'gid://gitlab/Ci::Pipeline/2',
-            sha: 'fcab2ece40b26f428dfa3aa288b12c3c5bdb06aa',
-            path: `/${mockProjectFullPath}/-/pipelines/487`,
-            commitPath: `/${mockProjectFullPath}/-/commit/fcab2ece40b26f428dfa3aa288b12c3c5bdb06aa`,
+        ],
       },
-          {
-            id: 'gid://gitlab/Ci::Pipeline/3',
-            sha: '6c16b17c7f94a438ae19a96c285bb49e3c632cf4',
-            path: `/${mockProjectFullPath}/-/pipelines/433`,
-            commitPath: `/${mockProjectFullPath}/-/commit/6c16b17c7f94a438ae19a96c285bb49e3c632cf4`,
     },
-        ],
+  },
+};
+
+export const mockEmptyCommitShaResults = {
+  data: {
+    project: {
+      pipelines: {
+        nodes: [],
       },
     },
   },

spec/frontend/pipeline_editor/pipeline_editor_app_spec.js

@@ -26,9 +26,10 @@ import {
   mockBlobContentQueryResponseNoCiFile,
   mockCiYml,
   mockCommitSha,
+  mockCommitShaResults,
   mockDefaultBranch,
+  mockEmptyCommitShaResults,
   mockProjectFullPath,
-  mockNewCommitShaResults,
 } from './mock_data';
 
 const localVue = createLocalVue();
@@ -54,7 +55,6 @@ describe('Pipeline editor app component', () => {
   let mockBlobContentData;
   let mockCiConfigData;
   let mockGetTemplate;
-  let mockUpdateCommitSha;
   let mockLatestCommitShaQuery;
   let mockPipelineQuery;
 
@@ -71,6 +71,11 @@ describe('Pipeline editor app component', () => {
         SourceEditor: MockSourceEditor,
         PipelineEditorEmptyState,
       },
+      data() {
+        return {
+          commitSha: '',
+        };
+      },
       mocks: {
         $apollo: {
           queries: {
@@ -96,18 +101,7 @@ describe('Pipeline editor app component', () => {
       [getPipelineQuery, mockPipelineQuery],
     ];
 
-    const resolvers = {
-      Query: {
-        commitSha() {
-          return mockCommitSha;
-        },
-      },
-      Mutation: {
-        updateCommitSha: mockUpdateCommitSha,
-      },
-    };
-
-    mockApollo = createMockApollo(handlers, resolvers);
+    mockApollo = createMockApollo(handlers);
 
     const options = {
       localVue,
@@ -137,7 +131,6 @@ describe('Pipeline editor app component', () => {
     mockBlobContentData = jest.fn();
     mockCiConfigData = jest.fn();
     mockGetTemplate = jest.fn();
-    mockUpdateCommitSha = jest.fn();
     mockLatestCommitShaQuery = jest.fn();
     mockPipelineQuery = jest.fn();
   });
@@ -159,6 +152,7 @@ describe('Pipeline editor app component', () => {
     beforeEach(() => {
       mockBlobContentData.mockResolvedValue(mockBlobContentQueryResponse);
       mockCiConfigData.mockResolvedValue(mockCiConfigQueryResponse);
+      mockLatestCommitShaQuery.mockResolvedValue(mockCommitShaResults);
     });
 
     describe('when file exists', () => {
@@ -230,6 +224,7 @@ describe('Pipeline editor app component', () => {
     describe('when landing on the empty state with feature flag on', () => {
       it('user can click on CTA button and see an empty editor', async () => {
         mockBlobContentData.mockResolvedValue(mockBlobContentQueryResponseNoCiFile);
+        mockLatestCommitShaQuery.mockResolvedValue(mockEmptyCommitShaResults);
 
         await createComponentWithApollo({
           provide: {
@@ -269,6 +264,7 @@ describe('Pipeline editor app component', () => {
           expect(window.scrollTo).toHaveBeenCalledWith({ top: 0, behavior: 'smooth' });
         });
       });
+
       describe('and the commit mutation fails', () => {
         const commitFailedReasons = ['Commit failed'];
 
@@ -320,6 +316,10 @@ describe('Pipeline editor app component', () => {
   });
 
   describe('when refetching content', () => {
+    beforeEach(() => {
+      mockLatestCommitShaQuery.mockResolvedValue(mockCommitShaResults);
+    });
+
     it('refetches blob content', async () => {
       await createComponentWithApollo();
       jest
@@ -352,6 +352,7 @@ describe('Pipeline editor app component', () => {
     const originalLocation = window.location.href;
 
     beforeEach(() => {
+      mockLatestCommitShaQuery.mockResolvedValue(mockCommitShaResults);
       setWindowLocation('?template=Android');
     });
 
@@ -371,45 +372,4 @@ describe('Pipeline editor app component', () => {
       expect(findTextEditor().exists()).toBe(true);
     });
   });
-
-  describe('when updating commit sha', () => {
-    const newCommitSha = mockNewCommitShaResults.data.project.pipelines.nodes[0].sha;
-
-    beforeEach(async () => {
-      mockUpdateCommitSha.mockResolvedValue(newCommitSha);
-      mockLatestCommitShaQuery.mockResolvedValue(mockNewCommitShaResults);
-      await createComponentWithApollo();
-    });
-
-    it('fetches updated commit sha for the new branch', async () => {
-      expect(mockLatestCommitShaQuery).not.toHaveBeenCalled();
-
-      wrapper
-        .findComponent(PipelineEditorHome)
-        .vm.$emit('updateCommitSha', { newBranch: 'new-branch' });
-      await waitForPromises();
-
-      expect(mockLatestCommitShaQuery).toHaveBeenCalledWith({
-        projectPath: mockProjectFullPath,
-        ref: 'new-branch',
-      });
-    });
-
-    it('updates commit sha with the newly fetched commit sha', async () => {
-      expect(mockUpdateCommitSha).not.toHaveBeenCalled();
-
-      wrapper
-        .findComponent(PipelineEditorHome)
-        .vm.$emit('updateCommitSha', { newBranch: 'new-branch' });
-      await waitForPromises();
-
-      expect(mockUpdateCommitSha).toHaveBeenCalled();
-      expect(mockUpdateCommitSha).toHaveBeenCalledWith(
-        expect.any(Object),
-        { commitSha: mockNewCommitShaResults.data.project.pipelines.nodes[0].sha },
-        expect.any(Object),
-        expect.any(Object),
-      );
-    });
-  });
 });