BigW Consortium Gitlab

groups_spec.js 2.86 KB
Newer Older
1
import Vue from 'vue';
2
import eventHub from '~/groups/event_hub';
3 4
import groupFolderComponent from '~/groups/components/group_folder.vue';
import groupItemComponent from '~/groups/components/group_item.vue';
5 6
import groupsComponent from '~/groups/components/groups.vue';
import GroupsStore from '~/groups/stores/groups_store';
7
import { groupsData } from './mock_data';
8

Alfredo Sumaran committed
9
describe('Groups Component', () => {
10 11
  let GroupsComponent;
  let store;
12 13
  let component;
  let groups;
14

15 16 17
  beforeEach((done) => {
    Vue.component('group-folder', groupFolderComponent);
    Vue.component('group-item', groupItemComponent);
18 19

    store = new GroupsStore();
20 21
    groups = store.setGroups(groupsData.groups);

22 23 24
    store.storePagination(groupsData.pagination);

    GroupsComponent = Vue.extend(groupsComponent);
25 26 27 28 29 30 31 32 33 34 35

    component = new GroupsComponent({
      propsData: {
        groups: store.state.groups,
        pageInfo: store.state.pageInfo,
      },
    }).$mount();

    Vue.nextTick(() => {
      done();
    });
36 37
  });

Alfredo Sumaran committed
38 39 40 41
  afterEach(() => {
    component.$destroy();
  });

42
  describe('with data', () => {
43 44 45 46 47 48 49
    it('should render a list of groups', () => {
      expect(component.$el.classList.contains('groups-list-tree-container')).toBe(true);
      expect(component.$el.querySelector('#group-12')).toBeDefined();
      expect(component.$el.querySelector('#group-1119')).toBeDefined();
      expect(component.$el.querySelector('#group-1120')).toBeDefined();
    });

50 51 52 53 54 55
    it('should respect the order of groups', () => {
      const wrap = component.$el.querySelector('.groups-list-tree-container > .group-list-tree');
      expect(wrap.querySelector('.group-row:nth-child(1)').id).toBe('group-12');
      expect(wrap.querySelector('.group-row:nth-child(2)').id).toBe('group-1119');
    });

56 57 58 59 60 61
    it('should render group and its subgroup', () => {
      const lists = component.$el.querySelectorAll('.group-list-tree');

      expect(lists.length).toBe(3); // one parent and two subgroups

      expect(lists[0].querySelector('#group-1119').classList.contains('is-open')).toBe(true);
62
      expect(lists[0].querySelector('#group-1119').classList.contains('has-subgroups')).toBe(true);
63

64
      expect(lists[2].querySelector('#group-1120').textContent).toContain(groups.id1119.subGroups.id1120.name);
65 66 67 68
    });

    it('should remove prefix of parent group', () => {
      expect(component.$el.querySelector('#group-12 #group-1128 .title').textContent).toContain('level2 / level3 / level4');
69
    });
70 71 72 73 74 75 76 77 78 79 80 81 82 83 84

    it('should remove the group after leaving the group', (done) => {
      spyOn(window, 'confirm').and.returnValue(true);

      eventHub.$on('leaveGroup', (group, collection) => {
        store.removeGroup(group, collection);
      });

      component.$el.querySelector('#group-12 .leave-group').click();

      Vue.nextTick(() => {
        expect(component.$el.querySelector('#group-12')).toBeNull();
        done();
      });
    });
85 86
  });
});