Skip to content

G
gitlab-ce
Commit 7162ae25 authored by Nicolò Maria Mezzopera's avatar Nicolò Maria Mezzopera Committed by Denys Mishunov
Browse files
Options

Move group_store to jest 

- group_store_spec
- mock data
parent f7773b61
Hide whitespace changes
Inline Side-by-side
Showing with 190 additions and 231 deletions
app/assets/javascripts/groups/components/app.vue
View file @ 7162ae25
......@@ -111,8 +111,8 @@ export default {
const filterGroupsBy = getParameterByName('filter') || null;
this.isLoading = true;
// eslint-disable-next-line promise/catch-or-return
this.fetchGroups({
return this.fetchGroups({
page,
filterGroupsBy,
sortBy,
......@@ -126,8 +126,7 @@ export default {
fetchPage(page, filterGroupsBy, sortBy, archived) {
this.isLoading = true;
// eslint-disable-next-line promise/catch-or-return
this.fetchGroups({
return this.fetchGroups({
page,
filterGroupsBy,
sortBy,
......
spec/javascripts/groups/components/app_spec.js → spec/frontend/groups/components/app_spec.js
View file @ 7162ae25
import '~/flash';
import $ from 'jquery';
import Vue from 'vue';
import AxiosMockAdapter from 'axios-mock-adapter';
import axios from '~/lib/utils/axios_utils';
import waitForPromises from 'helpers/wait_for_promises';
import appComponent from '~/groups/components/app.vue';
import groupFolderComponent from '~/groups/components/group_folder.vue';
import groupItemComponent from '~/groups/components/group_item.vue';
import eventHub from '~/groups/event_hub';
import GroupsStore from '~/groups/store/groups_store';
import GroupsService from '~/groups/service/groups_service';
import * as urlUtilities from '~/lib/utils/url_utility';
import {
mockEndpoint,
......@@ -36,31 +39,20 @@ const createComponent = (hideProjects = false) => {
});
};
const returnServicePromise = (data, failed) =>
new Promise((resolve, reject) => {
if (failed) {
reject(data);
} else {
resolve({
json() {
return data;
},
});
}
});
describe('AppComponent', () => {
let vm;
let mock;
let getGroupsSpy;
beforeEach(done => {
beforeEach(() => {
mock = new AxiosMockAdapter(axios);
mock.onGet('/dashboard/groups.json').reply(200, mockGroups);
Vue.component('group-folder', groupFolderComponent);
Vue.component('group-item', groupItemComponent);
vm = createComponent();
Vue.nextTick(() => {
done();
});
getGroupsSpy = jest.spyOn(vm.service, 'getGroups');
return vm.$nextTick();
});
describe('computed', () => {
......@@ -74,7 +66,7 @@ describe('AppComponent', () => {
describe('groups', () => {
it('should return list of groups from store', () => {
spyOn(vm.store, 'getGroups');
jest.spyOn(vm.store, 'getGroups').mockImplementation(() => {});
const { groups } = vm;
......@@ -85,7 +77,7 @@ describe('AppComponent', () => {
describe('pageInfo', () => {
it('should return pagination info from store', () => {
spyOn(vm.store, 'getPaginationInfo');
jest.spyOn(vm.store, 'getPaginationInfo').mockImplementation(() => {});
const { pageInfo } = vm;
......@@ -105,73 +97,68 @@ describe('AppComponent', () => {
});
describe('fetchGroups', () => {
it('should call `getGroups` with all the params provided', done => {
spyOn(vm.service, 'getGroups').and.returnValue(returnServicePromise(mockGroups));
vm.fetchGroups({
parentId: 1,
page: 2,
filterGroupsBy: 'git',
sortBy: 'created_desc',
archived: true,
it('should call `getGroups` with all the params provided', () => {
return vm
.fetchGroups({
parentId: 1,
page: 2,
filterGroupsBy: 'git',
sortBy: 'created_desc',
archived: true,
})
.then(() => {
expect(getGroupsSpy).toHaveBeenCalledWith(1, 2, 'git', 'created_desc', true);
});
});
it('should set headers to store for building pagination info when called with `updatePagination`', () => {
mock.onGet('/dashboard/groups.json').reply(200, { headers: mockRawPageInfo });
jest.spyOn(vm, 'updatePagination').mockImplementation(() => {});
return vm.fetchGroups({ updatePagination: true }).then(() => {
expect(getGroupsSpy).toHaveBeenCalled();
expect(vm.updatePagination).toHaveBeenCalled();
});
setTimeout(() => {
expect(vm.service.getGroups).toHaveBeenCalledWith(1, 2, 'git', 'created_desc', true);
done();
}, 0);
});
it('should set headers to store for building pagination info when called with `updatePagination`', done => {
spyOn(vm.service, 'getGroups').and.returnValue(
returnServicePromise({ headers: mockRawPageInfo }),
);
spyOn(vm, 'updatePagination');
vm.fetchGroups({ updatePagination: true });
setTimeout(() => {
expect(vm.service.getGroups).toHaveBeenCalled();
expect(vm.updatePagination).toHaveBeenCalled();
done();
}, 0);
});
it('should show flash error when request fails', () => {
mock.onGet('/dashboard/groups.json').reply(400);
it('should show flash error when request fails', done => {
spyOn(vm.service, 'getGroups').and.returnValue(returnServicePromise(null, true));
spyOn($, 'scrollTo');
spyOn(window, 'Flash');
jest.spyOn($, 'scrollTo').mockImplementation(() => {});
jest.spyOn(window, 'Flash').mockImplementation(() => {});
vm.fetchGroups({});
setTimeout(() => {
return vm.fetchGroups({}).then(() => {
expect(vm.isLoading).toBe(false);
expect($.scrollTo).toHaveBeenCalledWith(0);
expect(window.Flash).toHaveBeenCalledWith('An error occurred. Please try again.');
done();
}, 0);
});
});
});
describe('fetchAllGroups', () => {
it('should fetch default set of groups', done => {
spyOn(vm, 'fetchGroups').and.returnValue(returnServicePromise(mockGroups));
spyOn(vm, 'updatePagination').and.callThrough();
spyOn(vm, 'updateGroups').and.callThrough();
beforeEach(() => {
jest.spyOn(vm, 'fetchGroups');
jest.spyOn(vm, 'updateGroups');
});
vm.fetchAllGroups();
it('should fetch default set of groups', () => {
jest.spyOn(vm, 'updatePagination');
const fetchPromise = vm.fetchAllGroups();
expect(vm.isLoading).toBe(true);
expect(vm.fetchGroups).toHaveBeenCalled();
setTimeout(() => {
return fetchPromise.then(() => {
expect(vm.isLoading).toBe(false);
expect(vm.updateGroups).toHaveBeenCalled();
done();
}, 0);
});
});
it('should fetch matching set of groups when app is loaded with search query', done => {
spyOn(vm, 'fetchGroups').and.returnValue(returnServicePromise(mockSearchedGroups));
spyOn(vm, 'updateGroups').and.callThrough();
it('should fetch matching set of groups when app is loaded with search query', () => {
mock.onGet('/dashboard/groups.json').reply(200, mockSearchedGroups);
vm.fetchAllGroups();
const fetchPromise = vm.fetchAllGroups();
expect(vm.fetchGroups).toHaveBeenCalledWith({
page: null,
......@@ -180,22 +167,24 @@ describe('AppComponent', () => {
updatePagination: true,
archived: null,
});
setTimeout(() => {
return fetchPromise.then(() => {
expect(vm.updateGroups).toHaveBeenCalled();
done();
}, 0);
});
});
});
describe('fetchPage', () => {
it('should fetch groups for provided page details and update window state', done => {
spyOn(vm, 'fetchGroups').and.returnValue(returnServicePromise(mockGroups));
spyOn(vm, 'updateGroups').and.callThrough();
const mergeUrlParams = spyOnDependency(appComponent, 'mergeUrlParams').and.callThrough();
spyOn(window.history, 'replaceState');
spyOn($, 'scrollTo');
beforeEach(() => {
jest.spyOn(vm, 'fetchGroups');
jest.spyOn(vm, 'updateGroups');
});
vm.fetchPage(2, null, null, true);
it('should fetch groups for provided page details and update window state', () => {
jest.spyOn(urlUtilities, 'mergeUrlParams');
jest.spyOn(window.history, 'replaceState').mockImplementation(() => {});
jest.spyOn($, 'scrollTo').mockImplementation(() => {});
const fetchPagePromise = vm.fetchPage(2, null, null, true);
expect(vm.isLoading).toBe(true);
expect(vm.fetchGroups).toHaveBeenCalledWith({
......@@ -205,21 +194,21 @@ describe('AppComponent', () => {
updatePagination: true,
archived: true,
});
setTimeout(() => {
return fetchPagePromise.then(() => {
expect(vm.isLoading).toBe(false);
expect($.scrollTo).toHaveBeenCalledWith(0);
expect(mergeUrlParams).toHaveBeenCalledWith({ page: 2 }, jasmine.any(String));
expect(urlUtilities.mergeUrlParams).toHaveBeenCalledWith({ page: 2 }, expect.any(String));
expect(window.history.replaceState).toHaveBeenCalledWith(
{
page: jasmine.any(String),
page: expect.any(String),
},
jasmine.any(String),
jasmine.any(String),
expect.any(String),
expect.any(String),
);
expect(vm.updateGroups).toHaveBeenCalled();
done();
}, 0);
});
});
});
......@@ -232,9 +221,10 @@ describe('AppComponent', () => {
groupItem.isChildrenLoading = false;
});
it('should fetch children of given group and expand it if group is collapsed and children are not loaded', done => {
spyOn(vm, 'fetchGroups').and.returnValue(returnServicePromise(mockRawChildren));
spyOn(vm.store, 'setGroupChildren');
it('should fetch children of given group and expand it if group is collapsed and children are not loaded', () => {
mock.onGet('/dashboard/groups.json').reply(200, mockRawChildren);
jest.spyOn(vm, 'fetchGroups');
jest.spyOn(vm.store, 'setGroupChildren').mockImplementation(() => {});
vm.toggleChildren(groupItem);
......@@ -242,14 +232,13 @@ describe('AppComponent', () => {
expect(vm.fetchGroups).toHaveBeenCalledWith({
parentId: groupItem.id,
});
setTimeout(() => {
return waitForPromises().then(() => {
expect(vm.store.setGroupChildren).toHaveBeenCalled();
done();
}, 0);
});
});
it('should skip network request while expanding group if children are already loaded', () => {
spyOn(vm, 'fetchGroups');
jest.spyOn(vm, 'fetchGroups');
groupItem.children = mockRawChildren;
vm.toggleChildren(groupItem);
......@@ -259,7 +248,7 @@ describe('AppComponent', () => {
});
it('should collapse group if it is already expanded', () => {
spyOn(vm, 'fetchGroups');
jest.spyOn(vm, 'fetchGroups');
groupItem.isOpen = true;
vm.toggleChildren(groupItem);
......@@ -268,16 +257,15 @@ describe('AppComponent', () => {
expect(groupItem.isOpen).toBe(false);
});
it('should set `isChildrenLoading` back to `false` if load request fails', done => {
spyOn(vm, 'fetchGroups').and.returnValue(returnServicePromise({}, true));
it('should set `isChildrenLoading` back to `false` if load request fails', () => {
mock.onGet('/dashboard/groups.json').reply(400);
vm.toggleChildren(groupItem);
expect(groupItem.isChildrenLoading).toBe(true);
setTimeout(() => {
return waitForPromises().then(() => {
expect(groupItem.isChildrenLoading).toBe(false);
done();
}, 0);
});
});
});
......@@ -332,70 +320,63 @@ describe('AppComponent', () => {
vm.targetParentGroup = groupItem;
});
it('hides modal confirmation leave group and remove group item from tree', done => {
it('hides modal confirmation leave group and remove group item from tree', () => {
const notice = `You left the "${childGroupItem.fullName}" group.`;
spyOn(vm.service, 'leaveGroup').and.returnValue(Promise.resolve({ data: { notice } }));
spyOn(vm.store, 'removeGroup').and.callThrough();
spyOn(window, 'Flash');
spyOn($, 'scrollTo');
jest.spyOn(vm.service, 'leaveGroup').mockResolvedValue({ data: { notice } });
jest.spyOn(vm.store, 'removeGroup');
jest.spyOn(window, 'Flash').mockImplementation(() => {});
jest.spyOn($, 'scrollTo').mockImplementation(() => {});
vm.leaveGroup();
expect(vm.showModal).toBe(false);
expect(vm.targetGroup.isBeingRemoved).toBe(true);
expect(vm.service.leaveGroup).toHaveBeenCalledWith(vm.targetGroup.leavePath);
setTimeout(() => {
return waitForPromises().then(() => {
expect($.scrollTo).toHaveBeenCalledWith(0);
expect(vm.store.removeGroup).toHaveBeenCalledWith(vm.targetGroup, vm.targetParentGroup);
expect(window.Flash).toHaveBeenCalledWith(notice, 'notice');
done();
}, 0);
});
});
it('should show error flash message if request failed to leave group', done => {
it('should show error flash message if request failed to leave group', () => {
const message = 'An error occurred. Please try again.';
spyOn(vm.service, 'leaveGroup').and.returnValue(
returnServicePromise({ status: 500 }, true),
);
spyOn(vm.store, 'removeGroup').and.callThrough();
spyOn(window, 'Flash');
jest.spyOn(vm.service, 'leaveGroup').mockRejectedValue({ status: 500 });
jest.spyOn(vm.store, 'removeGroup');
jest.spyOn(window, 'Flash').mockImplementation(() => {});
vm.leaveGroup();
expect(vm.targetGroup.isBeingRemoved).toBe(true);
expect(vm.service.leaveGroup).toHaveBeenCalledWith(childGroupItem.leavePath);
setTimeout(() => {
return waitForPromises().then(() => {
expect(vm.store.removeGroup).not.toHaveBeenCalled();
expect(window.Flash).toHaveBeenCalledWith(message);
expect(vm.targetGroup.isBeingRemoved).toBe(false);
done();
}, 0);
});
});
it('should show appropriate error flash message if request forbids to leave group', done => {
it('should show appropriate error flash message if request forbids to leave group', () => {
const message = 'Failed to leave the group. Please make sure you are not the only owner.';
spyOn(vm.service, 'leaveGroup').and.returnValue(
returnServicePromise({ status: 403 }, true),
);
spyOn(vm.store, 'removeGroup').and.callThrough();
spyOn(window, 'Flash');
jest.spyOn(vm.service, 'leaveGroup').mockRejectedValue({ status: 403 });
jest.spyOn(vm.store, 'removeGroup');
jest.spyOn(window, 'Flash').mockImplementation(() => {});
vm.leaveGroup(childGroupItem, groupItem);
expect(vm.targetGroup.isBeingRemoved).toBe(true);
expect(vm.service.leaveGroup).toHaveBeenCalledWith(childGroupItem.leavePath);
setTimeout(() => {
return waitForPromises().then(() => {
expect(vm.store.removeGroup).not.toHaveBeenCalled();
expect(window.Flash).toHaveBeenCalledWith(message);
expect(vm.targetGroup.isBeingRemoved).toBe(false);
done();
}, 0);
});
});
});
describe('updatePagination', () => {
it('should set pagination info to store from provided headers', () => {
spyOn(vm.store, 'setPaginationInfo');
jest.spyOn(vm.store, 'setPaginationInfo').mockImplementation(() => {});
vm.updatePagination(mockRawPageInfo);
......@@ -405,7 +386,7 @@ describe('AppComponent', () => {
describe('updateGroups', () => {
it('should call setGroups on store if method was called directly', () => {
spyOn(vm.store, 'setGroups');
jest.spyOn(vm.store, 'setGroups').mockImplementation(() => {});
vm.updateGroups(mockGroups);
......@@ -413,7 +394,7 @@ describe('AppComponent', () => {
});
it('should call setSearchedGroups on store if method was called with fromSearch param', () => {
spyOn(vm.store, 'setSearchedGroups');
jest.spyOn(vm.store, 'setSearchedGroups').mockImplementation(() => {});
vm.updateGroups(mockGroups, true);
......@@ -433,59 +414,55 @@ describe('AppComponent', () => {
});
describe('created', () => {
it('should bind event listeners on eventHub', done => {
spyOn(eventHub, '$on');
it('should bind event listeners on eventHub', () => {
jest.spyOn(eventHub, '$on').mockImplementation(() => {});
const newVm = createComponent();
newVm.$mount();
Vue.nextTick(() => {
expect(eventHub.$on).toHaveBeenCalledWith('fetchPage', jasmine.any(Function));
expect(eventHub.$on).toHaveBeenCalledWith('toggleChildren', jasmine.any(Function));
expect(eventHub.$on).toHaveBeenCalledWith('showLeaveGroupModal', jasmine.any(Function));
expect(eventHub.$on).toHaveBeenCalledWith('updatePagination', jasmine.any(Function));
expect(eventHub.$on).toHaveBeenCalledWith('updateGroups', jasmine.any(Function));
return vm.$nextTick().then(() => {
expect(eventHub.$on).toHaveBeenCalledWith('fetchPage', expect.any(Function));
expect(eventHub.$on).toHaveBeenCalledWith('toggleChildren', expect.any(Function));
expect(eventHub.$on).toHaveBeenCalledWith('showLeaveGroupModal', expect.any(Function));
expect(eventHub.$on).toHaveBeenCalledWith('updatePagination', expect.any(Function));
expect(eventHub.$on).toHaveBeenCalledWith('updateGroups', expect.any(Function));
newVm.$destroy();
done();
});
});
it('should initialize `searchEmptyMessage` prop with correct string when `hideProjects` is `false`', done => {
it('should initialize `searchEmptyMessage` prop with correct string when `hideProjects` is `false`', () => {
const newVm = createComponent();
newVm.$mount();
Vue.nextTick(() => {
return vm.$nextTick().then(() => {
expect(newVm.searchEmptyMessage).toBe('No groups or projects matched your search');
newVm.$destroy();
done();
});
});
it('should initialize `searchEmptyMessage` prop with correct string when `hideProjects` is `true`', done => {
it('should initialize `searchEmptyMessage` prop with correct string when `hideProjects` is `true`', () => {
const newVm = createComponent(true);
newVm.$mount();
Vue.nextTick(() => {
return vm.$nextTick().then(() => {
expect(newVm.searchEmptyMessage).toBe('No groups matched your search');
newVm.$destroy();
done();
});
});
});
describe('beforeDestroy', () => {
it('should unbind event listeners on eventHub', done => {
spyOn(eventHub, '$off');
it('should unbind event listeners on eventHub', () => {
jest.spyOn(eventHub, '$off').mockImplementation(() => {});
const newVm = createComponent();
newVm.$mount();
newVm.$destroy();
Vue.nextTick(() => {
expect(eventHub.$off).toHaveBeenCalledWith('fetchPage', jasmine.any(Function));
expect(eventHub.$off).toHaveBeenCalledWith('toggleChildren', jasmine.any(Function));
expect(eventHub.$off).toHaveBeenCalledWith('showLeaveGroupModal', jasmine.any(Function));
expect(eventHub.$off).toHaveBeenCalledWith('updatePagination', jasmine.any(Function));
expect(eventHub.$off).toHaveBeenCalledWith('updateGroups', jasmine.any(Function));
done();
return vm.$nextTick().then(() => {
expect(eventHub.$off).toHaveBeenCalledWith('fetchPage', expect.any(Function));
expect(eventHub.$off).toHaveBeenCalledWith('toggleChildren', expect.any(Function));
expect(eventHub.$off).toHaveBeenCalledWith('showLeaveGroupModal', expect.any(Function));
expect(eventHub.$off).toHaveBeenCalledWith('updatePagination', expect.any(Function));
expect(eventHub.$off).toHaveBeenCalledWith('updateGroups', expect.any(Function));
});
});
});
......@@ -499,34 +476,31 @@ describe('AppComponent', () => {
vm.$destroy();
});
it('should render loading icon', done => {
it('should render loading icon', () => {
vm.isLoading = true;
Vue.nextTick(() => {
return vm.$nextTick().then(() => {
expect(vm.$el.querySelector('.loading-animation')).toBeDefined();
expect(vm.$el.querySelector('span').getAttribute('aria-label')).toBe('Loading groups');
done();
});
});
it('should render groups tree', done => {
it('should render groups tree', () => {
vm.store.state.groups = [mockParentGroupItem];
vm.isLoading = false;
Vue.nextTick(() => {
return vm.$nextTick().then(() => {
expect(vm.$el.querySelector('.groups-list-tree-container')).toBeDefined();
done();
});
});
it('renders modal confirmation dialog', done => {
it('renders modal confirmation dialog', () => {
vm.groupLeaveConfirmationMessage = 'Are you sure you want to leave the "foo" group?';
vm.showModal = true;
Vue.nextTick(() => {
return vm.$nextTick().then(() => {
const modalDialogEl = vm.$el.querySelector('.modal');
expect(modalDialogEl).not.toBe(null);
expect(modalDialogEl.querySelector('.modal-title').innerText.trim()).toBe('Are you sure?');
expect(modalDialogEl.querySelector('.btn.btn-warning').innerText.trim()).toBe('Leave');
done();
});
});
});
......
spec/javascripts/groups/components/group_folder_spec.js → spec/frontend/groups/components/group_folder_spec.js
View file @ 7162ae25
......@@ -18,15 +18,13 @@ const createComponent = (groups = mockGroups, parentGroup = mockParentGroupItem)
describe('GroupFolderComponent', () => {
let vm;
beforeEach(done => {
beforeEach(() => {
Vue.component('group-item', groupItemComponent);
vm = createComponent();
vm.$mount();
Vue.nextTick(() => {
done();
});
return Vue.nextTick();
});
afterEach(() => {
......
spec/javascripts/groups/components/group_item_spec.js → spec/frontend/groups/components/group_item_spec.js
View file @ 7162ae25
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import mountComponent from 'helpers/vue_mount_component_helper';
import groupItemComponent from '~/groups/components/group_item.vue';
import groupFolderComponent from '~/groups/components/group_folder.vue';
import eventHub from '~/groups/event_hub';
import * as urlUtilities from '~/lib/utils/url_utility';
import { mockParentGroupItem, mockChildren } from '../mock_data';
const createComponent = (group = mockParentGroupItem, parentGroup = mockChildren[0]) => {
......@@ -17,14 +18,12 @@ const createComponent = (group = mockParentGroupItem, parentGroup = mockChildren
describe('GroupItemComponent', () => {
let vm;
beforeEach(done => {
beforeEach(() => {
Vue.component('group-folder', groupFolderComponent);
vm = createComponent();
Vue.nextTick(() => {
done();
});
return Vue.nextTick();
});
afterEach(() => {
......@@ -130,26 +129,24 @@ describe('GroupItemComponent', () => {
});
it('should emit `toggleChildren` event when expand is clicked on a group and it has children present', () => {
spyOn(eventHub, '$emit');
jest.spyOn(eventHub, '$emit').mockImplementation(() => {});
vm.onClickRowGroup(event);
expect(eventHub.$emit).toHaveBeenCalledWith('toggleChildren', vm.group);
});
it('should navigate page to group homepage if group does not have any children present', done => {
it('should navigate page to group homepage if group does not have any children present', () => {
jest.spyOn(urlUtilities, 'visitUrl').mockImplementation();
const group = Object.assign({}, mockParentGroupItem);
group.childrenCount = 0;
const newVm = createComponent(group);
const visitUrl = spyOnDependency(groupItemComponent, 'visitUrl').and.stub();
spyOn(eventHub, '$emit');
jest.spyOn(eventHub, '$emit').mockImplementation(() => {});
newVm.onClickRowGroup(event);
setTimeout(() => {
expect(eventHub.$emit).not.toHaveBeenCalled();
expect(visitUrl).toHaveBeenCalledWith(newVm.group.relativePath);
done();
}, 0);
expect(eventHub.$emit).not.toHaveBeenCalled();
expect(urlUtilities.visitUrl).toHaveBeenCalledWith(newVm.group.relativePath);
});
});
});
......@@ -167,7 +164,7 @@ describe('GroupItemComponent', () => {
const badgeEl = vm.$el.querySelector('.badge-warning');
expect(badgeEl).toBeDefined();
expect(badgeEl).toContainText('pending removal');
expect(badgeEl.innerHTML).toContain('pending removal');
});
});
......@@ -180,7 +177,7 @@ describe('GroupItemComponent', () => {
it('does not render the group pending removal badge', () => {
const groupTextContainer = vm.$el.querySelector('.group-text-container');
expect(groupTextContainer).not.toContainText('pending removal');
expect(groupTextContainer).not.toContain('pending removal');
});
});
......
spec/javascripts/groups/components/groups_spec.js → spec/frontend/groups/components/groups_spec.js
View file @ 7162ae25
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import mountComponent from 'helpers/vue_mount_component_helper';
import groupsComponent from '~/groups/components/groups.vue';
import groupFolderComponent from '~/groups/components/group_folder.vue';
import groupItemComponent from '~/groups/components/group_item.vue';
......@@ -21,15 +21,13 @@ const createComponent = (searchEmpty = false) => {
describe('GroupsComponent', () => {
let vm;
beforeEach(done => {
beforeEach(() => {
Vue.component('group-folder', groupFolderComponent);
Vue.component('group-item', groupItemComponent);
vm = createComponent();
Vue.nextTick(() => {
done();
});
return vm.$nextTick();
});
afterEach(() => {
......@@ -39,37 +37,35 @@ describe('GroupsComponent', () => {
describe('methods', () => {
describe('change', () => {
it('should emit `fetchPage` event when page is changed via pagination', () => {
spyOn(eventHub, '$emit').and.stub();
jest.spyOn(eventHub, '$emit').mockImplementation();
vm.change(2);
expect(eventHub.$emit).toHaveBeenCalledWith(
'fetchPage',
2,
jasmine.any(Object),
jasmine.any(Object),
jasmine.any(Object),
expect.any(Object),
expect.any(Object),
expect.any(Object),
);
});
});
});
describe('template', () => {
it('should render component template correctly', done => {
Vue.nextTick(() => {
it('should render component template correctly', () => {
return vm.$nextTick().then(() => {
expect(vm.$el.querySelector('.groups-list-tree-container')).toBeDefined();
expect(vm.$el.querySelector('.group-list-tree')).toBeDefined();
expect(vm.$el.querySelector('.gl-pagination')).toBeDefined();
expect(vm.$el.querySelectorAll('.has-no-search-results').length).toBe(0);
done();
});
});
it('should render empty search message when `searchEmpty` is `true`', done => {
it('should render empty search message when `searchEmpty` is `true`', () => {
vm.searchEmpty = true;
Vue.nextTick(() => {
return vm.$nextTick().then(() => {
expect(vm.$el.querySelector('.has-no-search-results')).toBeDefined();
done();
});
});
});
......
spec/javascripts/groups/components/item_actions_spec.js → spec/frontend/groups/components/item_actions_spec.js
View file @ 7162ae25
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import mountComponent from 'helpers/vue_mount_component_helper';
import itemActionsComponent from '~/groups/components/item_actions.vue';
import eventHub from '~/groups/event_hub';
import { mockParentGroupItem, mockChildren } from '../mock_data';
......@@ -28,7 +28,7 @@ describe('ItemActionsComponent', () => {
describe('methods', () => {
describe('onLeaveGroup', () => {
it('emits `showLeaveGroupModal` event with `group` and `parentGroup` props', () => {
spyOn(eventHub, '$emit');
jest.spyOn(eventHub, '$emit').mockImplementation(() => {});
vm.onLeaveGroup();
expect(eventHub.$emit).toHaveBeenCalledWith(
......
spec/javascripts/groups/components/item_caret_spec.js → spec/frontend/groups/components/item_caret_spec.js
View file @ 7162ae25
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import mountComponent from 'helpers/vue_mount_component_helper';
import itemCaretComponent from '~/groups/components/item_caret.vue';
const createComponent = (isGroupOpen = false) => {
......@@ -12,27 +12,27 @@ const createComponent = (isGroupOpen = false) => {
};
describe('ItemCaretComponent', () => {
let vm;
afterEach(() => {
vm.$destroy();
});
describe('template', () => {
it('should render component template correctly', () => {
const vm = createComponent();
vm = createComponent();
expect(vm.$el.classList.contains('folder-caret')).toBeTruthy();
expect(vm.$el.querySelectorAll('svg').length).toBe(1);
vm.$destroy();
});
it('should render caret down icon if `isGroupOpen` prop is `true`', () => {
const vm = createComponent(true);
vm = createComponent(true);
expect(vm.$el.querySelector('svg use').getAttribute('xlink:href')).toContain('angle-down');
vm.$destroy();
});
it('should render caret right icon if `isGroupOpen` prop is `false`', () => {
const vm = createComponent();
vm = createComponent();
expect(vm.$el.querySelector('svg use').getAttribute('xlink:href')).toContain('angle-right');
vm.$destroy();
});
});
});
spec/javascripts/groups/components/item_stats_spec.js → spec/frontend/groups/components/item_stats_spec.js
View file @ 7162ae25
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import mountComponent from 'helpers/vue_mount_component_helper';
import itemStatsComponent from '~/groups/components/item_stats.vue';
import {
mockParentGroupItem,
......
spec/javascripts/groups/components/item_stats_value_spec.js → spec/frontend/groups/components/item_stats_value_spec.js
View file @ 7162ae25
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import mountComponent from 'helpers/vue_mount_component_helper';
import itemStatsValueComponent from '~/groups/components/item_stats_value.vue';
const createComponent = ({ title, cssClass, iconName, tooltipPlacement, value }) => {
......@@ -56,6 +56,10 @@ describe('ItemStatsValueComponent', () => {
});
});
afterEach(() => {
vm.$destroy();
});
it('renders component element correctly', () => {
expect(vm.$el.classList.contains('number-subgroups')).toBeTruthy();
expect(vm.$el.querySelectorAll('svg').length).toBeGreaterThan(0);
......@@ -74,9 +78,5 @@ describe('ItemStatsValueComponent', () => {
it('renders value count correctly', () => {
expect(vm.$el.querySelector('.stat-value').innerText.trim()).toContain('10');
});
afterEach(() => {
vm.$destroy();
});
});
});
spec/javascripts/groups/components/item_type_icon_spec.js → spec/frontend/groups/components/item_type_icon_spec.js
View file @ 7162ae25
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import mountComponent from 'helpers/vue_mount_component_helper';
import itemTypeIconComponent from '~/groups/components/item_type_icon.vue';
import { ITEM_TYPE } from '../mock_data';
......@@ -17,7 +17,6 @@ describe('ItemTypeIconComponent', () => {
describe('template', () => {
it('should render component template correctly', () => {
const vm = createComponent();
vm.$mount();
expect(vm.$el.classList.contains('item-type-icon')).toBeTruthy();
vm.$destroy();
......@@ -27,13 +26,11 @@ describe('ItemTypeIconComponent', () => {
let vm;
vm = createComponent(ITEM_TYPE.GROUP, true);
vm.$mount();
expect(vm.$el.querySelector('use').getAttribute('xlink:href')).toContain('folder-open');
vm.$destroy();
vm = createComponent(ITEM_TYPE.GROUP);
vm.$mount();
expect(vm.$el.querySelector('use').getAttribute('xlink:href')).toContain('folder');
vm.$destroy();
......@@ -43,13 +40,11 @@ describe('ItemTypeIconComponent', () => {
let vm;
vm = createComponent(ITEM_TYPE.PROJECT);
vm.$mount();
expect(vm.$el.querySelector('use').getAttribute('xlink:href')).toContain('bookmark');
vm.$destroy();
vm = createComponent(ITEM_TYPE.GROUP);
vm.$mount();
expect(vm.$el.querySelector('use').getAttribute('xlink:href')).not.toContain('bookmark');
vm.$destroy();
......
spec/javascripts/groups/service/groups_service_spec.js → spec/frontend/groups/service/groups_service_spec.js
View file @ 7162ae25
......@@ -12,7 +12,7 @@ describe('GroupsService', () => {
describe('getGroups', () => {
it('should return promise for `GET` request on provided endpoint', () => {
spyOn(axios, 'get').and.stub();
jest.spyOn(axios, 'get').mockResolvedValue();
const params = {
page: 2,
filter: 'git',
......@@ -32,7 +32,7 @@ describe('GroupsService', () => {
describe('leaveGroup', () => {
it('should return promise for `DELETE` request on provided endpoint', () => {
spyOn(axios, 'delete').and.stub();
jest.spyOn(axios, 'delete').mockResolvedValue();
service.leaveGroup(mockParentGroupItem.leavePath);
......
spec/javascripts/groups/store/groups_store_spec.js → spec/frontend/groups/store/groups_store_spec.js
View file @ 7162ae25
......@@ -28,12 +28,12 @@ describe('ProjectsStore', () => {
describe('setGroups', () => {
it('should set groups to state', () => {
const store = new GroupsStore();
spyOn(store, 'formatGroupItem').and.callThrough();
jest.spyOn(store, 'formatGroupItem');
store.setGroups(mockGroups);
expect(store.state.groups.length).toBe(mockGroups.length);
expect(store.formatGroupItem).toHaveBeenCalledWith(jasmine.any(Object));
expect(store.formatGroupItem).toHaveBeenCalledWith(expect.any(Object));
expect(Object.keys(store.state.groups[0]).indexOf('fullName')).toBeGreaterThan(-1);
});
});
......@@ -41,12 +41,12 @@ describe('ProjectsStore', () => {
describe('setSearchedGroups', () => {
it('should set searched groups to state', () => {
const store = new GroupsStore();
spyOn(store, 'formatGroupItem').and.callThrough();
jest.spyOn(store, 'formatGroupItem');
store.setSearchedGroups(mockSearchedGroups);
expect(store.state.groups.length).toBe(mockSearchedGroups.length);
expect(store.formatGroupItem).toHaveBeenCalledWith(jasmine.any(Object));
expect(store.formatGroupItem).toHaveBeenCalledWith(expect.any(Object));
expect(Object.keys(store.state.groups[0]).indexOf('fullName')).toBeGreaterThan(-1);
expect(Object.keys(store.state.groups[0].children[0]).indexOf('fullName')).toBeGreaterThan(
-1,
......@@ -57,11 +57,11 @@ describe('ProjectsStore', () => {
describe('setGroupChildren', () => {
it('should set children to group item in state', () => {
const store = new GroupsStore();
spyOn(store, 'formatGroupItem').and.callThrough();
jest.spyOn(store, 'formatGroupItem');
store.setGroupChildren(mockParentGroupItem, mockRawChildren);
expect(store.formatGroupItem).toHaveBeenCalledWith(jasmine.any(Object));
expect(store.formatGroupItem).toHaveBeenCalledWith(expect.any(Object));
expect(mockParentGroupItem.children.length).toBe(1);
expect(Object.keys(mockParentGroupItem.children[0]).indexOf('fullName')).toBeGreaterThan(-1);
expect(mockParentGroupItem.isOpen).toBeTruthy();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7