diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-03-25 00:14:02 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-03-25 00:14:02 +0300 |
commit | f89c44943e6840749826ea452c142f1c80a8cd1c (patch) | |
tree | 56e6296a4b74f0dd244483a21eb437cb4299a94d /spec/frontend/repository | |
parent | 96fe4609c9acd574cbf61be4d28c63dda2db34d4 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/repository')
-rw-r--r-- | spec/frontend/repository/components/breadcrumbs_spec.js | 107 |
1 files changed, 69 insertions, 38 deletions
diff --git a/spec/frontend/repository/components/breadcrumbs_spec.js b/spec/frontend/repository/components/breadcrumbs_spec.js index 8b7a7d91125..f4baa817d32 100644 --- a/spec/frontend/repository/components/breadcrumbs_spec.js +++ b/spec/frontend/repository/components/breadcrumbs_spec.js @@ -1,27 +1,60 @@ +import Vue, { nextTick } from 'vue'; +import VueApollo from 'vue-apollo'; import { GlDropdown } from '@gitlab/ui'; import { shallowMount, RouterLinkStub } from '@vue/test-utils'; -import { nextTick } from 'vue'; import Breadcrumbs from '~/repository/components/breadcrumbs.vue'; import UploadBlobModal from '~/repository/components/upload_blob_modal.vue'; import NewDirectoryModal from '~/repository/components/new_directory_modal.vue'; +import waitForPromises from 'helpers/wait_for_promises'; + +import permissionsQuery from 'shared_queries/repository/permissions.query.graphql'; +import projectPathQuery from '~/repository/queries/project_path.query.graphql'; + +import createApolloProvider from 'helpers/mock_apollo_helper'; const defaultMockRoute = { name: 'blobPath', }; +const TEST_PROJECT_PATH = 'test-project/path'; + +Vue.use(VueApollo); + describe('Repository breadcrumbs component', () => { let wrapper; - - const factory = (currentPath, extraProps = {}, mockRoute = {}) => { - const $apollo = { - queries: { + let permissionsQuerySpy; + + const createPermissionsQueryResponse = ({ + pushCode = false, + forkProject = false, + createMergeRequestIn = false, + } = {}) => ({ + data: { + project: { + id: 1, + __typename: '__typename', userPermissions: { - loading: true, + __typename: '__typename', + pushCode, + forkProject, + createMergeRequestIn, }, }, - }; + }, + }); + + const factory = (currentPath, extraProps = {}, mockRoute = {}) => { + const apolloProvider = createApolloProvider([[permissionsQuery, permissionsQuerySpy]]); + + apolloProvider.clients.defaultClient.cache.writeQuery({ + query: projectPathQuery, + data: { + projectPath: TEST_PROJECT_PATH, + }, + }); wrapper = shallowMount(Breadcrumbs, { + apolloProvider, propsData: { currentPath, ...extraProps, @@ -34,13 +67,29 @@ describe('Repository breadcrumbs component', () => { defaultMockRoute, ...mockRoute, }, - $apollo, }, }); }; + const findDropdown = () => wrapper.findComponent(GlDropdown); const findUploadBlobModal = () => wrapper.findComponent(UploadBlobModal); const findNewDirectoryModal = () => wrapper.findComponent(NewDirectoryModal); + const findRouterLink = () => wrapper.findAllComponents(RouterLinkStub); + + beforeEach(() => { + permissionsQuerySpy = jest.fn().mockResolvedValue(createPermissionsQueryResponse()); + }); + + it('queries for permissions', async () => { + factory('/'); + + // We need to wait for the projectPath query to resolve + await waitForPromises(); + + expect(permissionsQuerySpy).toHaveBeenCalledWith({ + projectPath: TEST_PROJECT_PATH, + }); + }); it.each` path | linkCount @@ -51,7 +100,7 @@ describe('Repository breadcrumbs component', () => { `('renders $linkCount links for path $path', ({ path, linkCount }) => { factory(path); - expect(wrapper.findAllComponents(RouterLinkStub).length).toEqual(linkCount); + expect(findRouterLink().length).toEqual(linkCount); }); it.each` @@ -64,36 +113,27 @@ describe('Repository breadcrumbs component', () => { 'links to the correct router path when routeName is $routeName', ({ routeName, path, linkTo }) => { factory(path, {}, { name: routeName }); - expect(wrapper.findAllComponents(RouterLinkStub).at(3).props('to')).toEqual(linkTo); + expect(findRouterLink().at(3).props('to')).toEqual(linkTo); }, ); it('escapes hash in directory path', () => { factory('app/assets/javascripts#'); - expect(wrapper.findAllComponents(RouterLinkStub).at(3).props('to')).toEqual( - '/-/tree/app/assets/javascripts%23', - ); + expect(findRouterLink().at(3).props('to')).toEqual('/-/tree/app/assets/javascripts%23'); }); it('renders last link as active', () => { factory('app/assets'); - expect(wrapper.findAllComponents(RouterLinkStub).at(2).attributes('aria-current')).toEqual( - 'page', - ); + expect(findRouterLink().at(2).attributes('aria-current')).toEqual('page'); }); it('does not render add to tree dropdown when permissions are false', async () => { - factory('/', { canCollaborate: false }); - - // setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details - // eslint-disable-next-line no-restricted-syntax - wrapper.setData({ userPermissions: { forkProject: false, createMergeRequestIn: false } }); - + factory('/', { canCollaborate: false }, {}); await nextTick(); - expect(wrapper.findComponent(GlDropdown).exists()).toBe(false); + expect(findDropdown().exists()).toBe(false); }); it.each` @@ -107,20 +147,19 @@ describe('Repository breadcrumbs component', () => { 'does render add to tree dropdown $isRendered when route is $routeName', ({ routeName, isRendered }) => { factory('app/assets/javascripts.js', { canCollaborate: true }, { name: routeName }); - expect(wrapper.findComponent(GlDropdown).exists()).toBe(isRendered); + expect(findDropdown().exists()).toBe(isRendered); }, ); it('renders add to tree dropdown when permissions are true', async () => { - factory('/', { canCollaborate: true }); - - // setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details - // eslint-disable-next-line no-restricted-syntax - wrapper.setData({ userPermissions: { forkProject: true, createMergeRequestIn: true } }); + permissionsQuerySpy.mockResolvedValue( + createPermissionsQueryResponse({ forkProject: true, createMergeRequestIn: true }), + ); + factory('/', { canCollaborate: true }); await nextTick(); - expect(wrapper.findComponent(GlDropdown).exists()).toBe(true); + expect(findDropdown().exists()).toBe(true); }); describe('renders the upload blob modal', () => { @@ -133,10 +172,6 @@ describe('Repository breadcrumbs component', () => { }); it('renders the modal once loaded', async () => { - // setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details - // eslint-disable-next-line no-restricted-syntax - wrapper.setData({ $apollo: { queries: { userPermissions: { loading: false } } } }); - await nextTick(); expect(findUploadBlobModal().exists()).toBe(true); @@ -152,10 +187,6 @@ describe('Repository breadcrumbs component', () => { }); it('renders the modal once loaded', async () => { - // setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details - // eslint-disable-next-line no-restricted-syntax - wrapper.setData({ $apollo: { queries: { userPermissions: { loading: false } } } }); - await nextTick(); expect(findNewDirectoryModal().exists()).toBe(true); |