diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-04-28 18:09:35 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-04-28 18:09:35 +0000 |
commit | 95e18e32833de71b46d73ead66c8f13e261af3f4 (patch) | |
tree | bf61062dc1ae8ec2a25b28cd6385190661d3b37c /spec/javascripts/sidebar | |
parent | 37ae6b54ba524c438d1b756ce3ca29bbcec4e897 (diff) | |
download | gitlab-ce-95e18e32833de71b46d73ead66c8f13e261af3f4.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/javascripts/sidebar')
-rw-r--r-- | spec/javascripts/sidebar/lock/edit_form_buttons_spec.js | 32 | ||||
-rw-r--r-- | spec/javascripts/sidebar/participants_spec.js | 202 | ||||
-rw-r--r-- | spec/javascripts/sidebar/sidebar_mediator_spec.js | 134 | ||||
-rw-r--r-- | spec/javascripts/sidebar/sidebar_subscriptions_spec.js | 38 | ||||
-rw-r--r-- | spec/javascripts/sidebar/subscriptions_spec.js | 100 |
5 files changed, 0 insertions, 506 deletions
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/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_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(); - }); - }); -}); |