Add latest changes from gitlab-org/gitlab@master

3 files changed, 95 insertions, 23 deletions

diff --git a/spec/frontend/ide/components/commit_sidebar/form_spec.js b/spec/frontend/ide/components/commit_sidebar/form_spec.js
index cec3fdfc05e..857d8f400a7 100644
--- a/spec/frontend/ide/components/commit_sidebar/form_spec.js
+++ b/spec/frontend/ide/components/commit_sidebar/form_spec.js
@@ -4,6 +4,7 @@ import { GlModal } from '@gitlab/ui';
 import { projectData } from 'jest/ide/mock_data';
 import { stubComponent } from 'helpers/stub_component';
 import waitForPromises from 'helpers/wait_for_promises';
+import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
 import { createStore } from '~/ide/stores';
 import { COMMIT_TO_NEW_BRANCH } from '~/ide/stores/modules/commit/constants';
 import CommitForm from '~/ide/components/commit_sidebar/form.vue';
@@ -23,6 +24,9 @@ describe('IDE commit form', () => {
   const createComponent = () => {
     wrapper = shallowMount(CommitForm, {
       store,
+      directives: {
+        GlTooltip: createMockDirective(),
+      },
       stubs: {
         GlModal: stubComponent(GlModal),
       },
@@ -39,8 +43,21 @@ describe('IDE commit form', () => {
     store.state.currentActivityView = leftSidebarViews.edit.name;
   };
   const findBeginCommitButton = () => wrapper.find('[data-testid="begin-commit-button"]');
+  const findBeginCommitButtonTooltip = () =>
+    wrapper.find('[data-testid="begin-commit-button-tooltip"]');
+  const findBeginCommitButtonData = () => ({
+    disabled: findBeginCommitButton().props('disabled'),
+    tooltip: getBinding(findBeginCommitButtonTooltip().element, 'gl-tooltip').value.title,
+  });
   const findCommitButton = () => wrapper.find('[data-testid="commit-button"]');
+  const findCommitButtonTooltip = () => wrapper.find('[data-testid="commit-button-tooltip"]');
+  const findCommitButtonData = () => ({
+    disabled: findCommitButton().props('disabled'),
+    tooltip: getBinding(findCommitButtonTooltip().element, 'gl-tooltip').value.title,
+  });
+  const clickCommitButton = () => findCommitButton().vm.$emit('click');
   const findForm = () => wrapper.find('form');
+  const submitForm = () => findForm().trigger('submit');
   const findCommitMessageInput = () => wrapper.find(CommitMessageField);
   const setCommitMessageInput = (val) => findCommitMessageInput().vm.$emit('input', val);
   const findDiscardDraftButton = () => wrapper.find('[data-testid="discard-draft"]');
@@ -52,27 +69,40 @@ describe('IDE commit form', () => {
     store.state.currentBranchId = 'master';
     Vue.set(store.state.projects, 'abcproject', {
       ...projectData,
+      userPermissions: { pushCode: true },
     });
   });
 
   afterEach(() => {
     wrapper.destroy();
-    wrapper = null;
   });
 
+  // Notes:
+  // - When there are no changes, there is no commit button so there's nothing to test :)
   describe.each`
-    desc                           | stagedFiles | disabled
-    ${'when there are changes'}    | ${['test']} | ${false}
-    ${'when there are no changes'} | ${[]}       | ${true}
-  `('$desc', ({ stagedFiles, disabled }) => {
+    desc                           | stagedFiles | userPermissions        | viewFn            | buttonFn                     | disabled | tooltip
+    ${'when there are no changes'} | ${[]}       | ${{ pushCode: true }}  | ${goToEditView}   | ${findBeginCommitButtonData} | ${true}  | ${''}
+    ${'when there are changes'}    | ${['test']} | ${{ pushCode: true }}  | ${goToEditView}   | ${findBeginCommitButtonData} | ${false} | ${''}
+    ${'when there are changes'}    | ${['test']} | ${{ pushCode: true }}  | ${goToCommitView} | ${findCommitButtonData}      | ${false} | ${''}
+    ${'when user cannot push'}     | ${['test']} | ${{ pushCode: false }} | ${goToEditView}   | ${findBeginCommitButtonData} | ${true}  | ${CommitForm.MSG_CANNOT_PUSH_CODE}
+    ${'when user cannot push'}     | ${['test']} | ${{ pushCode: false }} | ${goToCommitView} | ${findCommitButtonData}      | ${true}  | ${CommitForm.MSG_CANNOT_PUSH_CODE}
+  `('$desc', ({ stagedFiles, userPermissions, viewFn, buttonFn, disabled, tooltip }) => {
     beforeEach(async () => {
       store.state.stagedFiles = stagedFiles;
+      store.state.projects.abcproject.userPermissions = userPermissions;
 
       createComponent();
     });
 
-    it(`begin button disabled=${disabled}`, async () => {
-      expect(findBeginCommitButton().props('disabled')).toBe(disabled);
+    it(`at view=${viewFn.name}, ${buttonFn.name} has disabled=${disabled} tooltip=${tooltip}`, async () => {
+      viewFn();
+
+      await wrapper.vm.$nextTick();
+
+      expect(buttonFn()).toEqual({
+        disabled,
+        tooltip,
+      });
     });
   });
 
@@ -252,12 +282,21 @@ describe('IDE commit form', () => {
         jest.spyOn(store, 'dispatch').mockResolvedValue();
       });
 
-      it('calls commitChanges', () => {
-        findCommitButton().vm.$emit('click');
+      it.each([clickCommitButton, submitForm])('when %p, commits changes', (fn) => {
+        fn();
 
         expect(store.dispatch).toHaveBeenCalledWith('commit/commitChanges', undefined);
       });
 
+      it('when cannot push code, submitting does nothing', async () => {
+        store.state.projects.abcproject.userPermissions.pushCode = false;
+        await wrapper.vm.$nextTick();
+
+        submitForm();
+
+        expect(store.dispatch).not.toHaveBeenCalled();
+      });
+
       it.each`
         createError                                          | props
         ${() => createCodeownersCommitError('test message')} | ${{ actionPrimary: { text: 'Create new branch' } }}
diff --git a/spec/frontend/ide/components/ide_spec.js b/spec/frontend/ide/components/ide_spec.js
index 805fa898611..ef8c55c8b1c 100644
--- a/spec/frontend/ide/components/ide_spec.js
+++ b/spec/frontend/ide/components/ide_spec.js
@@ -1,9 +1,10 @@
 import Vuex from 'vuex';
 import { createLocalVue, shallowMount } from '@vue/test-utils';
+import { GlAlert } from '@gitlab/ui';
 import waitForPromises from 'helpers/wait_for_promises';
 import { createStore } from '~/ide/stores';
 import ErrorMessage from '~/ide/components/error_message.vue';
-import ide from '~/ide/components/ide.vue';
+import Ide from '~/ide/components/ide.vue';
 import { file } from '../helpers';
 import { projectData } from '../mock_data';
 
@@ -15,12 +16,12 @@ describe('WebIDE', () => {
 
   let wrapper;
 
-  function createComponent({ projData = emptyProjData, state = {} } = {}) {
+  const createComponent = ({ projData = emptyProjData, state = {} } = {}) => {
     const store = createStore();
 
     store.state.currentProjectId = 'abcproject';
     store.state.currentBranchId = 'master';
-    store.state.projects.abcproject = { ...projData };
+    store.state.projects.abcproject = projData && { ...projData };
     store.state.trees['abcproject/master'] = {
       tree: [],
       loading: false,
@@ -29,11 +30,13 @@ describe('WebIDE', () => {
       store.state[key] = state[key];
     });
 
-    return shallowMount(ide, {
+    wrapper = shallowMount(Ide, {
       store,
       localVue,
     });
-  }
+  };
+
+  const findAlert = () => wrapper.find(GlAlert);
 
   afterEach(() => {
     wrapper.destroy();
@@ -42,7 +45,7 @@ describe('WebIDE', () => {
 
   describe('ide component, empty repo', () => {
     beforeEach(() => {
-      wrapper = createComponent({
+      createComponent({
         projData: {
           empty_repo: true,
         },
@@ -63,7 +66,7 @@ describe('WebIDE', () => {
       `(
         'should error message exists=$exists when errorMessage=$errorMessage',
         async ({ errorMessage, exists }) => {
-          wrapper = createComponent({
+          createComponent({
             state: {
               errorMessage,
             },
@@ -78,12 +81,12 @@ describe('WebIDE', () => {
 
     describe('onBeforeUnload', () => {
       it('returns undefined when no staged files or changed files', () => {
-        wrapper = createComponent();
+        createComponent();
         expect(wrapper.vm.onBeforeUnload()).toBe(undefined);
       });
 
       it('returns warning text when their are changed files', () => {
-        wrapper = createComponent({
+        createComponent({
           state: {
             changedFiles: [file()],
           },
@@ -93,7 +96,7 @@ describe('WebIDE', () => {
       });
 
       it('returns warning text when their are staged files', () => {
-        wrapper = createComponent({
+        createComponent({
           state: {
             stagedFiles: [file()],
           },
@@ -104,7 +107,7 @@ describe('WebIDE', () => {
 
       it('updates event object', () => {
         const event = {};
-        wrapper = createComponent({
+        createComponent({
           state: {
             stagedFiles: [file()],
           },
@@ -118,7 +121,7 @@ describe('WebIDE', () => {
 
     describe('non-existent branch', () => {
       it('does not render "New file" button for non-existent branch when repo is not empty', () => {
-        wrapper = createComponent({
+        createComponent({
           state: {
             projects: {},
           },
@@ -130,7 +133,7 @@ describe('WebIDE', () => {
 
     describe('branch with files', () => {
       beforeEach(() => {
-        wrapper = createComponent({
+        createComponent({
           projData: {
             empty_repo: false,
           },
@@ -142,4 +145,31 @@ describe('WebIDE', () => {
       });
     });
   });
+
+  it('when user cannot push code, shows alert', () => {
+    createComponent({
+      projData: {
+        userPermissions: {
+          pushCode: false,
+        },
+      },
+    });
+
+    expect(findAlert().props()).toMatchObject({
+      dismissible: false,
+    });
+    expect(findAlert().text()).toBe(Ide.MSG_CANNOT_PUSH_CODE);
+  });
+
+  it.each`
+    desc                           | projData
+    ${'when user can push code'}   | ${{ userPermissions: { pushCode: true } }}
+    ${'when project is not ready'} | ${null}
+  `('$desc, no alert is shown', ({ projData }) => {
+    createComponent({
+      projData,
+    });
+
+    expect(findAlert().exists()).toBe(false);
+  });
 });
diff --git a/spec/frontend/ide/stores/getters_spec.js b/spec/frontend/ide/stores/getters_spec.js
index 1787f9e9361..1289c1aec75 100644
--- a/spec/frontend/ide/stores/getters_spec.js
+++ b/spec/frontend/ide/stores/getters_spec.js
@@ -2,6 +2,7 @@ import { TEST_HOST } from 'helpers/test_constants';
 import * as getters from '~/ide/stores/getters';
 import { createStore } from '~/ide/stores';
 import { file } from '../helpers';
+import { DEFAULT_PERMISSIONS } from '../../../../app/assets/javascripts/ide/constants';
 
 const TEST_PROJECT_ID = 'test_project';
 
@@ -386,7 +387,9 @@ describe('IDE store getters', () => {
 
   describe('findProjectPermissions', () => {
     it('returns false if project not found', () => {
-      expect(localStore.getters.findProjectPermissions(TEST_PROJECT_ID)).toEqual({});
+      expect(localStore.getters.findProjectPermissions(TEST_PROJECT_ID)).toEqual(
+        DEFAULT_PERMISSIONS,
+      );
     });
 
     it('finds permission in given project', () => {