diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-07-19 18:09:10 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-07-19 18:09:10 +0300 |
commit | 9c8e8b5ffc6e11d827fa42f2dce5f90c4dc19493 (patch) | |
tree | fef494515627439a22a06addc7ff5f57d418778a /spec/frontend/work_items/components/work_item_links/work_item_links_menu_spec.js | |
parent | 690c904b5e340f14c04f93ff688b647b46f7d1a2 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/work_items/components/work_item_links/work_item_links_menu_spec.js')
-rw-r--r-- | spec/frontend/work_items/components/work_item_links/work_item_links_menu_spec.js | 141 |
1 files changed, 141 insertions, 0 deletions
diff --git a/spec/frontend/work_items/components/work_item_links/work_item_links_menu_spec.js b/spec/frontend/work_items/components/work_item_links/work_item_links_menu_spec.js new file mode 100644 index 00000000000..f8471b7f167 --- /dev/null +++ b/spec/frontend/work_items/components/work_item_links/work_item_links_menu_spec.js @@ -0,0 +1,141 @@ +import Vue from 'vue'; +import { GlDropdown, GlDropdownItem } from '@gitlab/ui'; +import { cloneDeep } from 'lodash'; +import VueApollo from 'vue-apollo'; +import createMockApollo from 'helpers/mock_apollo_helper'; +import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; +import waitForPromises from 'helpers/wait_for_promises'; +import WorkItemLinksMenu from '~/work_items/components/work_item_links/work_item_links_menu.vue'; +import changeWorkItemParentMutation from '~/work_items/graphql/change_work_item_parent_link.mutation.graphql'; +import getWorkItemLinksQuery from '~/work_items/graphql/work_item_links.query.graphql'; +import { WIDGET_TYPE_HIERARCHY } from '~/work_items/constants'; +import { workItemHierarchyResponse, changeWorkItemParentMutationResponse } from '../../mock_data'; + +Vue.use(VueApollo); + +const PARENT_ID = 'gid://gitlab/WorkItem/1'; +const WORK_ITEM_ID = 'gid://gitlab/WorkItem/3'; + +describe('WorkItemLinksMenu', () => { + let wrapper; + let mockApollo; + + const $toast = { + show: jest.fn(), + }; + + const createComponent = async ({ + data = {}, + mutationHandler = jest.fn().mockResolvedValue(changeWorkItemParentMutationResponse), + } = {}) => { + mockApollo = createMockApollo([ + [getWorkItemLinksQuery, jest.fn().mockResolvedValue(workItemHierarchyResponse)], + [changeWorkItemParentMutation, mutationHandler], + ]); + + mockApollo.clients.defaultClient.cache.writeQuery({ + query: getWorkItemLinksQuery, + variables: { + id: PARENT_ID, + }, + data: workItemHierarchyResponse.data, + }); + + wrapper = shallowMountExtended(WorkItemLinksMenu, { + data() { + return { + ...data, + }; + }, + propsData: { + workItemId: WORK_ITEM_ID, + parentWorkItemId: PARENT_ID, + }, + apolloProvider: mockApollo, + mocks: { + $toast, + }, + }); + + await waitForPromises(); + }; + + const findDropdown = () => wrapper.find(GlDropdown); + const findRemoveDropdownItem = () => wrapper.find(GlDropdownItem); + + beforeEach(async () => { + await createComponent(); + }); + + afterEach(() => { + wrapper.destroy(); + mockApollo = null; + }); + + it('renders dropdown and dropdown items', () => { + expect(findDropdown().exists()).toBe(true); + expect(findRemoveDropdownItem().exists()).toBe(true); + }); + + it('calls correct mutation with correct variables', async () => { + const mutationHandler = jest.fn().mockResolvedValue(changeWorkItemParentMutationResponse); + + createComponent({ mutationHandler }); + + findRemoveDropdownItem().vm.$emit('click'); + + await waitForPromises(); + + expect(mutationHandler).toHaveBeenCalledWith({ + id: WORK_ITEM_ID, + parentId: null, + }); + }); + + it('shows toast when mutation succeeds', async () => { + const mutationHandler = jest.fn().mockResolvedValue(changeWorkItemParentMutationResponse); + + createComponent({ mutationHandler }); + + findRemoveDropdownItem().vm.$emit('click'); + + await waitForPromises(); + + expect($toast.show).toHaveBeenCalledWith('Child removed', { + action: { onClick: expect.anything(), text: 'Undo' }, + }); + }); + + it('updates the cache when mutation succeeds', async () => { + const mutationHandler = jest.fn().mockResolvedValue(changeWorkItemParentMutationResponse); + + createComponent({ mutationHandler }); + + mockApollo.clients.defaultClient.cache.readQuery = jest.fn( + () => workItemHierarchyResponse.data, + ); + + mockApollo.clients.defaultClient.cache.writeQuery = jest.fn(); + + findRemoveDropdownItem().vm.$emit('click'); + + await waitForPromises(); + + // Remove the work item from parent's children + const resp = cloneDeep(workItemHierarchyResponse); + const index = resp.data.workItem.widgets + .find((widget) => widget.type === WIDGET_TYPE_HIERARCHY) + .children.nodes.findIndex((child) => child.id === WORK_ITEM_ID); + resp.data.workItem.widgets + .find((widget) => widget.type === WIDGET_TYPE_HIERARCHY) + .children.nodes.splice(index, 1); + + expect(mockApollo.clients.defaultClient.cache.writeQuery).toHaveBeenCalledWith( + expect.objectContaining({ + query: expect.anything(), + variables: { id: PARENT_ID }, + data: resp.data, + }), + ); + }); +}); |