diff options
Diffstat (limited to 'spec/frontend/boards/components')
| -rw-r--r-- | spec/frontend/boards/components/board_column_spec.js | 5 | ||||
| -rw-r--r-- | spec/frontend/boards/components/board_form_spec.js | 38 | ||||
| -rw-r--r-- | spec/frontend/boards/components/boards_selector_spec.js | 36 |
3 files changed, 30 insertions, 49 deletions
diff --git a/spec/frontend/boards/components/board_column_spec.js b/spec/frontend/boards/components/board_column_spec.js index f1964daa8b2..c13f7caba76 100644 --- a/spec/frontend/boards/components/board_column_spec.js +++ b/spec/frontend/boards/components/board_column_spec.js @@ -20,8 +20,6 @@ describe('Board Column Component', () => { }; const createComponent = ({ listType = ListType.backlog, collapsed = false } = {}) => { - const boardId = '1'; - const listMock = { ...listObj, listType, @@ -39,9 +37,6 @@ describe('Board Column Component', () => { disabled: false, list: listMock, }, - provide: { - boardId, - }, }); }; diff --git a/spec/frontend/boards/components/board_form_spec.js b/spec/frontend/boards/components/board_form_spec.js index 6a659623b53..fdc16b46167 100644 --- a/spec/frontend/boards/components/board_form_spec.js +++ b/spec/frontend/boards/components/board_form_spec.js @@ -1,4 +1,6 @@ import { GlModal } from '@gitlab/ui'; +import Vue from 'vue'; +import Vuex from 'vuex'; import setWindowLocation from 'helpers/set_window_location_helper'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; import waitForPromises from 'helpers/wait_for_promises'; @@ -8,7 +10,6 @@ import { formType } from '~/boards/constants'; import createBoardMutation from '~/boards/graphql/board_create.mutation.graphql'; import destroyBoardMutation from '~/boards/graphql/board_destroy.mutation.graphql'; import updateBoardMutation from '~/boards/graphql/board_update.mutation.graphql'; -import { createStore } from '~/boards/stores'; import { visitUrl } from '~/lib/utils/url_utility'; jest.mock('~/lib/utils/url_utility', () => ({ @@ -16,6 +17,8 @@ jest.mock('~/lib/utils/url_utility', () => ({ visitUrl: jest.fn().mockName('visitUrlMock'), })); +Vue.use(Vuex); + const currentBoard = { id: 'gid://gitlab/Board/1', name: 'test', @@ -46,11 +49,18 @@ describe('BoardForm', () => { const findDeleteConfirmation = () => wrapper.findByTestId('delete-confirmation-message'); const findInput = () => wrapper.find('#board-new-name'); - const store = createStore({ + const setBoardMock = jest.fn(); + const setErrorMock = jest.fn(); + + const store = new Vuex.Store({ getters: { isGroupBoard: () => true, isProjectBoard: () => false, }, + actions: { + setBoard: setBoardMock, + setError: setErrorMock, + }, }); const createComponent = (props, data) => { @@ -168,7 +178,7 @@ describe('BoardForm', () => { expect(mutate).not.toHaveBeenCalled(); }); - it('calls a correct GraphQL mutation and redirects to correct page from existing board', async () => { + it('calls a correct GraphQL mutation and sets board in state', async () => { createComponent({ canAdminBoard: true, currentPage: formType.new }); fillForm(); @@ -184,13 +194,12 @@ describe('BoardForm', () => { }); await waitForPromises(); - expect(visitUrl).toHaveBeenCalledWith('test-path'); + expect(setBoardMock).toHaveBeenCalledTimes(1); }); - it('shows a GlAlert if GraphQL mutation fails', async () => { + it('sets error in state if GraphQL mutation fails', async () => { mutate = jest.fn().mockRejectedValue('Houston, we have a problem'); createComponent({ canAdminBoard: true, currentPage: formType.new }); - jest.spyOn(wrapper.vm, 'setError').mockImplementation(() => {}); fillForm(); @@ -199,8 +208,8 @@ describe('BoardForm', () => { expect(mutate).toHaveBeenCalled(); await waitForPromises(); - expect(visitUrl).not.toHaveBeenCalled(); - expect(wrapper.vm.setError).toHaveBeenCalled(); + expect(setBoardMock).not.toHaveBeenCalled(); + expect(setErrorMock).toHaveBeenCalled(); }); }); }); @@ -256,7 +265,8 @@ describe('BoardForm', () => { }); await waitForPromises(); - expect(visitUrl).toHaveBeenCalledWith('test-path'); + expect(setBoardMock).toHaveBeenCalledTimes(1); + expect(global.window.location.href).not.toContain('?group_by=epic'); }); it('calls GraphQL mutation with correct parameters when issues are grouped by epic', async () => { @@ -282,13 +292,13 @@ describe('BoardForm', () => { }); await waitForPromises(); - expect(visitUrl).toHaveBeenCalledWith('test-path?group_by=epic'); + expect(setBoardMock).toHaveBeenCalledTimes(1); + expect(global.window.location.href).toContain('?group_by=epic'); }); - it('shows a GlAlert if GraphQL mutation fails', async () => { + it('sets error in state if GraphQL mutation fails', async () => { mutate = jest.fn().mockRejectedValue('Houston, we have a problem'); createComponent({ canAdminBoard: true, currentPage: formType.edit }); - jest.spyOn(wrapper.vm, 'setError').mockImplementation(() => {}); findInput().trigger('keyup.enter', { metaKey: true }); @@ -297,8 +307,8 @@ describe('BoardForm', () => { expect(mutate).toHaveBeenCalled(); await waitForPromises(); - expect(visitUrl).not.toHaveBeenCalled(); - expect(wrapper.vm.setError).toHaveBeenCalled(); + expect(setBoardMock).not.toHaveBeenCalled(); + expect(setErrorMock).toHaveBeenCalled(); }); }); diff --git a/spec/frontend/boards/components/boards_selector_spec.js b/spec/frontend/boards/components/boards_selector_spec.js index f60d04af4fc..d91e81fe4d0 100644 --- a/spec/frontend/boards/components/boards_selector_spec.js +++ b/spec/frontend/boards/components/boards_selector_spec.js @@ -2,11 +2,10 @@ import { GlDropdown, GlLoadingIcon, GlDropdownSectionHeader } from '@gitlab/ui'; import Vue, { nextTick } from 'vue'; import VueApollo from 'vue-apollo'; import Vuex from 'vuex'; +import waitForPromises from 'helpers/wait_for_promises'; import { TEST_HOST } from 'spec/test_constants'; import BoardsSelector from '~/boards/components/boards_selector.vue'; import { BoardType } from '~/boards/constants'; -import groupBoardQuery from '~/boards/graphql/group_board.query.graphql'; -import projectBoardQuery from '~/boards/graphql/project_board.query.graphql'; import groupBoardsQuery from '~/boards/graphql/group_boards.query.graphql'; import projectBoardsQuery from '~/boards/graphql/project_boards.query.graphql'; import groupRecentBoardsQuery from '~/boards/graphql/group_recent_boards.query.graphql'; @@ -15,8 +14,7 @@ import defaultStore from '~/boards/stores'; import createMockApollo from 'helpers/mock_apollo_helper'; import { mountExtended } from 'helpers/vue_test_utils_helper'; import { - mockGroupBoardResponse, - mockProjectBoardResponse, + mockBoard, mockGroupAllBoardsResponse, mockProjectAllBoardsResponse, mockGroupRecentBoardsResponse, @@ -49,6 +47,7 @@ describe('BoardsSelector', () => { }, state: { boardType: isGroupBoard ? 'group' : 'project', + board: mockBoard, }, }); }; @@ -65,9 +64,6 @@ describe('BoardsSelector', () => { const getLoadingIcon = () => wrapper.findComponent(GlLoadingIcon); const findDropdown = () => wrapper.findComponent(GlDropdown); - const projectBoardQueryHandlerSuccess = jest.fn().mockResolvedValue(mockProjectBoardResponse); - const groupBoardQueryHandlerSuccess = jest.fn().mockResolvedValue(mockGroupBoardResponse); - const projectBoardsQueryHandlerSuccess = jest .fn() .mockResolvedValue(mockProjectAllBoardsResponse); @@ -92,8 +88,6 @@ describe('BoardsSelector', () => { projectRecentBoardsQueryHandler = projectRecentBoardsQueryHandlerSuccess, } = {}) => { fakeApollo = createMockApollo([ - [projectBoardQuery, projectBoardQueryHandlerSuccess], - [groupBoardQuery, groupBoardQueryHandlerSuccess], [projectBoardsQuery, projectBoardsQueryHandler], [groupBoardsQuery, groupBoardsQueryHandlerSuccess], [projectRecentBoardsQuery, projectRecentBoardsQueryHandler], @@ -133,12 +127,13 @@ describe('BoardsSelector', () => { describe('loading', () => { // we are testing loading state, so don't resolve responses until after the tests afterEach(async () => { - await nextTick(); + await waitForPromises(); }); - it('shows loading spinner', () => { + it('shows loading spinner', async () => { // Emits gl-dropdown show event to simulate the dropdown is opened at initialization time findDropdown().vm.$emit('show'); + await nextTick(); expect(getLoadingIcon().exists()).toBe(true); expect(getDropdownHeaders()).toHaveLength(0); @@ -251,23 +246,4 @@ describe('BoardsSelector', () => { expect(notCalledHandler).not.toHaveBeenCalled(); }); }); - - describe('fetching current board', () => { - it.each` - boardType | queryHandler | notCalledHandler - ${BoardType.group} | ${groupBoardQueryHandlerSuccess} | ${projectBoardQueryHandlerSuccess} - ${BoardType.project} | ${projectBoardQueryHandlerSuccess} | ${groupBoardQueryHandlerSuccess} - `('fetches $boardType board', async ({ boardType, queryHandler, notCalledHandler }) => { - createStore({ - isProjectBoard: boardType === BoardType.project, - isGroupBoard: boardType === BoardType.group, - }); - createComponent(); - - await nextTick(); - - expect(queryHandler).toHaveBeenCalled(); - expect(notCalledHandler).not.toHaveBeenCalled(); - }); - }); }); |