Add latest changes from gitlab-org/gitlab@13-4-stable-ee

8 files changed, 145 insertions, 58 deletions

diff --git a/spec/frontend/blob/components/blob_content_spec.js b/spec/frontend/blob/components/blob_content_spec.js
index 9232a709194..3db95e5ad3f 100644
--- a/spec/frontend/blob/components/blob_content_spec.js
+++ b/spec/frontend/blob/components/blob_content_spec.js
@@ -36,20 +36,20 @@ describe('Blob Content component', () => {
   describe('rendering', () => {
     it('renders loader if `loading: true`', () => {
       createComponent({ loading: true });
-      expect(wrapper.contains(GlLoadingIcon)).toBe(true);
-      expect(wrapper.contains(BlobContentError)).toBe(false);
-      expect(wrapper.contains(RichViewer)).toBe(false);
-      expect(wrapper.contains(SimpleViewer)).toBe(false);
+      expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
+      expect(wrapper.find(BlobContentError).exists()).toBe(false);
+      expect(wrapper.find(RichViewer).exists()).toBe(false);
+      expect(wrapper.find(SimpleViewer).exists()).toBe(false);
     });
 
     it('renders error if there is any in the viewer', () => {
       const renderError = 'Oops';
       const viewer = { ...SimpleViewerMock, renderError };
       createComponent({}, viewer);
-      expect(wrapper.contains(GlLoadingIcon)).toBe(false);
-      expect(wrapper.contains(BlobContentError)).toBe(true);
-      expect(wrapper.contains(RichViewer)).toBe(false);
-      expect(wrapper.contains(SimpleViewer)).toBe(false);
+      expect(wrapper.find(GlLoadingIcon).exists()).toBe(false);
+      expect(wrapper.find(BlobContentError).exists()).toBe(true);
+      expect(wrapper.find(RichViewer).exists()).toBe(false);
+      expect(wrapper.find(SimpleViewer).exists()).toBe(false);
     });
 
     it.each`
@@ -60,7 +60,7 @@ describe('Blob Content component', () => {
       'renders $type viewer when activeViewer is $type and no loading or error detected',
       ({ mock, viewer }) => {
         createComponent({}, mock);
-        expect(wrapper.contains(viewer)).toBe(true);
+        expect(wrapper.find(viewer).exists()).toBe(true);
       },
     );
 
diff --git a/spec/frontend/blob/components/blob_edit_content_spec.js b/spec/frontend/blob/components/blob_edit_content_spec.js
index 3cc210e972c..dbed086a552 100644
--- a/spec/frontend/blob/components/blob_edit_content_spec.js
+++ b/spec/frontend/blob/components/blob_edit_content_spec.js
@@ -2,12 +2,14 @@ import { shallowMount } from '@vue/test-utils';
 import { nextTick } from 'vue';
 import BlobEditContent from '~/blob/components/blob_edit_content.vue';
 import * as utils from '~/blob/utils';
-import Editor from '~/editor/editor_lite';
 
 jest.mock('~/editor/editor_lite');
 
 describe('Blob Header Editing', () => {
   let wrapper;
+  const onDidChangeModelContent = jest.fn();
+  const updateModelLanguage = jest.fn();
+  const getValue = jest.fn();
   const value = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.';
   const fileName = 'lorem.txt';
   const fileGlobalId = 'snippet_777';
@@ -24,7 +26,12 @@ describe('Blob Header Editing', () => {
   }
 
   beforeEach(() => {
-    jest.spyOn(utils, 'initEditorLite');
+    jest.spyOn(utils, 'initEditorLite').mockImplementation(() => ({
+      onDidChangeModelContent,
+      updateModelLanguage,
+      getValue,
+      dispose: jest.fn(),
+    }));
 
     createComponent();
   });
@@ -34,8 +41,8 @@ describe('Blob Header Editing', () => {
   });
 
   const triggerChangeContent = val => {
-    jest.spyOn(Editor.prototype, 'getValue').mockReturnValue(val);
-    const [cb] = Editor.prototype.onChangeContent.mock.calls[0];
+    getValue.mockReturnValue(val);
+    const [cb] = onDidChangeModelContent.mock.calls[0];
 
     cb();
 
@@ -58,7 +65,7 @@ describe('Blob Header Editing', () => {
       createComponent({ value: undefined });
 
       expect(spy).not.toHaveBeenCalled();
-      expect(wrapper.contains('#editor')).toBe(true);
+      expect(wrapper.find('#editor').exists()).toBe(true);
     });
 
     it('initialises Editor Lite', () => {
@@ -79,12 +86,12 @@ describe('Blob Header Editing', () => {
       });
 
       return nextTick().then(() => {
-        expect(Editor.prototype.updateModelLanguage).toHaveBeenCalledWith(newFileName);
+        expect(updateModelLanguage).toHaveBeenCalledWith(newFileName);
       });
     });
 
     it('registers callback with editor onChangeContent', () => {
-      expect(Editor.prototype.onChangeContent).toHaveBeenCalledWith(expect.any(Function));
+      expect(onDidChangeModelContent).toHaveBeenCalledWith(expect.any(Function));
     });
 
     it('emits input event when the blob content is changed', () => {
diff --git a/spec/frontend/blob/components/blob_edit_header_spec.js b/spec/frontend/blob/components/blob_edit_header_spec.js
index c71595a79cf..4355f46db7e 100644
--- a/spec/frontend/blob/components/blob_edit_header_spec.js
+++ b/spec/frontend/blob/components/blob_edit_header_spec.js
@@ -31,7 +31,7 @@ describe('Blob Header Editing', () => {
     });
 
     it('contains a form input field', () => {
-      expect(wrapper.contains(GlFormInput)).toBe(true);
+      expect(wrapper.find(GlFormInput).exists()).toBe(true);
     });
 
     it('does not show delete button', () => {
diff --git a/spec/frontend/blob/components/blob_embeddable_spec.js b/spec/frontend/blob/components/blob_embeddable_spec.js
deleted file mode 100644
index 1f6790013ca..00000000000
--- a/spec/frontend/blob/components/blob_embeddable_spec.js
+++ /dev/null
@@ -1,35 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import { GlFormInputGroup } from '@gitlab/ui';
-import BlobEmbeddable from '~/blob/components/blob_embeddable.vue';
-
-describe('Blob Embeddable', () => {
-  let wrapper;
-  const url = 'https://foo.bar';
-
-  function createComponent() {
-    wrapper = shallowMount(BlobEmbeddable, {
-      propsData: {
-        url,
-      },
-    });
-  }
-
-  beforeEach(() => {
-    createComponent();
-  });
-
-  afterEach(() => {
-    wrapper.destroy();
-  });
-
-  it('renders gl-form-input-group component', () => {
-    expect(wrapper.find(GlFormInputGroup).exists()).toBe(true);
-  });
-
-  it('makes up optionValues based on the url prop', () => {
-    expect(wrapper.vm.optionValues).toEqual([
-      { name: 'Embed', value: expect.stringContaining(`${url}.js`) },
-      { name: 'Share', value: url },
-    ]);
-  });
-});
diff --git a/spec/frontend/blob/pipeline_tour_success_mock_data.js b/spec/frontend/blob/pipeline_tour_success_mock_data.js
index 7819fcce85d..9dea3969d63 100644
--- a/spec/frontend/blob/pipeline_tour_success_mock_data.js
+++ b/spec/frontend/blob/pipeline_tour_success_mock_data.js
@@ -1,5 +1,6 @@
 const modalProps = {
   goToPipelinesPath: 'some_pipeline_path',
+  projectMergeRequestsPath: 'some_mr_path',
   commitCookie: 'some_cookie',
   humanAccess: 'maintainer',
 };
diff --git a/spec/frontend/blob/pipeline_tour_success_modal_spec.js b/spec/frontend/blob/pipeline_tour_success_modal_spec.js
index 9998cd7f91c..50db1675e13 100644
--- a/spec/frontend/blob/pipeline_tour_success_modal_spec.js
+++ b/spec/frontend/blob/pipeline_tour_success_modal_spec.js
@@ -10,10 +10,7 @@ describe('PipelineTourSuccessModal', () => {
   let cookieSpy;
   let trackingSpy;
 
-  beforeEach(() => {
-    document.body.dataset.page = 'projects:blob:show';
-    trackingSpy = mockTracking('_category_', undefined, jest.spyOn);
-
+  const createComponent = () => {
     wrapper = shallowMount(pipelineTourSuccess, {
       propsData: modalProps,
       stubs: {
@@ -21,13 +18,49 @@ describe('PipelineTourSuccessModal', () => {
         GlSprintf,
       },
     });
+  };
 
+  beforeEach(() => {
+    document.body.dataset.page = 'projects:blob:show';
+    trackingSpy = mockTracking('_category_', undefined, jest.spyOn);
     cookieSpy = jest.spyOn(Cookies, 'remove');
+    createComponent();
   });
 
   afterEach(() => {
     wrapper.destroy();
     unmockTracking();
+    Cookies.remove(modalProps.commitCookie);
+  });
+
+  describe('when the commitCookie contains the mr path', () => {
+    const expectedMrPath = 'expected_mr_path';
+
+    beforeEach(() => {
+      Cookies.set(modalProps.commitCookie, expectedMrPath);
+      createComponent();
+    });
+
+    it('renders the path from the commit cookie for back to the merge request button', () => {
+      const goToMrBtn = wrapper.find({ ref: 'goToMergeRequest' });
+
+      expect(goToMrBtn.attributes('href')).toBe(expectedMrPath);
+    });
+  });
+
+  describe('when the commitCookie does not contain mr path', () => {
+    const expectedMrPath = modalProps.projectMergeRequestsPath;
+
+    beforeEach(() => {
+      Cookies.set(modalProps.commitCookie, true);
+      createComponent();
+    });
+
+    it('renders the path from projectMergeRequestsPath for back to the merge request button', () => {
+      const goToMrBtn = wrapper.find({ ref: 'goToMergeRequest' });
+
+      expect(goToMrBtn.attributes('href')).toBe(expectedMrPath);
+    });
   });
 
   it('has expected structure', () => {
@@ -58,7 +91,7 @@ describe('PipelineTourSuccessModal', () => {
 
     it('send an event when go to pipelines is clicked', () => {
       trackingSpy = mockTracking('_category_', wrapper.element, jest.spyOn);
-      const goToBtn = wrapper.find({ ref: 'goto' });
+      const goToBtn = wrapper.find({ ref: 'goToPipelines' });
       triggerEvent(goToBtn.element);
 
       expect(trackingSpy).toHaveBeenCalledWith('_category_', 'click_button', {
@@ -67,5 +100,17 @@ describe('PipelineTourSuccessModal', () => {
         value: '10',
       });
     });
+
+    it('sends an event when back to the merge request is clicked', () => {
+      trackingSpy = mockTracking('_category_', wrapper.element, jest.spyOn);
+      const goToBtn = wrapper.find({ ref: 'goToMergeRequest' });
+      triggerEvent(goToBtn.element);
+
+      expect(trackingSpy).toHaveBeenCalledWith('_category_', 'click_button', {
+        label: 'congratulate_first_pipeline',
+        property: modalProps.humanAccess,
+        value: '20',
+      });
+    });
   });
 });
diff --git a/spec/frontend/blob/suggest_gitlab_ci_yml/components/popover_spec.js b/spec/frontend/blob/suggest_gitlab_ci_yml/components/popover_spec.js
index 4714d34dbec..e55b8e4af24 100644
--- a/spec/frontend/blob/suggest_gitlab_ci_yml/components/popover_spec.js
+++ b/spec/frontend/blob/suggest_gitlab_ci_yml/components/popover_spec.js
@@ -16,6 +16,7 @@ const commitTrackLabel = 'suggest_commit_first_project_gitlab_ci_yml';
 
 const dismissCookie = 'suggest_gitlab_ci_yml_99';
 const humanAccess = 'owner';
+const mergeRequestPath = '/some/path';
 
 describe('Suggest gitlab-ci.yml Popover', () => {
   let wrapper;
@@ -26,10 +27,11 @@ describe('Suggest gitlab-ci.yml Popover', () => {
         target,
         trackLabel,
         dismissKey,
+        mergeRequestPath,
         humanAccess,
       },
       stubs: {
-        'gl-popover': '<div><slot name="title"></slot><slot></slot></div>',
+        'gl-popover': { template: '<div><slot name="title"></slot><slot></slot></div>' },
       },
     });
   }
diff --git a/spec/frontend/blob/suggest_web_ide_ci/web_ide_alert_spec.js b/spec/frontend/blob/suggest_web_ide_ci/web_ide_alert_spec.js
new file mode 100644
index 00000000000..8dc71f99010
--- /dev/null
+++ b/spec/frontend/blob/suggest_web_ide_ci/web_ide_alert_spec.js
@@ -0,0 +1,67 @@
+import MockAdapter from 'axios-mock-adapter';
+import waitForPromises from 'helpers/wait_for_promises';
+import { shallowMount } from '@vue/test-utils';
+import { GlButton, GlAlert } from '@gitlab/ui';
+import axios from '~/lib/utils/axios_utils';
+import WebIdeAlert from '~/blob/suggest_web_ide_ci/components/web_ide_alert.vue';
+
+const dismissEndpoint = '/-/user_callouts';
+const featureId = 'web_ide_alert_dismissed';
+const editPath = 'edit/master/-/.gitlab-ci.yml';
+
+describe('WebIdeAlert', () => {
+  let wrapper;
+  let mock;
+
+  const findButton = () => wrapper.find(GlButton);
+  const findAlert = () => wrapper.find(GlAlert);
+  const dismissAlert = alertWrapper => alertWrapper.vm.$emit('dismiss');
+  const getPostPayload = () => JSON.parse(mock.history.post[0].data);
+
+  const createComponent = () => {
+    wrapper = shallowMount(WebIdeAlert, {
+      propsData: {
+        dismissEndpoint,
+        featureId,
+        editPath,
+      },
+    });
+  };
+
+  beforeEach(() => {
+    mock = new MockAdapter(axios);
+
+    mock.onPost(dismissEndpoint).reply(200);
+
+    createComponent();
+  });
+
+  afterEach(() => {
+    wrapper.destroy();
+    wrapper = null;
+
+    mock.restore();
+  });
+
+  describe('with defaults', () => {
+    it('displays alert correctly', () => {
+      expect(findAlert().exists()).toBe(true);
+    });
+
+    it('web ide button link has correct path', () => {
+      expect(findButton().attributes('href')).toBe(editPath);
+    });
+
+    it('dismisses alert correctly', async () => {
+      const alertWrapper = findAlert();
+
+      dismissAlert(alertWrapper);
+
+      await waitForPromises();
+
+      expect(alertWrapper.exists()).toBe(false);
+      expect(mock.history.post).toHaveLength(1);
+      expect(getPostPayload()).toEqual({ feature_name: featureId });
+    });
+  });
+});