Add latest changes from gitlab-org/gitlab@master

2 files changed, 32 insertions, 67 deletions

diff --git a/spec/frontend/groups/components/group_folder_spec.js b/spec/frontend/groups/components/group_folder_spec.js
index 98b7c2dd6c6..f223333360d 100644
--- a/spec/frontend/groups/components/group_folder_spec.js
+++ b/spec/frontend/groups/components/group_folder_spec.js
@@ -1,65 +1,50 @@
-import Vue, { nextTick } from 'vue';
-
-import groupFolderComponent from '~/groups/components/group_folder.vue';
-import groupItemComponent from '~/groups/components/group_item.vue';
+import { shallowMount } from '@vue/test-utils';
+import Vue from 'vue';
+import GroupFolder from '~/groups/components/group_folder.vue';
+import GroupItem from '~/groups/components/group_item.vue';
+import { MAX_CHILDREN_COUNT } from '~/groups/constants';
 import { mockGroups, mockParentGroupItem } from '../mock_data';
 
-const createComponent = (groups = mockGroups, parentGroup = mockParentGroupItem) => {
-  const Component = Vue.extend(groupFolderComponent);
-
-  return new Component({
-    propsData: {
-      groups,
-      parentGroup,
-    },
-  });
-};
+describe('GroupFolder component', () => {
+  let wrapper;
 
-describe('GroupFolderComponent', () => {
-  let vm;
+  Vue.component('GroupItem', GroupItem);
 
-  beforeEach(async () => {
-    Vue.component('GroupItem', groupItemComponent);
+  const findLink = () => wrapper.find('a');
 
-    vm = createComponent();
-    vm.$mount();
-
-    await nextTick();
-  });
+  const createComponent = ({ groups = mockGroups, parentGroup = mockParentGroupItem } = {}) =>
+    shallowMount(GroupFolder, {
+      propsData: {
+        groups,
+        parentGroup,
+      },
+    });
 
   afterEach(() => {
-    vm.$destroy();
+    wrapper.destroy();
   });
 
-  describe('computed', () => {
-    describe('hasMoreChildren', () => {
-      it('should return false when childrenCount of group is less than MAX_CHILDREN_COUNT', () => {
-        expect(vm.hasMoreChildren).toBeFalsy();
-      });
-    });
+  it('does not render more children stats link when children count of group is under limit', () => {
+    wrapper = createComponent();
 
-    describe('moreChildrenStats', () => {
-      it('should return message with count of excess children over MAX_CHILDREN_COUNT limit', () => {
-        expect(vm.moreChildrenStats).toBe('3 more items');
-      });
-    });
+    expect(findLink().exists()).toBe(false);
   });
 
-  describe('template', () => {
-    it('should render component template correctly', () => {
-      expect(vm.$el.classList.contains('group-list-tree')).toBeTruthy();
-      expect(vm.$el.querySelectorAll('li.group-row').length).toBe(7);
+  it('renders text of count of excess children when children count of group is over limit', () => {
+    const childrenCount = MAX_CHILDREN_COUNT + 1;
+    wrapper = createComponent({
+      parentGroup: {
+        ...mockParentGroupItem,
+        childrenCount,
+      },
     });
 
-    it('should render more children link when groups list has children over MAX_CHILDREN_COUNT limit', () => {
-      const parentGroup = { ...mockParentGroupItem };
-      parentGroup.childrenCount = 21;
+    expect(findLink().text()).toBe(`${childrenCount} more items`);
+  });
 
-      const newVm = createComponent(mockGroups, parentGroup);
-      newVm.$mount();
+  it('renders group items', () => {
+    wrapper = createComponent();
 
-      expect(newVm.$el.querySelector('li.group-row a.has-more-items')).toBeDefined();
-      newVm.$destroy();
-    });
+    expect(wrapper.findAllComponents(GroupItem)).toHaveLength(7);
   });
 });
diff --git a/spec/frontend/groups/mock_data.js b/spec/frontend/groups/mock_data.js
index 603cb27deec..65a62876893 100644
--- a/spec/frontend/groups/mock_data.js
+++ b/spec/frontend/groups/mock_data.js
@@ -5,26 +5,6 @@ export const ITEM_TYPE = {
   GROUP: 'group',
 };
 
-export const GROUP_VISIBILITY_TYPE = {
-  public: 'Public - The group and any public projects can be viewed without any authentication.',
-  internal:
-    'Internal - The group and any internal projects can be viewed by any logged in user except external users.',
-  private: 'Private - The group and its projects can only be viewed by members.',
-};
-
-export const PROJECT_VISIBILITY_TYPE = {
-  public: 'Public - The project can be accessed without any authentication.',
-  internal: 'Internal - The project can be accessed by any logged in user except external users.',
-  private:
-    'Private - Project access must be granted explicitly to each user. If this project is part of a group, access will be granted to members of the group.',
-};
-
-export const VISIBILITY_TYPE_ICON = {
-  public: 'earth',
-  internal: 'shield',
-  private: 'lock',
-};
-
 export const mockParentGroupItem = {
   id: 55,
   name: 'hardware',