Commit 0112316a authored by Natalia Tepluhina's avatar Natalia Tepluhina Committed by Nicolò Maria Mezzopera

Migrate `deleteBoard` board_store function to GraphQL mutation

parent 3af576f8
......@@ -10,6 +10,7 @@ import { fullLabelId, fullBoardId } from '../boards_util';
import BoardConfigurationOptions from './board_configuration_options.vue';
import updateBoardMutation from '../graphql/board_update.mutation.graphql';
import createBoardMutation from '../graphql/board_create.mutation.graphql';
import destroyBoardMutation from '../graphql/board_destroy.mutation.graphql';
const boardDefaults = {
id: false,
......@@ -95,6 +96,9 @@ export default {
fullPath: {
default: '',
},
rootPath: {
default: '',
},
},
data() {
return {
......@@ -221,8 +225,13 @@ export default {
this.isLoading = true;
if (this.isDeleteForm) {
try {
await boardsStore.deleteBoard(this.currentBoard);
visitUrl(boardsStore.rootPath);
await this.$apollo.mutate({
mutation: destroyBoardMutation,
variables: {
id: fullBoardId(this.board.id),
},
});
visitUrl(this.rootPath);
} catch {
Flash(this.$options.i18n.deleteErrorMessage);
} finally {
......
mutation destroyBoard($id: BoardID!) {
destroyBoard(input: { id: $id }) {
board {
id
}
}
}
......@@ -336,5 +336,6 @@ export default () => {
mountMultipleBoardsSwitcher({
fullPath: $boardApp.dataset.fullPath,
rootPath: $boardApp.dataset.boardsEndpoint,
});
};
......@@ -37,6 +37,7 @@ export default (params = {}) => {
},
provide: {
fullPath: params.fullPath,
rootPath: params.rootPath,
},
render(createElement) {
return createElement(BoardsSelector, {
......
......@@ -753,10 +753,6 @@ const boardsStore = {
return axios.get(this.state.endpoints.recentBoardsEndpoint);
},
deleteBoard({ id }) {
return axios.delete(this.generateBoardsPath(id));
},
setCurrentBoard(board) {
this.state.currentBoard = board;
},
......
---
title: Migrate `deleteBoard` board_store function to GraphQL mutation
merge_request: 51069
author:
type: changed
......@@ -456,24 +456,6 @@ describe('boardsStore', () => {
});
});
describe('deleteBoard', () => {
const id = 'capsized';
const url = `${endpoints.boardsEndpoint}/${id}.json`;
it('makes a request to delete a boards', () => {
axiosMock.onDelete(url).replyOnce(200, dummyResponse);
const expectedResponse = expect.objectContaining({ data: dummyResponse });
return expect(boardsStore.deleteBoard({ id })).resolves.toEqual(expectedResponse);
});
it('fails for error response', () => {
axiosMock.onDelete(url).replyOnce(500);
return expect(boardsStore.deleteBoard({ id })).rejects.toThrow();
});
});
describe('when created', () => {
beforeEach(() => {
setupDefaultResponses();
......
......@@ -4,16 +4,19 @@ import { TEST_HOST } from 'jest/helpers/test_constants';
import { GlModal } from '@gitlab/ui';
import waitForPromises from 'helpers/wait_for_promises';
import { deprecatedCreateFlash as createFlash } from '~/flash';
import { visitUrl } from '~/lib/utils/url_utility';
import boardsStore from '~/boards/stores/boards_store';
import BoardForm from '~/boards/components/board_form.vue';
import updateBoardMutation from '~/boards/graphql/board_update.mutation.graphql';
import createBoardMutation from '~/boards/graphql/board_create.mutation.graphql';
import destroyBoardMutation from '~/boards/graphql/board_destroy.mutation.graphql';
jest.mock('~/lib/utils/url_utility', () => ({
visitUrl: jest.fn().mockName('visitUrlMock'),
stripFinalUrlSegment: jest.requireActual('~/lib/utils/url_utility').stripFinalUrlSegment,
}));
jest.mock('~/flash');
const currentBoard = {
id: 1,
......@@ -34,19 +37,9 @@ const defaultProps = {
currentBoard,
};
const endpoints = {
boardsEndpoint: 'test-endpoint',
};
const mutate = jest.fn().mockResolvedValue({
data: {
createBoard: { board: { id: 'gid://gitlab/Board/123' } },
updateBoard: { board: { id: 'gid://gitlab/Board/321' } },
},
});
describe('BoardForm', () => {
let wrapper;
let mutate;
const findModal = () => wrapper.find(GlModal);
const findModalActionPrimary = () => findModal().props('actionPrimary');
......@@ -64,7 +57,7 @@ describe('BoardForm', () => {
};
},
provide: {
endpoints,
rootPath: 'root',
},
mocks: {
$apollo: {
......@@ -83,6 +76,7 @@ describe('BoardForm', () => {
wrapper.destroy();
wrapper = null;
boardsStore.state.currentPage = null;
mutate = null;
});
describe('when user can not admin the board', () => {
......@@ -156,6 +150,20 @@ describe('BoardForm', () => {
});
describe('when submitting a create event', () => {
const fillForm = () => {
findInput().value = 'Test name';
findInput().trigger('input');
findInput().trigger('keyup.enter', { metaKey: true });
};
beforeEach(() => {
mutate = jest.fn().mockResolvedValue({
data: {
createBoard: { board: { id: 'gid://gitlab/Board/123' } },
},
});
});
it('does not call API if board name is empty', async () => {
createComponent({ canAdminBoard: true });
findInput().trigger('keyup.enter', { metaKey: true });
......@@ -168,10 +176,7 @@ describe('BoardForm', () => {
it('calls a correct GraphQL mutation and redirects to correct page from existing board', async () => {
window.location = new URL('https://test/boards/1');
createComponent({ canAdminBoard: true });
findInput().value = 'Test name';
findInput().trigger('input');
findInput().trigger('keyup.enter', { metaKey: true });
fillForm();
await waitForPromises();
......@@ -191,10 +196,7 @@ describe('BoardForm', () => {
it('calls a correct GraphQL mutation and redirects to correct page from boards list', async () => {
window.location = new URL('https://test/boards');
createComponent({ canAdminBoard: true });
findInput().value = 'Test name';
findInput().trigger('input');
findInput().trigger('keyup.enter', { metaKey: true });
fillForm();
await waitForPromises();
......@@ -210,6 +212,20 @@ describe('BoardForm', () => {
await waitForPromises();
expect(visitUrl).toHaveBeenCalledWith('boards/123');
});
it('shows an error flash if GraphQL mutation fails', async () => {
mutate = jest.fn().mockRejectedValue('Houston, we have a problem');
createComponent({ canAdminBoard: true });
fillForm();
await waitForPromises();
expect(mutate).toHaveBeenCalled();
await waitForPromises();
expect(visitUrl).not.toHaveBeenCalled();
expect(createFlash).toHaveBeenCalled();
});
});
});
......@@ -245,27 +261,93 @@ describe('BoardForm', () => {
});
});
describe('when submitting an update event', () => {
it('calls REST and GraphQL API with correct parameters', async () => {
window.location = new URL('https://test/boards/1');
createComponent({ canAdminBoard: true });
it('calls GraphQL mutation with correct parameters', async () => {
mutate = jest.fn().mockResolvedValue({
data: {
updateBoard: { board: { id: 'gid://gitlab/Board/321' } },
},
});
window.location = new URL('https://test/boards/1');
createComponent({ canAdminBoard: true });
findInput().trigger('keyup.enter', { metaKey: true });
findInput().trigger('keyup.enter', { metaKey: true });
await waitForPromises();
await waitForPromises();
expect(mutate).toHaveBeenCalledWith({
mutation: updateBoardMutation,
variables: {
input: expect.objectContaining({
id: `gid://gitlab/Board/${currentBoard.id}`,
}),
},
});
expect(mutate).toHaveBeenCalledWith({
mutation: updateBoardMutation,
variables: {
input: expect.objectContaining({
id: `gid://gitlab/Board/${currentBoard.id}`,
}),
},
});
await waitForPromises();
expect(visitUrl).toHaveBeenCalledWith('321');
await waitForPromises();
expect(visitUrl).toHaveBeenCalledWith('321');
});
it('shows an error flash if GraphQL mutation fails', async () => {
mutate = jest.fn().mockRejectedValue('Houston, we have a problem');
createComponent({ canAdminBoard: true });
findInput().trigger('keyup.enter', { metaKey: true });
await waitForPromises();
expect(mutate).toHaveBeenCalled();
await waitForPromises();
expect(visitUrl).not.toHaveBeenCalled();
expect(createFlash).toHaveBeenCalled();
});
});
describe('when deleting a board', () => {
beforeEach(() => {
boardsStore.state.currentPage = 'delete';
});
it('passes correct primary action text and variant', () => {
createComponent({ canAdminBoard: true });
expect(findModalActionPrimary().text).toBe('Delete');
expect(findModalActionPrimary().attributes[0].variant).toBe('danger');
});
it('renders delete confirmation message', () => {
createComponent({ canAdminBoard: true });
expect(findDeleteConfirmation().exists()).toBe(true);
});
it('calls a correct GraphQL mutation and redirects to correct page after deleting board', async () => {
mutate = jest.fn().mockResolvedValue({});
createComponent({ canAdminBoard: true });
findModal().vm.$emit('primary');
await waitForPromises();
expect(mutate).toHaveBeenCalledWith({
mutation: destroyBoardMutation,
variables: {
id: 'gid://gitlab/Board/1',
},
});
await waitForPromises();
expect(visitUrl).toHaveBeenCalledWith('root');
});
it('shows an error flash if GraphQL mutation fails', async () => {
mutate = jest.fn().mockRejectedValue('Houston, we have a problem');
createComponent({ canAdminBoard: true });
findModal().vm.$emit('primary');
await waitForPromises();
expect(mutate).toHaveBeenCalled();
await waitForPromises();
expect(visitUrl).not.toHaveBeenCalled();
expect(createFlash).toHaveBeenCalled();
});
});
});
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment