diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2019-09-18 17:02:45 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2019-09-18 17:02:45 +0300 |
commit | 80f61b4035607d7cd87de993b8f5e996bde3481f (patch) | |
tree | 06b12f51e97d87192e3dd0e05edf55143645b894 /spec/javascripts/boards | |
parent | 4ab54c2233e91f60a80e5b6fa2181e6899fdcc3e (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/javascripts/boards')
-rw-r--r-- | spec/javascripts/boards/components/board_spec.js | 271 | ||||
-rw-r--r-- | spec/javascripts/boards/list_spec.js | 26 |
2 files changed, 231 insertions, 66 deletions
diff --git a/spec/javascripts/boards/components/board_spec.js b/spec/javascripts/boards/components/board_spec.js index 683783334c6..ccb657e0df1 100644 --- a/spec/javascripts/boards/components/board_spec.js +++ b/spec/javascripts/boards/components/board_spec.js @@ -5,21 +5,16 @@ import { mockBoardService } from '../mock_data'; describe('Board component', () => { let vm; - let el; - beforeEach(done => { - loadFixtures('boards/show.html'); - - el = document.createElement('div'); + const createComponent = ({ gon = {}, collapsed = false, listType = 'backlog' } = {}) => { + if (Object.prototype.hasOwnProperty.call(gon, 'current_user_id')) { + window.gon = gon; + } else { + window.gon = {}; + } + const el = document.createElement('div'); document.body.appendChild(el); - gl.boardService = mockBoardService({ - boardsEndpoint: '/', - listsEndpoint: '/', - bulkUpdatePath: '/', - boardId: 1, - }); - vm = new Board({ propsData: { boardId: '1', @@ -30,94 +25,244 @@ describe('Board component', () => { id: 1, position: 0, title: 'test', - list_type: 'backlog', + list_type: listType, + collapsed, }), }, }).$mount(el); + }; + + const setUpTests = (done, opts = {}) => { + loadFixtures('boards/show.html'); + + gl.boardService = mockBoardService({ + boardsEndpoint: '/', + listsEndpoint: '/', + bulkUpdatePath: '/', + boardId: 1, + }); + + createComponent(opts); Vue.nextTick(done); - }); + }; + + const cleanUpTests = spy => { + if (spy) { + spy.calls.reset(); + } - afterEach(() => { vm.$destroy(); // remove the component from the DOM document.querySelector('.board').remove(); - localStorage.removeItem(`boards.${vm.boardId}.${vm.list.type}.expanded`); - }); + localStorage.removeItem(`${vm.uniqueKey}.expanded`); + }; - it('board is expandable when list type is backlog', () => { - expect(vm.$el.classList.contains('is-expandable')).toBe(true); - }); + describe('List', () => { + beforeEach(() => { + gl.boardService = mockBoardService({ + boardsEndpoint: '/', + listsEndpoint: '/', + bulkUpdatePath: '/', + boardId: 1, + }); + }); + + it('board is expandable when list type is closed', () => { + expect(new List({ id: 1, list_type: 'closed' }).isExpandable).toBe(true); + }); + + it('board is expandable when list type is label', () => { + expect(new List({ id: 1, list_type: 'closed' }).isExpandable).toBe(true); + }); - it('board is expandable when list type is closed', () => { - expect(new List({ id: 1, list_type: 'closed' }).isExpandable).toBe(true); + it('board is not expandable when list type is blank', () => { + expect(new List({ id: 1, list_type: 'blank' }).isExpandable).toBe(false); + }); }); - it('board is expandable when list type is label', () => { - expect(new List({ id: 1, list_type: 'closed' }).isExpandable).toBe(true); + describe('when clicking the header', () => { + beforeEach(done => { + setUpTests(done); + }); + + afterEach(() => { + cleanUpTests(); + }); + + it('does not collapse', done => { + vm.list.isExpanded = true; + vm.$el.querySelector('.board-header').click(); + + Vue.nextTick() + .then(() => { + expect(vm.$el.classList.contains('is-collapsed')).toBe(false); + }) + .then(done) + .catch(done.fail); + }); }); - it('board is not expandable when list type is blank', () => { - expect(new List({ id: 1, list_type: 'blank' }).isExpandable).toBe(false); + describe('when clicking the collapse icon', () => { + beforeEach(done => { + setUpTests(done); + }); + + afterEach(() => { + cleanUpTests(); + }); + + it('collapses', done => { + Vue.nextTick() + .then(() => { + vm.$el.querySelector('.board-title-caret').click(); + }) + .then(() => { + expect(vm.$el.classList.contains('is-collapsed')).toBe(true); + }) + .then(done) + .catch(done.fail); + }); }); - it('does not collapse when clicking header', done => { - vm.list.isExpanded = true; - vm.$el.querySelector('.board-header').click(); + describe('when clicking the expand icon', () => { + beforeEach(done => { + setUpTests(done); + }); - Vue.nextTick(() => { - expect(vm.$el.classList.contains('is-collapsed')).toBe(false); + afterEach(() => { + cleanUpTests(); + }); + + it('expands', done => { + vm.list.isExpanded = false; - done(); + Vue.nextTick() + .then(() => { + vm.$el.querySelector('.board-title-caret').click(); + }) + .then(() => { + expect(vm.$el.classList.contains('is-collapsed')).toBe(false); + }) + .then(done) + .catch(done.fail); }); }); - it('collapses when clicking the collapse icon', done => { - vm.list.isExpanded = true; + describe('when collapsed is false', () => { + beforeEach(done => { + setUpTests(done); + }); - Vue.nextTick() - .then(() => { - vm.$el.querySelector('.board-title-caret').click(); - }) - .then(() => { - expect(vm.$el.classList.contains('is-collapsed')).toBe(true); - done(); - }) - .catch(done.fail); + afterEach(() => { + cleanUpTests(); + }); + + it('is expanded when collapsed is false', () => { + expect(vm.list.isExpanded).toBe(true); + expect(vm.$el.classList.contains('is-collapsed')).toBe(false); + }); }); - it('expands when clicking the expand icon', done => { - vm.list.isExpanded = false; + describe('when list type is blank', () => { + beforeEach(done => { + setUpTests(done, { listType: 'blank' }); + }); + + afterEach(() => { + cleanUpTests(); + }); + + it('does not render add issue button when list type is blank', done => { + Vue.nextTick(() => { + expect(vm.$el.querySelector('.issue-count-badge-add-button')).toBeNull(); - Vue.nextTick() - .then(() => { - vm.$el.querySelector('.board-title-caret').click(); - }) - .then(() => { - expect(vm.$el.classList.contains('is-collapsed')).toBe(false); done(); - }) - .catch(done.fail); + }); + }); }); - it('is expanded when created', () => { - expect(vm.list.isExpanded).toBe(true); - expect(vm.$el.classList.contains('is-collapsed')).toBe(false); + describe('when list type is backlog', () => { + beforeEach(done => { + setUpTests(done); + }); + + afterEach(() => { + cleanUpTests(); + }); + + it('board is expandable', () => { + expect(vm.$el.classList.contains('is-expandable')).toBe(true); + }); }); - it('does render add issue button', () => { - expect(vm.$el.querySelector('.issue-count-badge-add-button')).not.toBeNull(); + describe('when logged in', () => { + let spy; + + beforeEach(done => { + spy = spyOn(List.prototype, 'update'); + setUpTests(done, { gon: { current_user_id: 1 } }); + }); + + afterEach(() => { + cleanUpTests(spy); + }); + + it('calls list update', done => { + Vue.nextTick() + .then(() => { + vm.$el.querySelector('.board-title-caret').click(); + }) + .then(() => { + expect(vm.list.update).toHaveBeenCalledTimes(1); + }) + .then(done) + .catch(done.fail); + }); }); - it('does not render add issue button when list type is blank', done => { - vm.list.type = 'blank'; + describe('when logged out', () => { + let spy; + beforeEach(done => { + spy = spyOn(List.prototype, 'update'); + setUpTests(done, { collapsed: false }); + }); + + afterEach(() => { + cleanUpTests(spy); + }); - Vue.nextTick(() => { - expect(vm.$el.querySelector('.issue-count-badge-add-button')).toBeNull(); + // can only be one or the other cant toggle window.gon.current_user_id states. + it('clicking on the caret does not call list update', done => { + Vue.nextTick() + .then(() => { + vm.$el.querySelector('.board-title-caret').click(); + }) + .then(() => { + expect(vm.list.update).toHaveBeenCalledTimes(0); + }) + .then(done) + .catch(done.fail); + }); + + it('sets expanded to be the opposite of its value when toggleExpanded is called', done => { + const expanded = true; + vm.list.isExpanded = expanded; + vm.toggleExpanded(); + + Vue.nextTick() + .then(() => { + expect(vm.list.isExpanded).toBe(!expanded); + expect(localStorage.getItem(`${vm.uniqueKey}.expanded`)).toBe(String(!expanded)); + }) + .then(done) + .catch(done.fail); + }); - done(); + it('does render add issue button', () => { + expect(vm.$el.querySelector('.issue-count-badge-add-button')).not.toBeNull(); }); }); }); diff --git a/spec/javascripts/boards/list_spec.js b/spec/javascripts/boards/list_spec.js index 15c9ff6dfb4..d01c37437ad 100644 --- a/spec/javascripts/boards/list_spec.js +++ b/spec/javascripts/boards/list_spec.js @@ -1,5 +1,7 @@ /* global List */ +/* global ListAssignee */ /* global ListIssue */ +/* global ListLabel */ import MockAdapter from 'axios-mock-adapter'; import axios from '~/lib/utils/axios_utils'; @@ -174,18 +176,29 @@ describe('List model', () => { Promise.resolve({ data: { id: 42, + subscribed: false, + assignable_labels_endpoint: '/issue/42/labels', + toggle_subscription_endpoint: '/issue/42/subscriptions', + issue_sidebar_endpoint: '/issue/42/sidebar_info', }, }), ); }); it('adds new issue to top of list', done => { + const user = new ListAssignee({ + id: 1, + name: 'testing 123', + username: 'test', + avatar: 'test_image', + }); + list.issues.push( new ListIssue({ title: 'Testing', id: _.random(10000), confidential: false, - labels: [list.label], + labels: [new ListLabel(list.label)], assignees: [], }), ); @@ -193,8 +206,9 @@ describe('List model', () => { title: 'new issue', id: _.random(10000), confidential: false, - labels: [list.label], - assignees: [], + labels: [new ListLabel(list.label)], + assignees: [user], + subscribed: false, }); list @@ -202,6 +216,12 @@ describe('List model', () => { .then(() => { expect(list.issues.length).toBe(2); expect(list.issues[0]).toBe(dummyIssue); + expect(list.issues[0].subscribed).toBe(false); + expect(list.issues[0].assignableLabelsEndpoint).toBe('/issue/42/labels'); + expect(list.issues[0].toggleSubscriptionEndpoint).toBe('/issue/42/subscriptions'); + expect(list.issues[0].sidebarInfoEndpoint).toBe('/issue/42/sidebar_info'); + expect(list.issues[0].labels).toBe(dummyIssue.labels); + expect(list.issues[0].assignees).toBe(dummyIssue.assignees); }) .then(done) .catch(done.fail); |