summaryrefslogtreecommitdiff
path: root/spec/javascripts/sidebar
diff options
context:
space:
mode:
Diffstat (limited to 'spec/javascripts/sidebar')
-rw-r--r--spec/javascripts/sidebar/components/time_tracking/time_tracker_spec.js278
-rw-r--r--spec/javascripts/sidebar/lock/edit_form_buttons_spec.js32
-rw-r--r--spec/javascripts/sidebar/lock/lock_issue_sidebar_spec.js99
-rw-r--r--spec/javascripts/sidebar/mock_data.js7
-rw-r--r--spec/javascripts/sidebar/participants_spec.js202
-rw-r--r--spec/javascripts/sidebar/sidebar_mediator_spec.js134
-rw-r--r--spec/javascripts/sidebar/sidebar_move_issue_spec.js166
-rw-r--r--spec/javascripts/sidebar/sidebar_subscriptions_spec.js38
-rw-r--r--spec/javascripts/sidebar/subscriptions_spec.js100
9 files changed, 0 insertions, 1056 deletions
diff --git a/spec/javascripts/sidebar/components/time_tracking/time_tracker_spec.js b/spec/javascripts/sidebar/components/time_tracking/time_tracker_spec.js
deleted file mode 100644
index 1580f32cfca..00000000000
--- a/spec/javascripts/sidebar/components/time_tracking/time_tracker_spec.js
+++ /dev/null
@@ -1,278 +0,0 @@
-import Vue from 'vue';
-
-import mountComponent from 'spec/helpers/vue_mount_component_helper';
-import TimeTracker from '~/sidebar/components/time_tracking/time_tracker.vue';
-
-describe('Issuable Time Tracker', () => {
- let initialData;
- let vm;
-
- const initTimeTrackingComponent = ({
- timeEstimate,
- timeSpent,
- timeEstimateHumanReadable,
- timeSpentHumanReadable,
- limitToHours,
- }) => {
- setFixtures(`
- <div>
- <div id="mock-container"></div>
- </div>
- `);
-
- initialData = {
- timeEstimate,
- timeSpent,
- humanTimeEstimate: timeEstimateHumanReadable,
- humanTimeSpent: timeSpentHumanReadable,
- limitToHours: Boolean(limitToHours),
- rootPath: '/',
- };
-
- const TimeTrackingComponent = Vue.extend({
- ...TimeTracker,
- components: {
- ...TimeTracker.components,
- transition: {
- // disable animations
- template: '<div><slot></slot></div>',
- },
- },
- });
- vm = mountComponent(TimeTrackingComponent, initialData, '#mock-container');
- };
-
- afterEach(() => {
- vm.$destroy();
- });
-
- describe('Initialization', () => {
- beforeEach(() => {
- initTimeTrackingComponent({
- timeEstimate: 10000, // 2h 46m
- timeSpent: 5000, // 1h 23m
- timeEstimateHumanReadable: '2h 46m',
- timeSpentHumanReadable: '1h 23m',
- });
- });
-
- it('should return something defined', () => {
- expect(vm).toBeDefined();
- });
-
- it('should correctly set timeEstimate', done => {
- Vue.nextTick(() => {
- expect(vm.timeEstimate).toBe(initialData.timeEstimate);
- done();
- });
- });
-
- it('should correctly set time_spent', done => {
- Vue.nextTick(() => {
- expect(vm.timeSpent).toBe(initialData.timeSpent);
- done();
- });
- });
- });
-
- describe('Content Display', () => {
- describe('Panes', () => {
- describe('Comparison pane', () => {
- beforeEach(() => {
- initTimeTrackingComponent({
- timeEstimate: 100000, // 1d 3h
- timeSpent: 5000, // 1h 23m
- timeEstimateHumanReadable: '1d 3h',
- timeSpentHumanReadable: '1h 23m',
- });
- });
-
- it('should show the "Comparison" pane when timeEstimate and time_spent are truthy', done => {
- Vue.nextTick(() => {
- expect(vm.showComparisonState).toBe(true);
- const $comparisonPane = vm.$el.querySelector('.time-tracking-comparison-pane');
-
- expect($comparisonPane).toBeVisible();
- done();
- });
- });
-
- it('should show full times when the sidebar is collapsed', done => {
- Vue.nextTick(() => {
- const timeTrackingText = vm.$el.querySelector('.time-tracking-collapsed-summary span')
- .innerText;
-
- expect(timeTrackingText).toBe('1h 23m / 1d 3h');
- done();
- });
- });
-
- describe('Remaining meter', () => {
- it('should display the remaining meter with the correct width', done => {
- Vue.nextTick(() => {
- expect(
- vm.$el.querySelector('.time-tracking-comparison-pane .progress[value="5"]'),
- ).not.toBeNull();
- done();
- });
- });
-
- it('should display the remaining meter with the correct background color when within estimate', done => {
- Vue.nextTick(() => {
- expect(
- vm.$el.querySelector('.time-tracking-comparison-pane .progress[variant="primary"]'),
- ).not.toBeNull();
- done();
- });
- });
-
- it('should display the remaining meter with the correct background color when over estimate', done => {
- vm.timeEstimate = 10000; // 2h 46m
- vm.timeSpent = 20000000; // 231 days
- Vue.nextTick(() => {
- expect(
- vm.$el.querySelector('.time-tracking-comparison-pane .progress[variant="danger"]'),
- ).not.toBeNull();
- done();
- });
- });
- });
- });
-
- describe('Comparison pane when limitToHours is true', () => {
- beforeEach(() => {
- initTimeTrackingComponent({
- timeEstimate: 100000, // 1d 3h
- timeSpent: 5000, // 1h 23m
- timeEstimateHumanReadable: '',
- timeSpentHumanReadable: '',
- limitToHours: true,
- });
- });
-
- it('should show the correct tooltip text', done => {
- Vue.nextTick(() => {
- expect(vm.showComparisonState).toBe(true);
- const $title = vm.$el.querySelector('.time-tracking-content .compare-meter').dataset
- .originalTitle;
-
- expect($title).toBe('Time remaining: 26h 23m');
- done();
- });
- });
- });
-
- describe('Estimate only pane', () => {
- beforeEach(() => {
- initTimeTrackingComponent({
- timeEstimate: 10000, // 2h 46m
- timeSpent: 0,
- timeEstimateHumanReadable: '2h 46m',
- timeSpentHumanReadable: '',
- });
- });
-
- it('should display the human readable version of time estimated', done => {
- Vue.nextTick(() => {
- const estimateText = vm.$el.querySelector('.time-tracking-estimate-only-pane')
- .innerText;
- const correctText = 'Estimated: 2h 46m';
-
- expect(estimateText).toBe(correctText);
- done();
- });
- });
- });
-
- describe('Spent only pane', () => {
- beforeEach(() => {
- initTimeTrackingComponent({
- timeEstimate: 0,
- timeSpent: 5000, // 1h 23m
- timeEstimateHumanReadable: '2h 46m',
- timeSpentHumanReadable: '1h 23m',
- });
- });
-
- it('should display the human readable version of time spent', done => {
- Vue.nextTick(() => {
- const spentText = vm.$el.querySelector('.time-tracking-spend-only-pane').innerText;
- const correctText = 'Spent: 1h 23m';
-
- expect(spentText).toBe(correctText);
- done();
- });
- });
- });
-
- describe('No time tracking pane', () => {
- beforeEach(() => {
- initTimeTrackingComponent({
- timeEstimate: 0,
- timeSpent: 0,
- timeEstimateHumanReadable: '',
- timeSpentHumanReadable: '',
- });
- });
-
- it('should only show the "No time tracking" pane when both timeEstimate and time_spent are falsey', done => {
- Vue.nextTick(() => {
- const $noTrackingPane = vm.$el.querySelector('.time-tracking-no-tracking-pane');
- const noTrackingText = $noTrackingPane.innerText;
- const correctText = 'No estimate or time spent';
-
- expect(vm.showNoTimeTrackingState).toBe(true);
- expect($noTrackingPane).toBeVisible();
- expect(noTrackingText).toBe(correctText);
- done();
- });
- });
- });
-
- describe('Help pane', () => {
- const helpButton = () => vm.$el.querySelector('.help-button');
- const closeHelpButton = () => vm.$el.querySelector('.close-help-button');
- const helpPane = () => vm.$el.querySelector('.time-tracking-help-state');
-
- beforeEach(done => {
- initTimeTrackingComponent({ timeEstimate: 0, timeSpent: 0 });
-
- Vue.nextTick()
- .then(done)
- .catch(done.fail);
- });
-
- it('should not show the "Help" pane by default', () => {
- expect(vm.showHelpState).toBe(false);
- expect(helpPane()).toBeNull();
- });
-
- it('should show the "Help" pane when help button is clicked', done => {
- helpButton().click();
-
- Vue.nextTick()
- .then(() => {
- expect(vm.showHelpState).toBe(true);
- expect(helpPane()).toBeVisible();
- })
- .then(done)
- .catch(done.fail);
- });
-
- it('should not show the "Help" pane when help button is clicked and then closed', done => {
- helpButton().click();
-
- Vue.nextTick()
- .then(() => closeHelpButton().click())
- .then(() => Vue.nextTick())
- .then(() => {
- expect(vm.showHelpState).toBe(false);
- expect(helpPane()).toBeNull();
- })
- .then(done)
- .catch(done.fail);
- });
- });
- });
- });
-});
diff --git a/spec/javascripts/sidebar/lock/edit_form_buttons_spec.js b/spec/javascripts/sidebar/lock/edit_form_buttons_spec.js
deleted file mode 100644
index c532554efb4..00000000000
--- a/spec/javascripts/sidebar/lock/edit_form_buttons_spec.js
+++ /dev/null
@@ -1,32 +0,0 @@
-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);
- });
-});
diff --git a/spec/javascripts/sidebar/lock/lock_issue_sidebar_spec.js b/spec/javascripts/sidebar/lock/lock_issue_sidebar_spec.js
deleted file mode 100644
index 5296908afe2..00000000000
--- a/spec/javascripts/sidebar/lock/lock_issue_sidebar_spec.js
+++ /dev/null
@@ -1,99 +0,0 @@
-import Vue from 'vue';
-import { mockTracking, triggerEvent } from 'spec/helpers/tracking_helper';
-import lockIssueSidebar from '~/sidebar/components/lock/lock_issue_sidebar.vue';
-
-describe('LockIssueSidebar', () => {
- let vm1;
- let vm2;
-
- beforeEach(() => {
- const Component = Vue.extend(lockIssueSidebar);
-
- const mediator = {
- service: {
- update: Promise.resolve(true),
- },
-
- store: {
- isLockDialogOpen: false,
- },
- };
-
- vm1 = new Component({
- propsData: {
- isLocked: true,
- isEditable: true,
- mediator,
- issuableType: 'issue',
- },
- }).$mount();
-
- vm2 = new Component({
- propsData: {
- isLocked: false,
- isEditable: false,
- mediator,
- issuableType: 'merge_request',
- },
- }).$mount();
- });
-
- it('shows if locked and/or editable', () => {
- expect(vm1.$el.innerHTML.includes('Edit')).toBe(true);
-
- expect(vm1.$el.innerHTML.includes('Locked')).toBe(true);
-
- expect(vm2.$el.innerHTML.includes('Unlocked')).toBe(true);
- });
-
- it('displays the edit form when editable', done => {
- expect(vm1.isLockDialogOpen).toBe(false);
-
- vm1.$el.querySelector('.lock-edit').click();
-
- expect(vm1.isLockDialogOpen).toBe(true);
-
- vm1.$nextTick(() => {
- expect(vm1.$el.innerHTML.includes('Unlock this issue?')).toBe(true);
-
- done();
- });
- });
-
- it('tracks an event when "Edit" is clicked', () => {
- const spy = mockTracking('_category_', vm1.$el, spyOn);
- triggerEvent('.lock-edit');
-
- expect(spy).toHaveBeenCalledWith('_category_', 'click_edit_button', {
- label: 'right_sidebar',
- property: 'lock_issue',
- });
- });
-
- it('displays the edit form when opened from collapsed state', done => {
- expect(vm1.isLockDialogOpen).toBe(false);
-
- vm1.$el.querySelector('.sidebar-collapsed-icon').click();
-
- expect(vm1.isLockDialogOpen).toBe(true);
-
- setTimeout(() => {
- expect(vm1.$el.innerHTML.includes('Unlock this issue?')).toBe(true);
-
- done();
- });
- });
-
- it('does not display the edit form when opened from collapsed state if not editable', done => {
- expect(vm2.isLockDialogOpen).toBe(false);
-
- vm2.$el.querySelector('.sidebar-collapsed-icon').click();
-
- Vue.nextTick()
- .then(() => {
- expect(vm2.isLockDialogOpen).toBe(false);
- })
- .then(done)
- .catch(done.fail);
- });
-});
diff --git a/spec/javascripts/sidebar/mock_data.js b/spec/javascripts/sidebar/mock_data.js
deleted file mode 100644
index c869ff96933..00000000000
--- a/spec/javascripts/sidebar/mock_data.js
+++ /dev/null
@@ -1,7 +0,0 @@
-// No new code should be added to this file. Instead, modify the
-// file this one re-exports from. For more detail about why, see:
-// https://gitlab.com/gitlab-org/gitlab-foss/merge_requests/31349
-
-import mockData from '../../../spec/frontend/sidebar/mock_data';
-
-export default mockData;
diff --git a/spec/javascripts/sidebar/participants_spec.js b/spec/javascripts/sidebar/participants_spec.js
deleted file mode 100644
index 7e80e86f8ca..00000000000
--- a/spec/javascripts/sidebar/participants_spec.js
+++ /dev/null
@@ -1,202 +0,0 @@
-import Vue from 'vue';
-import mountComponent from 'spec/helpers/vue_mount_component_helper';
-import participants from '~/sidebar/components/participants/participants.vue';
-
-const PARTICIPANT = {
- id: 1,
- state: 'active',
- username: 'marcene',
- name: 'Allie Will',
- web_url: 'foo.com',
- avatar_url: 'gravatar.com/avatar/xxx',
-};
-
-const PARTICIPANT_LIST = [PARTICIPANT, { ...PARTICIPANT, id: 2 }, { ...PARTICIPANT, id: 3 }];
-
-describe('Participants', function() {
- let vm;
- let Participants;
-
- beforeEach(() => {
- Participants = Vue.extend(participants);
- });
-
- afterEach(() => {
- vm.$destroy();
- });
-
- describe('collapsed sidebar state', () => {
- it('shows loading spinner when loading', () => {
- vm = mountComponent(Participants, {
- loading: true,
- });
-
- expect(vm.$el.querySelector('.js-participants-collapsed-loading-icon')).toBeDefined();
- });
-
- it('shows participant count when given', () => {
- vm = mountComponent(Participants, {
- loading: false,
- participants: PARTICIPANT_LIST,
- });
- const countEl = vm.$el.querySelector('.js-participants-collapsed-count');
-
- expect(countEl.textContent.trim()).toBe(`${PARTICIPANT_LIST.length}`);
- });
-
- it('shows full participant count when there are hidden participants', () => {
- vm = mountComponent(Participants, {
- loading: false,
- participants: PARTICIPANT_LIST,
- numberOfLessParticipants: 1,
- });
- const countEl = vm.$el.querySelector('.js-participants-collapsed-count');
-
- expect(countEl.textContent.trim()).toBe(`${PARTICIPANT_LIST.length}`);
- });
- });
-
- describe('expanded sidebar state', () => {
- it('shows loading spinner when loading', () => {
- vm = mountComponent(Participants, {
- loading: true,
- });
-
- expect(vm.$el.querySelector('.js-participants-expanded-loading-icon')).toBeDefined();
- });
-
- it('when only showing visible participants, shows an avatar only for each participant under the limit', done => {
- const numberOfLessParticipants = 2;
- vm = mountComponent(Participants, {
- loading: false,
- participants: PARTICIPANT_LIST,
- numberOfLessParticipants,
- });
- vm.isShowingMoreParticipants = false;
-
- Vue.nextTick()
- .then(() => {
- const participantEls = vm.$el.querySelectorAll('.js-participants-author');
-
- expect(participantEls.length).toBe(numberOfLessParticipants);
- })
- .then(done)
- .catch(done.fail);
- });
-
- it('when only showing all participants, each has an avatar', done => {
- const numberOfLessParticipants = 2;
- vm = mountComponent(Participants, {
- loading: false,
- participants: PARTICIPANT_LIST,
- numberOfLessParticipants,
- });
- vm.isShowingMoreParticipants = true;
-
- Vue.nextTick()
- .then(() => {
- const participantEls = vm.$el.querySelectorAll('.js-participants-author');
-
- expect(participantEls.length).toBe(PARTICIPANT_LIST.length);
- })
- .then(done)
- .catch(done.fail);
- });
-
- it('does not have more participants link when they can all be shown', () => {
- const numberOfLessParticipants = 100;
- vm = mountComponent(Participants, {
- loading: false,
- participants: PARTICIPANT_LIST,
- numberOfLessParticipants,
- });
- const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
-
- expect(PARTICIPANT_LIST.length).toBeLessThan(numberOfLessParticipants);
- expect(moreParticipantLink).toBeNull();
- });
-
- it('when too many participants, has more participants link to show more', done => {
- vm = mountComponent(Participants, {
- loading: false,
- participants: PARTICIPANT_LIST,
- numberOfLessParticipants: 2,
- });
- vm.isShowingMoreParticipants = false;
-
- Vue.nextTick()
- .then(() => {
- const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
-
- expect(moreParticipantLink.textContent.trim()).toBe('+ 1 more');
- })
- .then(done)
- .catch(done.fail);
- });
-
- it('when too many participants and already showing them, has more participants link to show less', done => {
- vm = mountComponent(Participants, {
- loading: false,
- participants: PARTICIPANT_LIST,
- numberOfLessParticipants: 2,
- });
- vm.isShowingMoreParticipants = true;
-
- Vue.nextTick()
- .then(() => {
- const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
-
- expect(moreParticipantLink.textContent.trim()).toBe('- show less');
- })
- .then(done)
- .catch(done.fail);
- });
-
- it('clicking more participants link emits event', () => {
- vm = mountComponent(Participants, {
- loading: false,
- participants: PARTICIPANT_LIST,
- numberOfLessParticipants: 2,
- });
- const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
-
- expect(vm.isShowingMoreParticipants).toBe(false);
-
- moreParticipantLink.click();
-
- expect(vm.isShowingMoreParticipants).toBe(true);
- });
-
- it('clicking on participants icon emits `toggleSidebar` event', () => {
- vm = mountComponent(Participants, {
- loading: false,
- participants: PARTICIPANT_LIST,
- numberOfLessParticipants: 2,
- });
- spyOn(vm, '$emit');
-
- const participantsIconEl = vm.$el.querySelector('.sidebar-collapsed-icon');
-
- participantsIconEl.click();
-
- expect(vm.$emit).toHaveBeenCalledWith('toggleSidebar');
- });
- });
-
- describe('when not showing participants label', () => {
- beforeEach(() => {
- vm = mountComponent(Participants, {
- participants: PARTICIPANT_LIST,
- showParticipantLabel: false,
- });
- });
-
- it('does not show sidebar collapsed icon', () => {
- expect(vm.$el.querySelector('.sidebar-collapsed-icon')).not.toBeTruthy();
- });
-
- it('does not show participants label title', () => {
- expect(vm.$el.querySelector('.title')).not.toBeTruthy();
- });
- });
-});
diff --git a/spec/javascripts/sidebar/sidebar_mediator_spec.js b/spec/javascripts/sidebar/sidebar_mediator_spec.js
deleted file mode 100644
index 2aa30fd1cc6..00000000000
--- a/spec/javascripts/sidebar/sidebar_mediator_spec.js
+++ /dev/null
@@ -1,134 +0,0 @@
-import MockAdapter from 'axios-mock-adapter';
-import axios from '~/lib/utils/axios_utils';
-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() {
- let mock;
-
- beforeEach(() => {
- mock = new MockAdapter(axios);
-
- this.mediator = new SidebarMediator(mediatorMockData);
- });
-
- afterEach(() => {
- SidebarService.singleton = null;
- SidebarStore.singleton = null;
- SidebarMediator.singleton = null;
- mock.restore();
- });
-
- it('assigns yourself ', () => {
- this.mediator.assignYourself();
-
- expect(this.mediator.store.currentUser).toEqual(mediatorMockData.currentUser);
- expect(this.mediator.store.assignees[0]).toEqual(mediatorMockData.currentUser);
- });
-
- it('saves assignees', done => {
- mock.onPut(mediatorMockData.endpoint).reply(200, {});
- this.mediator
- .saveAssignees('issue[assignee_ids]')
- .then(resp => {
- expect(resp.status).toEqual(200);
- done();
- })
- .catch(done.fail);
- });
-
- it('fetches the data', done => {
- const mockData = Mock.responseMap.GET[mediatorMockData.endpoint];
- mock.onGet(mediatorMockData.endpoint).reply(200, mockData);
-
- const mockGraphQlData = Mock.graphQlResponseData;
- spyOn(gqClient, 'query').and.returnValue({
- data: mockGraphQlData,
- });
-
- spyOn(this.mediator, 'processFetchedData').and.callThrough();
-
- this.mediator
- .fetch()
- .then(() => {
- expect(this.mediator.processFetchedData).toHaveBeenCalledWith(mockData, mockGraphQlData);
- })
- .then(done)
- .catch(done.fail);
- });
-
- 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);
- });
-
- it('sets moveToProjectId', () => {
- const projectId = 7;
- spyOn(this.mediator.store, 'setMoveToProjectId').and.callThrough();
-
- this.mediator.setMoveToProjectId(projectId);
-
- expect(this.mediator.store.setMoveToProjectId).toHaveBeenCalledWith(projectId);
- });
-
- it('fetches autocomplete projects', done => {
- 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);
- });
-
- it('moves issue', done => {
- 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);
- });
-
- it('toggle subscription', done => {
- this.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);
- });
-});
diff --git a/spec/javascripts/sidebar/sidebar_move_issue_spec.js b/spec/javascripts/sidebar/sidebar_move_issue_spec.js
deleted file mode 100644
index ec712450f2e..00000000000
--- a/spec/javascripts/sidebar/sidebar_move_issue_spec.js
+++ /dev/null
@@ -1,166 +0,0 @@
-import $ from 'jquery';
-import MockAdapter from 'axios-mock-adapter';
-import axios from '~/lib/utils/axios_utils';
-import SidebarMediator from '~/sidebar/sidebar_mediator';
-import SidebarStore from '~/sidebar/stores/sidebar_store';
-import SidebarService from '~/sidebar/services/sidebar_service';
-import SidebarMoveIssue from '~/sidebar/lib/sidebar_move_issue';
-import Mock from './mock_data';
-
-describe('SidebarMoveIssue', function() {
- let mock;
-
- beforeEach(() => {
- mock = new MockAdapter(axios);
- const mockData = Mock.responseMap.GET['/autocomplete/projects?project_id=15'];
- mock.onGet('/autocomplete/projects?project_id=15').reply(200, mockData);
- this.mediator = new SidebarMediator(Mock.mediator);
- this.$content = $(`
- <div class="dropdown">
- <div class="js-toggle"></div>
- <div class="dropdown-menu">
- <div class="dropdown-content"></div>
- </div>
- <div class="js-confirm-button"></div>
- </div>
- `);
- this.$toggleButton = this.$content.find('.js-toggle');
- this.$confirmButton = this.$content.find('.js-confirm-button');
-
- this.sidebarMoveIssue = new SidebarMoveIssue(
- this.mediator,
- this.$toggleButton,
- this.$confirmButton,
- );
- this.sidebarMoveIssue.init();
- });
-
- afterEach(() => {
- SidebarService.singleton = null;
- SidebarStore.singleton = null;
- SidebarMediator.singleton = null;
-
- this.sidebarMoveIssue.destroy();
- mock.restore();
- });
-
- describe('init', () => {
- it('should initialize the dropdown and listeners', () => {
- spyOn(this.sidebarMoveIssue, 'initDropdown');
- spyOn(this.sidebarMoveIssue, 'addEventListeners');
-
- this.sidebarMoveIssue.init();
-
- expect(this.sidebarMoveIssue.initDropdown).toHaveBeenCalled();
- expect(this.sidebarMoveIssue.addEventListeners).toHaveBeenCalled();
- });
- });
-
- describe('destroy', () => {
- it('should remove the listeners', () => {
- spyOn(this.sidebarMoveIssue, 'removeEventListeners');
-
- this.sidebarMoveIssue.destroy();
-
- expect(this.sidebarMoveIssue.removeEventListeners).toHaveBeenCalled();
- });
- });
-
- describe('initDropdown', () => {
- it('should initialize the gl_dropdown', () => {
- spyOn($.fn, 'glDropdown');
-
- this.sidebarMoveIssue.initDropdown();
-
- expect($.fn.glDropdown).toHaveBeenCalled();
- });
-
- it('escapes html from project name', done => {
- this.$toggleButton.dropdown('toggle');
-
- setTimeout(() => {
- expect(this.$content.find('.js-move-issue-dropdown-item')[1].innerHTML.trim()).toEqual(
- '&lt;img src=x onerror=alert(document.domain)&gt; foo / bar',
- );
- done();
- });
- });
- });
-
- describe('onConfirmClicked', () => {
- it('should move the issue with valid project ID', () => {
- spyOn(this.mediator, 'moveIssue').and.returnValue(Promise.resolve());
- this.mediator.setMoveToProjectId(7);
-
- this.sidebarMoveIssue.onConfirmClicked();
-
- expect(this.mediator.moveIssue).toHaveBeenCalled();
- expect(this.$confirmButton.prop('disabled')).toBeTruthy();
- expect(this.$confirmButton.hasClass('is-loading')).toBe(true);
- });
-
- it('should remove loading state from confirm button on failure', done => {
- spyOn(window, 'Flash');
- spyOn(this.mediator, 'moveIssue').and.returnValue(Promise.reject());
- this.mediator.setMoveToProjectId(7);
-
- this.sidebarMoveIssue.onConfirmClicked();
-
- expect(this.mediator.moveIssue).toHaveBeenCalled();
- // Wait for the move issue request to fail
- setTimeout(() => {
- expect(window.Flash).toHaveBeenCalled();
- expect(this.$confirmButton.prop('disabled')).toBeFalsy();
- expect(this.$confirmButton.hasClass('is-loading')).toBe(false);
- done();
- });
- });
-
- it('should not move the issue with id=0', () => {
- spyOn(this.mediator, 'moveIssue');
- this.mediator.setMoveToProjectId(0);
-
- this.sidebarMoveIssue.onConfirmClicked();
-
- expect(this.mediator.moveIssue).not.toHaveBeenCalled();
- });
- });
-
- it('should set moveToProjectId on dropdown item "No project" click', done => {
- spyOn(this.mediator, 'setMoveToProjectId');
-
- // Open the dropdown
- this.$toggleButton.dropdown('toggle');
-
- // Wait for the autocomplete request to finish
- setTimeout(() => {
- this.$content
- .find('.js-move-issue-dropdown-item')
- .eq(0)
- .trigger('click');
-
- expect(this.mediator.setMoveToProjectId).toHaveBeenCalledWith(0);
- expect(this.$confirmButton.prop('disabled')).toBeTruthy();
- done();
- }, 0);
- });
-
- it('should set moveToProjectId on dropdown item click', done => {
- spyOn(this.mediator, 'setMoveToProjectId');
-
- // Open the dropdown
- this.$toggleButton.dropdown('toggle');
-
- // Wait for the autocomplete request to finish
- setTimeout(() => {
- this.$content
- .find('.js-move-issue-dropdown-item')
- .eq(1)
- .trigger('click');
-
- expect(this.mediator.setMoveToProjectId).toHaveBeenCalledWith(20);
- expect(this.$confirmButton.attr('disabled')).toBe(undefined);
- done();
- }, 0);
- });
-});
diff --git a/spec/javascripts/sidebar/sidebar_subscriptions_spec.js b/spec/javascripts/sidebar/sidebar_subscriptions_spec.js
deleted file mode 100644
index ee4516f3bcd..00000000000
--- a/spec/javascripts/sidebar/sidebar_subscriptions_spec.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import Vue from 'vue';
-import mountComponent from 'spec/helpers/vue_mount_component_helper';
-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;
-
- beforeEach(() => {
- SidebarSubscriptions = Vue.extend(sidebarSubscriptions);
- // Set up the stores, services, etc
- // eslint-disable-next-line no-new
- new SidebarMediator(Mock.mediator);
- });
-
- afterEach(() => {
- vm.$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,
- });
-
- vm.onToggleSubscription();
-
- expect(mediator.toggleSubscription).toHaveBeenCalled();
- });
-});
diff --git a/spec/javascripts/sidebar/subscriptions_spec.js b/spec/javascripts/sidebar/subscriptions_spec.js
deleted file mode 100644
index cdb39efbef8..00000000000
--- a/spec/javascripts/sidebar/subscriptions_spec.js
+++ /dev/null
@@ -1,100 +0,0 @@
-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 eventHub from '~/sidebar/event_hub';
-
-describe('Subscriptions', function() {
- let vm;
- let Subscriptions;
-
- beforeEach(() => {
- Subscriptions = Vue.extend(subscriptions);
- });
-
- afterEach(() => {
- vm.$destroy();
- });
-
- it('shows loading spinner when loading', () => {
- vm = mountComponent(Subscriptions, {
- loading: true,
- subscribed: undefined,
- });
-
- expect(vm.$refs.toggleButton.isLoading).toBe(true);
- expect(vm.$refs.toggleButton.$el.querySelector('.project-feature-toggle')).toHaveClass(
- 'is-loading',
- );
- });
-
- it('is toggled "off" when currently not subscribed', () => {
- vm = mountComponent(Subscriptions, {
- subscribed: false,
- });
-
- expect(vm.$refs.toggleButton.$el.querySelector('.project-feature-toggle')).not.toHaveClass(
- 'is-checked',
- );
- });
-
- it('is toggled "on" when currently subscribed', () => {
- vm = mountComponent(Subscriptions, {
- subscribed: true,
- });
-
- expect(vm.$refs.toggleButton.$el.querySelector('.project-feature-toggle')).toHaveClass(
- 'is-checked',
- );
- });
-
- it('toggleSubscription method emits `toggleSubscription` event on eventHub and Component', () => {
- vm = mountComponent(Subscriptions, { subscribed: true });
- spyOn(eventHub, '$emit');
- spyOn(vm, '$emit');
- spyOn(vm, 'track');
-
- vm.toggleSubscription();
-
- expect(eventHub.$emit).toHaveBeenCalledWith('toggleSubscription', jasmine.any(Object));
- expect(vm.$emit).toHaveBeenCalledWith('toggleSubscription', jasmine.any(Object));
- });
-
- it('tracks the event when toggled', () => {
- vm = mountComponent(Subscriptions, { subscribed: true });
- const spy = mockTracking('_category_', vm.$el, spyOn);
- vm.toggleSubscription();
-
- expect(spy).toHaveBeenCalled();
- });
-
- it('onClickCollapsedIcon method emits `toggleSidebar` event on component', () => {
- vm = mountComponent(Subscriptions, { subscribed: true });
- spyOn(vm, '$emit');
-
- vm.onClickCollapsedIcon();
-
- expect(vm.$emit).toHaveBeenCalledWith('toggleSidebar');
- });
-
- describe('given project emails are disabled', () => {
- const subscribeDisabledDescription = 'Notifications have been disabled';
-
- beforeEach(() => {
- vm = mountComponent(Subscriptions, {
- subscribed: false,
- projectEmailsDisabled: true,
- subscribeDisabledDescription,
- });
- });
-
- it('sets the correct display text', () => {
- expect(vm.$el.textContent).toContain(subscribeDisabledDescription);
- expect(vm.$refs.tooltip.dataset.originalTitle).toBe(subscribeDisabledDescription);
- });
-
- it('does not render the toggle button', () => {
- expect(vm.$refs.toggleButton).toBeUndefined();
- });
- });
-});