From 87ef501eacd66d7166183d20d84e33de022f7002 Mon Sep 17 00:00:00 2001 From: GitLab Bot Date: Tue, 3 Mar 2020 09:07:54 +0000 Subject: Add latest changes from gitlab-org/gitlab@master --- .../boards/components/boards_selector_spec.js | 203 --------------------- 1 file changed, 203 deletions(-) delete mode 100644 spec/javascripts/boards/components/boards_selector_spec.js (limited to 'spec/javascripts') diff --git a/spec/javascripts/boards/components/boards_selector_spec.js b/spec/javascripts/boards/components/boards_selector_spec.js deleted file mode 100644 index 16ec3b801cd..00000000000 --- a/spec/javascripts/boards/components/boards_selector_spec.js +++ /dev/null @@ -1,203 +0,0 @@ -import Vue from 'vue'; -import mountComponent from 'spec/helpers/vue_mount_component_helper'; -import { TEST_HOST } from 'spec/test_constants'; -import BoardsSelector from '~/boards/components/boards_selector.vue'; -import boardsStore from '~/boards/stores/boards_store'; - -const throttleDuration = 1; - -function boardGenerator(n) { - return new Array(n).fill().map((board, id) => { - const name = `board${id}`; - - return { - id, - name, - }; - }); -} - -describe('BoardsSelector', () => { - let vm; - let allBoardsResponse; - let recentBoardsResponse; - let fillSearchBox; - const boards = boardGenerator(20); - const recentBoards = boardGenerator(5); - - beforeEach(done => { - setFixtures('
'); - window.gl = window.gl || {}; - - boardsStore.setEndpoints({ - boardsEndpoint: '', - recentBoardsEndpoint: '', - listsEndpoint: '', - bulkUpdatePath: '', - boardId: '', - }); - - allBoardsResponse = Promise.resolve({ - data: boards, - }); - recentBoardsResponse = Promise.resolve({ - data: recentBoards, - }); - - spyOn(boardsStore, 'allBoards').and.returnValue(allBoardsResponse); - spyOn(boardsStore, 'recentBoards').and.returnValue(recentBoardsResponse); - - const Component = Vue.extend(BoardsSelector); - vm = mountComponent( - Component, - { - throttleDuration, - currentBoard: { - id: 1, - name: 'Development', - milestone_id: null, - weight: null, - assignee_id: null, - labels: [], - }, - milestonePath: `${TEST_HOST}/milestone/path`, - boardBaseUrl: `${TEST_HOST}/board/base/url`, - hasMissingBoards: false, - canAdminBoard: true, - multipleIssueBoardsAvailable: true, - labelsPath: `${TEST_HOST}/labels/path`, - projectId: 42, - groupId: 19, - scopedIssueBoardFeatureEnabled: true, - weights: [], - }, - document.querySelector('.js-boards-selector'), - ); - - // Emits gl-dropdown show event to simulate the dropdown is opened at initialization time - vm.$children[0].$emit('show'); - - Promise.all([allBoardsResponse, recentBoardsResponse]) - .then(() => vm.$nextTick()) - .then(done) - .catch(done.fail); - - fillSearchBox = filterTerm => { - const { searchBox } = vm.$refs; - const searchBoxInput = searchBox.$el.querySelector('input'); - searchBoxInput.value = filterTerm; - searchBoxInput.dispatchEvent(new Event('input')); - }; - }); - - afterEach(() => { - vm.$destroy(); - }); - - describe('filtering', () => { - it('shows all boards without filtering', done => { - vm.$nextTick() - .then(() => { - const dropdownItem = vm.$el.querySelectorAll('.js-dropdown-item'); - - expect(dropdownItem.length).toBe(boards.length + recentBoards.length); - }) - .then(done) - .catch(done.fail); - }); - - it('shows only matching boards when filtering', done => { - const filterTerm = 'board1'; - const expectedCount = boards.filter(board => board.name.includes(filterTerm)).length; - - fillSearchBox(filterTerm); - - vm.$nextTick() - .then(() => { - const dropdownItems = vm.$el.querySelectorAll('.js-dropdown-item'); - - expect(dropdownItems.length).toBe(expectedCount); - }) - .then(done) - .catch(done.fail); - }); - - it('shows message if there are no matching boards', done => { - fillSearchBox('does not exist'); - - vm.$nextTick() - .then(() => { - const dropdownItems = vm.$el.querySelectorAll('.js-dropdown-item'); - - expect(dropdownItems.length).toBe(0); - expect(vm.$el).toContainText('No matching boards found'); - }) - .then(done) - .catch(done.fail); - }); - }); - - describe('recent boards section', () => { - it('shows only when boards are greater than 10', done => { - vm.$nextTick() - .then(() => { - const headerEls = vm.$el.querySelectorAll('.dropdown-bold-header'); - - const expectedCount = 2; // Recent + All - - expect(expectedCount).toBe(headerEls.length); - }) - .then(done) - .catch(done.fail); - }); - - it('does not show when boards are less than 10', done => { - spyOn(vm, 'initScrollFade'); - spyOn(vm, 'setScrollFade'); - - vm.$nextTick() - .then(() => { - vm.boards = vm.boards.slice(0, 5); - }) - .then(vm.$nextTick) - .then(() => { - const headerEls = vm.$el.querySelectorAll('.dropdown-bold-header'); - const expectedCount = 0; - - expect(expectedCount).toBe(headerEls.length); - }) - .then(done) - .catch(done.fail); - }); - - it('does not show when recentBoards api returns empty array', done => { - vm.$nextTick() - .then(() => { - vm.recentBoards = []; - }) - .then(vm.$nextTick) - .then(() => { - const headerEls = vm.$el.querySelectorAll('.dropdown-bold-header'); - const expectedCount = 0; - - expect(expectedCount).toBe(headerEls.length); - }) - .then(done) - .catch(done.fail); - }); - - it('does not show when search is active', done => { - fillSearchBox('Random string'); - - vm.$nextTick() - .then(() => { - const headerEls = vm.$el.querySelectorAll('.dropdown-bold-header'); - const expectedCount = 0; - - expect(expectedCount).toBe(headerEls.length); - }) - .then(done) - .catch(done.fail); - }); - }); -}); -- cgit v1.2.3