Add latest changes from gitlab-org/gitlab@master

5 files changed, 190 insertions, 11 deletions

diff --git a/spec/frontend/diffs/components/diff_file_row_spec.js b/spec/frontend/diffs/components/diff_file_row_spec.js
index 3e95d1d55bd..bd5b3afdc05 100644
--- a/spec/frontend/diffs/components/diff_file_row_spec.js
+++ b/spec/frontend/diffs/components/diff_file_row_spec.js
@@ -1,6 +1,7 @@
 import { shallowMount } from '@vue/test-utils';
 import DiffFileRow from '~/diffs/components/diff_file_row.vue';
 import FileRow from '~/vue_shared/components/file_row.vue';
+import FileRowStats from '~/diffs/components/file_row_stats.vue';
 
 describe('Diff File Row component', () => {
   let wrapper;
@@ -16,10 +17,42 @@ describe('Diff File Row component', () => {
   });
 
   it('renders file row component', () => {
-    createComponent({
+    const sharedProps = {
       level: 4,
       file: {},
+    };
+
+    const diffFileRowProps = {
+      hideFileStats: false,
+    };
+
+    createComponent({
+      ...sharedProps,
+      ...diffFileRowProps,
+    });
+
+    expect(wrapper.find(FileRow).props()).toEqual(
+      expect.objectContaining({
+        ...sharedProps,
+      }),
+    );
+  });
+
+  describe('FileRowStats components', () => {
+    it.each`
+      type      | hideFileStats | value    | desc
+      ${'blob'} | ${false}      | ${true}  | ${'is shown if file type is blob'}
+      ${'tree'} | ${false}      | ${false} | ${'is hidden if file is not blob'}
+      ${'blob'} | ${true}       | ${false} | ${'is hidden if hideFileStats is true'}
+    `('$desc', ({ type, value, hideFileStats }) => {
+      createComponent({
+        level: 4,
+        file: {
+          type,
+        },
+        hideFileStats,
+      });
+      expect(wrapper.find(FileRowStats).exists()).toEqual(value);
     });
-    expect(wrapper.find(FileRow).exists()).toEqual(true);
   });
 });
diff --git a/spec/frontend/helpers/dom_shims/element_scroll_into_view.js b/spec/frontend/helpers/dom_shims/element_scroll_into_view.js
new file mode 100644
index 00000000000..a7262d04db0
--- /dev/null
+++ b/spec/frontend/helpers/dom_shims/element_scroll_into_view.js
@@ -0,0 +1 @@
+Element.prototype.scrollIntoView = jest.fn();
diff --git a/spec/frontend/helpers/dom_shims/index.js b/spec/frontend/helpers/dom_shims/index.js
index 95a28f8bfbd..63850b62ff7 100644
--- a/spec/frontend/helpers/dom_shims/index.js
+++ b/spec/frontend/helpers/dom_shims/index.js
@@ -1,3 +1,4 @@
+import './element_scroll_into_view';
 import './get_client_rects';
 import './inner_text';
 import './window_scroll_to';
diff --git a/spec/frontend/ide/components/ide_file_row_spec.js b/spec/frontend/ide/components/ide_file_row_spec.js
index 7531bc3e144..c00ad7c8365 100644
--- a/spec/frontend/ide/components/ide_file_row_spec.js
+++ b/spec/frontend/ide/components/ide_file_row_spec.js
@@ -1,25 +1,117 @@
-import { shallowMount } from '@vue/test-utils';
+import { createLocalVue, mount } from '@vue/test-utils';
+import Vuex from 'vuex';
 import IdeFileRow from '~/ide/components/ide_file_row.vue';
 import FileRow from '~/vue_shared/components/file_row.vue';
+import FileRowExtra from '~/ide/components/file_row_extra.vue';
+import { createStore } from '~/ide/stores';
+
+const localVue = createLocalVue();
+localVue.use(Vuex);
+
+const TEST_EXTRA_PROPS = {
+  testattribute: 'abc',
+};
+
+const defaultComponentProps = (type = 'tree') => ({
+  level: 4,
+  file: {
+    type,
+    name: 'js',
+  },
+});
 
 describe('Ide File Row component', () => {
   let wrapper;
 
-  const createComponent = (props = {}) => {
-    wrapper = shallowMount(IdeFileRow, {
-      propsData: { ...props },
+  const createComponent = (props = {}, options = {}) => {
+    wrapper = mount(IdeFileRow, {
+      propsData: {
+        ...defaultComponentProps(),
+        ...props,
+      },
+      store: createStore(),
+      localVue,
+      ...options,
     });
   };
 
   afterEach(() => {
     wrapper.destroy();
+    wrapper = null;
   });
 
-  it('renders file row component', () => {
-    createComponent({
-      level: 4,
-      file: {},
+  const findFileRowExtra = () => wrapper.find(FileRowExtra);
+  const findFileRow = () => wrapper.find(FileRow);
+  const hasDropdownOpen = () => findFileRowExtra().props('dropdownOpen');
+
+  it('fileRow component has listeners', () => {
+    const toggleTreeOpen = jest.fn();
+    createComponent(
+      {},
+      {
+        listeners: {
+          toggleTreeOpen,
+        },
+      },
+    );
+
+    findFileRow().vm.$emit('toggleTreeOpen');
+
+    return wrapper.vm.$nextTick().then(() => {
+      expect(toggleTreeOpen).toHaveBeenCalled();
+    });
+  });
+
+  describe('default', () => {
+    beforeEach(() => {
+      createComponent(TEST_EXTRA_PROPS);
+    });
+
+    it('renders file row component', () => {
+      const fileRow = findFileRow();
+
+      expect(fileRow.props()).toEqual(expect.objectContaining(defaultComponentProps()));
+      expect(fileRow.attributes()).toEqual(expect.objectContaining(TEST_EXTRA_PROPS));
+    });
+
+    it('renders file row extra', () => {
+      const extra = findFileRowExtra();
+
+      expect(extra.exists()).toBe(true);
+      expect(extra.props()).toEqual({
+        file: defaultComponentProps().file,
+        dropdownOpen: false,
+      });
+    });
+  });
+
+  describe('with open dropdown', () => {
+    beforeEach(() => {
+      createComponent();
+
+      findFileRowExtra().vm.$emit('toggle', true);
+
+      return wrapper.vm.$nextTick();
+    });
+
+    it('shows open dropdown', () => {
+      expect(hasDropdownOpen()).toBe(true);
+    });
+
+    it('hides dropdown when mouseleave', () => {
+      findFileRow().vm.$emit('mouseleave');
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(hasDropdownOpen()).toEqual(false);
+      });
+    });
+
+    it('hides dropdown on toggle', () => {
+      findFileRowExtra().vm.$emit('toggle', false);
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(hasDropdownOpen()).toEqual(false);
+      });
     });
-    expect(wrapper.find(FileRow).exists()).toEqual(true);
   });
 });
diff --git a/spec/frontend/vue_mr_widget/components/mr_widget_suggest_pipeline_spec.js b/spec/frontend/vue_mr_widget/components/mr_widget_suggest_pipeline_spec.js
new file mode 100644
index 00000000000..77293a5b187
--- /dev/null
+++ b/spec/frontend/vue_mr_widget/components/mr_widget_suggest_pipeline_spec.js
@@ -0,0 +1,52 @@
+import { mount } from '@vue/test-utils';
+import { GlLink } from '@gitlab/ui';
+import suggestPipelineComponent from '~/vue_merge_request_widget/components/mr_widget_suggest_pipeline.vue';
+import MrWidgetIcon from '~/vue_merge_request_widget/components/mr_widget_icon.vue';
+
+describe('MRWidgetHeader', () => {
+  let wrapper;
+  const pipelinePath = '/foo/bar/add/pipeline/path';
+  const iconName = 'status_notfound';
+
+  beforeEach(() => {
+    wrapper = mount(suggestPipelineComponent, {
+      propsData: { pipelinePath },
+    });
+  });
+
+  afterEach(() => {
+    wrapper.destroy();
+  });
+
+  describe('template', () => {
+    it('renders add pipeline file link', () => {
+      const link = wrapper.find(GlLink);
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(link.exists()).toBe(true);
+        expect(link.attributes().href).toBe(pipelinePath);
+      });
+    });
+
+    it('renders the expected text', () => {
+      const messageText = /\s*No pipeline\s*Add the .gitlab-ci.yml file\s*to create one./;
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.text()).toMatch(messageText);
+      });
+    });
+
+    it('renders widget icon', () => {
+      const icon = wrapper.find(MrWidgetIcon);
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(icon.exists()).toBe(true);
+        expect(icon.props()).toEqual(
+          expect.objectContaining({
+            name: iconName,
+          }),
+        );
+      });
+    });
+  });
+});