Skip to content

G
gitlab-ce
Commit c80fac8b authored by Coung Ngo's avatar Coung Ngo
Browse files
Options

Move tests from Karma to Jest 

Move tests as part of Jestodius
parent b26e9115
Hide whitespace changes
Inline Side-by-side
Showing with 513 additions and 171 deletions
app/assets/javascripts/sidebar/components/participants/participants.vue
View file @ c80fac8b
......@@ -95,22 +95,18 @@ export default {
@click="onClickCollapsedIcon"
>
<i class="fa fa-users" aria-hidden="true"> </i>
<gl-loading-icon v-if="loading" class="js-participants-collapsed-loading-icon" />
<gl-loading-icon v-if="loading" />
<span v-else class="js-participants-collapsed-count"> {{ participantCount }} </span>
</div>
<div v-if="showParticipantLabel" class="title hide-collapsed">
<gl-loading-icon
v-if="loading"
:inline="true"
class="js-participants-expanded-loading-icon"
/>
<gl-loading-icon v-if="loading" :inline="true" />
{{ participantLabel }}
</div>
<div class="participants-list hide-collapsed">
<div
v-for="participant in visibleParticipants"
:key="participant.id"
class="participants-author js-participants-author"
class="participants-author"
>
<a :href="participant.web_url" class="author-link">
<user-avatar-image
......@@ -125,11 +121,7 @@ export default {
</div>
</div>
<div v-if="hasMoreParticipants" class="participants-more hide-collapsed">
<button
type="button"
class="btn-transparent btn-link js-toggle-participants-button"
@click="toggleMoreParticipants"
>
<button type="button" class="btn-transparent btn-link" @click="toggleMoreParticipants">
{{ toggleLabel }}
</button>
</div>
......
ee/spec/javascripts/kubernetes_mock_data.js deleted 100644 → 0
View file @ b26e9115
export const logMockData = [
'[2018-05-17 16:31:10] INFO WEBrick 1.3.1',
'[2018-05-17 16:31:10] INFO ruby 2.4.1 (2017-03-22) [x86_64-linux-musl]',
'[2018-05-17 16:31:10] INFO WEBrick::HTTPServer#start: pid=5 port=5000',
"172.17.0.1 - - [17/May/2018:16:31:14 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:31:24 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:31:32 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:31:34 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:31:42 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:31:44 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:31:52 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:31:54 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:02 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:04 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:12 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:14 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:22 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:24 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:32 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:34 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:42 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:44 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:52 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:32:54 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:02 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:04 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:12 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:14 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:22 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:24 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:32 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:34 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:42 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:44 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:52 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:33:54 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:02 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:04 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:12 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:14 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:22 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:24 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:32 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:34 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:42 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:44 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:52 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:34:54 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:35:02 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:35:04 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:35:12 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:35:14 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:35:22 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
"172.17.0.1 - - [17/May/2018:16:35:24 UTC] 'GET / HTTP/1.1' 200 13",
'- -> /',
];
export const podMockData = ['production-tanuki-1', 'production-tanuki-2', 'production-tanuki-3'];
export const mockEnvironmentData = [
{
name: 'production',
logs_path: '/namespace/project/environments/1/logs',
id: 1,
},
{
name: 'stating',
logs_path: '/namespace/project/environments/2/logs',
id: 2,
},
{
name: 'review/my-new-branch',
logs_path: '/namespace/project/environments/3/logs',
id: 3,
},
];
export default {};
spec/frontend/sidebar/lock/edit_form_buttons_spec.js 0 → 100644
View file @ c80fac8b
import { shallowMount } from '@vue/test-utils';
import EditFormButtons from '~/sidebar/components/lock/edit_form_buttons.vue';
describe('EditFormButtons', () => {
let wrapper;
const mountComponent = propsData => shallowMount(EditFormButtons, { propsData });
afterEach(() => {
wrapper.destroy();
wrapper = null;
});
it('displays "Unlock" when locked', () => {
wrapper = mountComponent({
isLocked: true,
updateLockedAttribute: () => {},
});
expect(wrapper.text()).toContain('Unlock');
});
it('displays "Lock" when unlocked', () => {
wrapper = mountComponent({
isLocked: false,
updateLockedAttribute: () => {},
});
expect(wrapper.text()).toContain('Lock');
});
});
spec/javascripts/sidebar/participants_spec.js → spec/frontend/sidebar/participants_spec.js
View file @ c80fac8b
import { GlLoadingIcon } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import participants from '~/sidebar/components/participants/participants.vue';
import Participants from '~/sidebar/components/participants/participants.vue';
const PARTICIPANT = {
id: 1,
......@@ -13,190 +14,187 @@ const PARTICIPANT = {
const PARTICIPANT_LIST = [PARTICIPANT, { ...PARTICIPANT, id: 2 }, { ...PARTICIPANT, id: 3 }];
describe('Participants', function() {
let vm;
let Participants;
describe('Participants', () => {
let wrapper;
beforeEach(() => {
Participants = Vue.extend(participants);
});
const getMoreParticipantsButton = () => wrapper.find('button');
const mountComponent = propsData =>
shallowMount(Participants, {
propsData,
});
afterEach(() => {
vm.$destroy();
wrapper.destroy();
wrapper = null;
});
describe('collapsed sidebar state', () => {
it('shows loading spinner when loading', () => {
vm = mountComponent(Participants, {
wrapper = mountComponent({
loading: true,
});
expect(vm.$el.querySelector('.js-participants-collapsed-loading-icon')).toBeDefined();
expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
});
it('shows participant count when given', () => {
vm = mountComponent(Participants, {
wrapper = mountComponent({
loading: false,
participants: PARTICIPANT_LIST,
});
const countEl = vm.$el.querySelector('.js-participants-collapsed-count');
expect(countEl.textContent.trim()).toBe(`${PARTICIPANT_LIST.length}`);
expect(wrapper.find('.js-participants-collapsed-count').text()).toBe(
`${PARTICIPANT_LIST.length}`,
);
});
it('shows full participant count when there are hidden participants', () => {
vm = mountComponent(Participants, {
wrapper = mountComponent({
loading: false,
participants: PARTICIPANT_LIST,
numberOfLessParticipants: 1,
});
const countEl = vm.$el.querySelector('.js-participants-collapsed-count');
expect(countEl.textContent.trim()).toBe(`${PARTICIPANT_LIST.length}`);
expect(wrapper.find('.js-participants-collapsed-count').text()).toBe(
`${PARTICIPANT_LIST.length}`,
);
});
});
describe('expanded sidebar state', () => {
it('shows loading spinner when loading', () => {
vm = mountComponent(Participants, {
wrapper = mountComponent({
loading: true,
});
expect(vm.$el.querySelector('.js-participants-expanded-loading-icon')).toBeDefined();
expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
});
it('when only showing visible participants, shows an avatar only for each participant under the limit', done => {
it('when only showing visible participants, shows an avatar only for each participant under the limit', () => {
const numberOfLessParticipants = 2;
vm = mountComponent(Participants, {
wrapper = mountComponent({
loading: false,
participants: PARTICIPANT_LIST,
numberOfLessParticipants,
});
vm.isShowingMoreParticipants = false;
Vue.nextTick()
.then(() => {
const participantEls = vm.$el.querySelectorAll('.js-participants-author');
wrapper.setData({
isShowingMoreParticipants: false,
});
expect(participantEls.length).toBe(numberOfLessParticipants);
})
.then(done)
.catch(done.fail);
return Vue.nextTick().then(() => {
expect(wrapper.findAll('.participants-author').length).toBe(numberOfLessParticipants);
});
});
it('when only showing all participants, each has an avatar', done => {
const numberOfLessParticipants = 2;
vm = mountComponent(Participants, {
it('when only showing all participants, each has an avatar', () => {
wrapper = mountComponent({
loading: false,
participants: PARTICIPANT_LIST,
numberOfLessParticipants,
numberOfLessParticipants: 2,
});
vm.isShowingMoreParticipants = true;
Vue.nextTick()
.then(() => {
const participantEls = vm.$el.querySelectorAll('.js-participants-author');
wrapper.setData({
isShowingMoreParticipants: true,
});
expect(participantEls.length).toBe(PARTICIPANT_LIST.length);
})
.then(done)
.catch(done.fail);
return Vue.nextTick().then(() => {
expect(wrapper.findAll('.participants-author').length).toBe(PARTICIPANT_LIST.length);
});
});
it('does not have more participants link when they can all be shown', () => {
const numberOfLessParticipants = 100;
vm = mountComponent(Participants, {
wrapper = mountComponent({
loading: false,
participants: PARTICIPANT_LIST,
numberOfLessParticipants,
});
const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
expect(PARTICIPANT_LIST.length).toBeLessThan(numberOfLessParticipants);
expect(moreParticipantLink).toBeNull();
expect(getMoreParticipantsButton().exists()).toBe(false);
});
it('when too many participants, has more participants link to show more', done => {
vm = mountComponent(Participants, {
it('when too many participants, has more participants link to show more', () => {
wrapper = mountComponent({
loading: false,
participants: PARTICIPANT_LIST,
numberOfLessParticipants: 2,
});
vm.isShowingMoreParticipants = false;
Vue.nextTick()
.then(() => {
const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
wrapper.setData({
isShowingMoreParticipants: false,
});
expect(moreParticipantLink.textContent.trim()).toBe('+ 1 more');
})
.then(done)
.catch(done.fail);
return Vue.nextTick().then(() => {
expect(getMoreParticipantsButton().text()).toBe('+ 1 more');
});
});
it('when too many participants and already showing them, has more participants link to show less', done => {
vm = mountComponent(Participants, {
it('when too many participants and already showing them, has more participants link to show less', () => {
wrapper = mountComponent({
loading: false,
participants: PARTICIPANT_LIST,
numberOfLessParticipants: 2,
});
vm.isShowingMoreParticipants = true;
Vue.nextTick()
.then(() => {
const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
wrapper.setData({
isShowingMoreParticipants: true,
});
expect(moreParticipantLink.textContent.trim()).toBe('- show less');
})
.then(done)
.catch(done.fail);
return Vue.nextTick().then(() => {
expect(getMoreParticipantsButton().text()).toBe('- show less');
});
});
it('clicking more participants link emits event', () => {
vm = mountComponent(Participants, {
wrapper = mountComponent({
loading: false,
participants: PARTICIPANT_LIST,
numberOfLessParticipants: 2,
});
const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
expect(vm.isShowingMoreParticipants).toBe(false);
expect(wrapper.vm.isShowingMoreParticipants).toBe(false);
moreParticipantLink.click();
getMoreParticipantsButton().trigger('click');
expect(vm.isShowingMoreParticipants).toBe(true);
expect(wrapper.vm.isShowingMoreParticipants).toBe(true);
});
it('clicking on participants icon emits `toggleSidebar` event', () => {
vm = mountComponent(Participants, {
wrapper = mountComponent({
loading: false,
participants: PARTICIPANT_LIST,
numberOfLessParticipants: 2,
});
spyOn(vm, '$emit');
const participantsIconEl = vm.$el.querySelector('.sidebar-collapsed-icon');
const spy = jest.spyOn(wrapper.vm, '$emit');
participantsIconEl.click();
wrapper.find('.sidebar-collapsed-icon').trigger('click');
expect(vm.$emit).toHaveBeenCalledWith('toggleSidebar');
return Vue.nextTick(() => {
expect(spy).toHaveBeenCalledWith('toggleSidebar');
spy.mockRestore();
});
});
});
describe('when not showing participants label', () => {
beforeEach(() => {
vm = mountComponent(Participants, {
wrapper = mountComponent({
participants: PARTICIPANT_LIST,
showParticipantLabel: false,
});
});
it('does not show sidebar collapsed icon', () => {
expect(vm.$el.querySelector('.sidebar-collapsed-icon')).not.toBeTruthy();
expect(wrapper.find('.sidebar-collapsed-icon').exists()).toBe(false);
});
it('does not show participants label title', () => {
expect(vm.$el.querySelector('.title')).not.toBeTruthy();
expect(wrapper.find('.title').exists()).toBe(false);
});
});
});
spec/javascripts/sidebar/sidebar_mediator_spec.js → spec/frontend/sidebar/sidebar_mediator_spec.js
View file @ c80fac8b
import MockAdapter from 'axios-mock-adapter';
import axios from '~/lib/utils/axios_utils';
import * as urlUtility from '~/lib/utils/url_utility';
import SidebarService, { gqClient } from '~/sidebar/services/sidebar_service';
import SidebarMediator from '~/sidebar/sidebar_mediator';
import SidebarStore from '~/sidebar/stores/sidebar_store';
import SidebarService, { gqClient } from '~/sidebar/services/sidebar_service';
import Mock from './mock_data';
const { mediator: mediatorMockData } = Mock;
describe('Sidebar mediator', function() {
describe('Sidebar mediator', () => {
const { mediator: mediatorMockData } = Mock;
let mock;
let mediator;
beforeEach(() => {
mock = new MockAdapter(axios);
this.mediator = new SidebarMediator(mediatorMockData);
mediator = new SidebarMediator(mediatorMockData);
});
afterEach(() => {
......@@ -24,111 +24,112 @@ describe('Sidebar mediator', function() {
});
it('assigns yourself ', () => {
this.mediator.assignYourself();
mediator.assignYourself();
expect(this.mediator.store.currentUser).toEqual(mediatorMockData.currentUser);
expect(this.mediator.store.assignees[0]).toEqual(mediatorMockData.currentUser);
expect(mediator.store.currentUser).toEqual(mediatorMockData.currentUser);
expect(mediator.store.assignees[0]).toEqual(mediatorMockData.currentUser);
});
it('saves assignees', done => {
it('saves assignees', () => {
mock.onPut(mediatorMockData.endpoint).reply(200, {});
this.mediator
.saveAssignees('issue[assignee_ids]')
.then(resp => {
expect(resp.status).toEqual(200);
done();
})
.catch(done.fail);
return mediator.saveAssignees('issue[assignee_ids]').then(resp => {
expect(resp.status).toEqual(200);
});
});
it('fetches the data', done => {
it('fetches the data', () => {
const mockData = Mock.responseMap.GET[mediatorMockData.endpoint];
mock.onGet(mediatorMockData.endpoint).reply(200, mockData);
const mockGraphQlData = Mock.graphQlResponseData;
spyOn(gqClient, 'query').and.returnValue({
const graphQlSpy = jest.spyOn(gqClient, 'query').mockReturnValue({
data: mockGraphQlData,
});
const spy = jest.spyOn(mediator, 'processFetchedData').mockReturnValue(Promise.resolve());
spyOn(this.mediator, 'processFetchedData').and.callThrough();
return mediator.fetch().then(() => {
expect(spy).toHaveBeenCalledWith(mockData, mockGraphQlData);
this.mediator
.fetch()
.then(() => {
expect(this.mediator.processFetchedData).toHaveBeenCalledWith(mockData, mockGraphQlData);
})
.then(done)
.catch(done.fail);
spy.mockRestore();
graphQlSpy.mockRestore();
});
});
it('processes fetched data', () => {
const mockData = Mock.responseMap.GET[mediatorMockData.endpoint];
this.mediator.processFetchedData(mockData);
expect(this.mediator.store.assignees).toEqual(mockData.assignees);
expect(this.mediator.store.humanTimeEstimate).toEqual(mockData.human_time_estimate);
expect(this.mediator.store.humanTotalTimeSpent).toEqual(mockData.human_total_time_spent);
expect(this.mediator.store.participants).toEqual(mockData.participants);
expect(this.mediator.store.subscribed).toEqual(mockData.subscribed);
expect(this.mediator.store.timeEstimate).toEqual(mockData.time_estimate);
expect(this.mediator.store.totalTimeSpent).toEqual(mockData.total_time_spent);
mediator.processFetchedData(mockData);
expect(mediator.store.assignees).toEqual(mockData.assignees);
expect(mediator.store.humanTimeEstimate).toEqual(mockData.human_time_estimate);
expect(mediator.store.humanTotalTimeSpent).toEqual(mockData.human_total_time_spent);
expect(mediator.store.participants).toEqual(mockData.participants);
expect(mediator.store.subscribed).toEqual(mockData.subscribed);
expect(mediator.store.timeEstimate).toEqual(mockData.time_estimate);
expect(mediator.store.totalTimeSpent).toEqual(mockData.total_time_spent);
});
it('sets moveToProjectId', () => {
const projectId = 7;
spyOn(this.mediator.store, 'setMoveToProjectId').and.callThrough();
const spy = jest.spyOn(mediator.store, 'setMoveToProjectId').mockReturnValue(Promise.resolve());
this.mediator.setMoveToProjectId(projectId);
mediator.setMoveToProjectId(projectId);
expect(this.mediator.store.setMoveToProjectId).toHaveBeenCalledWith(projectId);
expect(spy).toHaveBeenCalledWith(projectId);
spy.mockRestore();
});
it('fetches autocomplete projects', done => {
it('fetches autocomplete projects', () => {
const searchTerm = 'foo';
mock.onGet(mediatorMockData.projectsAutocompleteEndpoint).reply(200, {});
spyOn(this.mediator.service, 'getProjectsAutocomplete').and.callThrough();
spyOn(this.mediator.store, 'setAutocompleteProjects').and.callThrough();
this.mediator
.fetchAutocompleteProjects(searchTerm)
.then(() => {
expect(this.mediator.service.getProjectsAutocomplete).toHaveBeenCalledWith(searchTerm);
expect(this.mediator.store.setAutocompleteProjects).toHaveBeenCalled();
})
.then(done)
.catch(done.fail);
const getterSpy = jest
.spyOn(mediator.service, 'getProjectsAutocomplete')
.mockReturnValue(Promise.resolve({ data: {} }));
const setterSpy = jest
.spyOn(mediator.store, 'setAutocompleteProjects')
.mockReturnValue(Promise.resolve());
return mediator.fetchAutocompleteProjects(searchTerm).then(() => {
expect(getterSpy).toHaveBeenCalledWith(searchTerm);
expect(setterSpy).toHaveBeenCalled();
getterSpy.mockRestore();
setterSpy.mockRestore();
});
});
it('moves issue', done => {
it('moves issue', () => {
const mockData = Mock.responseMap.POST[mediatorMockData.moveIssueEndpoint];
const moveToProjectId = 7;
mock.onPost(mediatorMockData.moveIssueEndpoint).reply(200, mockData);
this.mediator.store.setMoveToProjectId(moveToProjectId);
spyOn(this.mediator.service, 'moveIssue').and.callThrough();
const visitUrl = spyOnDependency(SidebarMediator, 'visitUrl');
this.mediator
.moveIssue()
.then(() => {
expect(this.mediator.service.moveIssue).toHaveBeenCalledWith(moveToProjectId);
expect(visitUrl).toHaveBeenCalledWith(mockData.web_url);
})
.then(done)
.catch(done.fail);
mediator.store.setMoveToProjectId(moveToProjectId);
const moveIssueSpy = jest
.spyOn(mediator.service, 'moveIssue')
.mockReturnValue(Promise.resolve({ data: { web_url: mockData.web_url } }));
const urlSpy = jest.spyOn(urlUtility, 'visitUrl').mockReturnValue({});
return mediator.moveIssue().then(() => {
expect(moveIssueSpy).toHaveBeenCalledWith(moveToProjectId);
expect(urlSpy).toHaveBeenCalledWith(mockData.web_url);
moveIssueSpy.mockRestore();
urlSpy.mockRestore();
});
});
it('toggle subscription', done => {
this.mediator.store.setSubscribedState(false);
it('toggle subscription', () => {
mediator.store.setSubscribedState(false);
mock.onPost(mediatorMockData.toggleSubscriptionEndpoint).reply(200, {});
spyOn(this.mediator.service, 'toggleSubscription').and.callThrough();
this.mediator
.toggleSubscription()
.then(() => {
expect(this.mediator.service.toggleSubscription).toHaveBeenCalled();
expect(this.mediator.store.subscribed).toEqual(true);
})
.then(done)
.catch(done.fail);
const spy = jest
.spyOn(mediator.service, 'toggleSubscription')
.mockReturnValue(Promise.resolve());
return mediator.toggleSubscription().then(() => {
expect(spy).toHaveBeenCalled();
expect(mediator.store.subscribed).toEqual(true);
spy.mockRestore();
});
});
});
spec/javascripts/sidebar/sidebar_subscriptions_spec.js → spec/frontend/sidebar/sidebar_subscriptions_spec.js
View file @ c80fac8b
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import sidebarSubscriptions from '~/sidebar/components/subscriptions/sidebar_subscriptions.vue';
import { shallowMount } from '@vue/test-utils';
import SidebarSubscriptions from '~/sidebar/components/subscriptions/sidebar_subscriptions.vue';
import SidebarMediator from '~/sidebar/sidebar_mediator';
import SidebarService from '~/sidebar/services/sidebar_service';
import SidebarStore from '~/sidebar/stores/sidebar_store';
import Mock from './mock_data';
describe('Sidebar Subscriptions', function() {
let vm;
let SidebarSubscriptions;
describe('Sidebar Subscriptions', () => {
let wrapper;
let mediator;
beforeEach(() => {
SidebarSubscriptions = Vue.extend(sidebarSubscriptions);
// Set up the stores, services, etc
// eslint-disable-next-line no-new
new SidebarMediator(Mock.mediator);
mediator = new SidebarMediator(Mock.mediator);
wrapper = shallowMount(SidebarSubscriptions, {
propsData: {
mediator,
},
});
});
afterEach(() => {
vm.$destroy();
wrapper.destroy();
SidebarService.singleton = null;
SidebarStore.singleton = null;
SidebarMediator.singleton = null;
});
it('calls the mediator toggleSubscription on event', () => {
const mediator = new SidebarMediator();
spyOn(mediator, 'toggleSubscription').and.returnValue(Promise.resolve());
vm = mountComponent(SidebarSubscriptions, {
mediator,
});
const spy = jest.spyOn(mediator, 'toggleSubscription').mockReturnValue(Promise.resolve());
vm.onToggleSubscription();
wrapper.vm.onToggleSubscription();
expect(mediator.toggleSubscription).toHaveBeenCalled();
expect(spy).toHaveBeenCalled();
spy.mockRestore();
});
});
spec/javascripts/sidebar/subscriptions_spec.js → spec/frontend/sidebar/subscriptions_spec.js
View file @ c80fac8b
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import { mockTracking } from 'spec/helpers/tracking_helper';
import subscriptions from '~/sidebar/components/subscriptions/subscriptions.vue';
import { shallowMount } from '@vue/test-utils';
import Subscriptions from '~/sidebar/components/subscriptions/subscriptions.vue';
import eventHub from '~/sidebar/event_hub';
import ToggleButton from '~/vue_shared/components/toggle_button.vue';
describe('Subscriptions', function() {
let vm;
let Subscriptions;
describe('Subscriptions', () => {
let wrapper;
beforeEach(() => {
Subscriptions = Vue.extend(subscriptions);
});
const findToggleButton = () => wrapper.find(ToggleButton);
const mountComponent = propsData =>
shallowMount(Subscriptions, {
propsData,
});
afterEach(() => {
vm.$destroy();
wrapper.destroy();
wrapper = null;
});
it('shows loading spinner when loading', () => {
vm = mountComponent(Subscriptions, {
wrapper = mountComponent({
loading: true,
subscribed: undefined,
});
expect(vm.$refs.toggleButton.isLoading).toBe(true);
expect(vm.$refs.toggleButton.$el.querySelector('.project-feature-toggle')).toHaveClass(
'is-loading',
);
expect(findToggleButton().attributes('isloading')).toBe('true');
});
it('is toggled "off" when currently not subscribed', () => {
vm = mountComponent(Subscriptions, {
wrapper = mountComponent({
subscribed: false,
});
expect(vm.$refs.toggleButton.$el.querySelector('.project-feature-toggle')).not.toHaveClass(
'is-checked',
);
expect(findToggleButton().attributes('value')).toBeFalsy();
});
it('is toggled "on" when currently subscribed', () => {
vm = mountComponent(Subscriptions, {
wrapper = mountComponent({
subscribed: true,
});
expect(vm.$refs.toggleButton.$el.querySelector('.project-feature-toggle')).toHaveClass(
'is-checked',
);
expect(findToggleButton().attributes('value')).toBe('true');
});
it('toggleSubscription method emits `toggleSubscription` event on eventHub and Component', () => {
vm = mountComponent(Subscriptions, { subscribed: true });
spyOn(eventHub, '$emit');
spyOn(vm, '$emit');
spyOn(vm, 'track');
const id = 42;
wrapper = mountComponent({ subscribed: true, id });
const eventHubSpy = jest.spyOn(eventHub, '$emit');
const wrapperEmitSpy = jest.spyOn(wrapper.vm, '$emit');
vm.toggleSubscription();
wrapper.vm.toggleSubscription();
expect(eventHub.$emit).toHaveBeenCalledWith('toggleSubscription', jasmine.any(Object));
expect(vm.$emit).toHaveBeenCalledWith('toggleSubscription', jasmine.any(Object));
expect(eventHubSpy).toHaveBeenCalledWith('toggleSubscription', id);
expect(wrapperEmitSpy).toHaveBeenCalledWith('toggleSubscription', id);
eventHubSpy.mockRestore();
wrapperEmitSpy.mockRestore();
});
it('tracks the event when toggled', () => {
vm = mountComponent(Subscriptions, { subscribed: true });
const spy = mockTracking('_category_', vm.$el, spyOn);
vm.toggleSubscription();
wrapper = mountComponent({ subscribed: true });
// const spy = mockTracking('_category_', wrapper.element, jest.spyOn);
const wrapperTrackSpy = jest.spyOn(wrapper.vm, 'track');
expect(spy).toHaveBeenCalled();
wrapper.vm.toggleSubscription();
expect(wrapperTrackSpy).toHaveBeenCalledWith('toggle_button', {
property: 'notifications',
value: 0,
});
wrapperTrackSpy.mockRestore();
});
it('onClickCollapsedIcon method emits `toggleSidebar` event on component', () => {
vm = mountComponent(Subscriptions, { subscribed: true });
spyOn(vm, '$emit');
wrapper = mountComponent({ subscribed: true });
const spy = jest.spyOn(wrapper.vm, '$emit');
vm.onClickCollapsedIcon();
wrapper.vm.onClickCollapsedIcon();
expect(vm.$emit).toHaveBeenCalledWith('toggleSidebar');
expect(spy).toHaveBeenCalledWith('toggleSidebar');
spy.mockRestore();
});
describe('given project emails are disabled', () => {
const subscribeDisabledDescription = 'Notifications have been disabled';
beforeEach(() => {
vm = mountComponent(Subscriptions, {
wrapper = mountComponent({
subscribed: false,
projectEmailsDisabled: true,
subscribeDisabledDescription,
......@@ -89,12 +94,14 @@ describe('Subscriptions', function() {
});
it('sets the correct display text', () => {
expect(vm.$el.textContent).toContain(subscribeDisabledDescription);
expect(vm.$refs.tooltip.dataset.originalTitle).toBe(subscribeDisabledDescription);
expect(wrapper.find('.issuable-header-text').text()).toContain(subscribeDisabledDescription);
expect(wrapper.find({ ref: 'tooltip' }).attributes('data-original-title')).toBe(
subscribeDisabledDescription,
);
});
it('does not render the toggle button', () => {
expect(vm.$refs.toggleButton).toBeUndefined();
expect(wrapper.find('.js-issuable-subscribe-button').exists()).toBe(false);
});
});
});
spec/javascripts/sidebar/lock/edit_form_buttons_spec.js deleted 100644 → 0
View file @ b26e9115
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import editFormButtons from '~/sidebar/components/lock/edit_form_buttons.vue';
describe('EditFormButtons', () => {
let vm1;
let vm2;
beforeEach(() => {
const Component = Vue.extend(editFormButtons);
const toggleForm = () => {};
const updateLockedAttribute = () => {};
vm1 = mountComponent(Component, {
isLocked: true,
toggleForm,
updateLockedAttribute,
});
vm2 = mountComponent(Component, {
isLocked: false,
toggleForm,
updateLockedAttribute,
});
});
it('renders unlock or lock text based on locked state', () => {
expect(vm1.$el.innerHTML.includes('Unlock')).toBe(true);
expect(vm2.$el.innerHTML.includes('Lock')).toBe(true);
});
});
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