diff options
Diffstat (limited to 'spec/frontend/packages_and_registries/package_registry/components')
9 files changed, 39 insertions, 363 deletions
diff --git a/spec/frontend/packages_and_registries/package_registry/components/details/__snapshots__/version_row_spec.js.snap b/spec/frontend/packages_and_registries/package_registry/components/details/__snapshots__/version_row_spec.js.snap index c95538546c1..7aa42a1f1e5 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/details/__snapshots__/version_row_spec.js.snap +++ b/spec/frontend/packages_and_registries/package_registry/components/details/__snapshots__/version_row_spec.js.snap @@ -5,7 +5,7 @@ exports[`VersionRow renders 1`] = ` class="gl-display-flex gl-flex-direction-column gl-border-b-solid gl-border-t-solid gl-border-t-1 gl-border-b-1 gl-border-t-transparent gl-border-b-gray-100" > <div - class="gl-display-flex gl-align-items-center gl-py-3 gl-px-5" + class="gl-display-flex gl-align-items-center gl-py-3" > <!----> diff --git a/spec/frontend/packages_and_registries/package_registry/components/details/package_title_spec.js b/spec/frontend/packages_and_registries/package_registry/components/details/package_title_spec.js index d59c3184e4e..6ad6007c9da 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/details/package_title_spec.js +++ b/spec/frontend/packages_and_registries/package_registry/components/details/package_title_spec.js @@ -2,7 +2,7 @@ import { GlIcon, GlSprintf } from '@gitlab/ui'; import { GlBreakpointInstance } from '@gitlab/ui/dist/utils'; import { createMockDirective, getBinding } from 'helpers/vue_mock_directive'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; -import PackageTags from '~/packages/shared/components/package_tags.vue'; +import PackageTags from '~/packages_and_registries/shared/components/package_tags.vue'; import PackageTitle from '~/packages_and_registries/package_registry/components/details/package_title.vue'; import { PACKAGE_TYPE_CONAN, diff --git a/spec/frontend/packages_and_registries/package_registry/components/details/version_row_spec.js b/spec/frontend/packages_and_registries/package_registry/components/details/version_row_spec.js index f7613949fe4..faeca76d746 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/details/version_row_spec.js +++ b/spec/frontend/packages_and_registries/package_registry/components/details/version_row_spec.js @@ -1,8 +1,8 @@ import { GlLink, GlSprintf, GlTruncate } from '@gitlab/ui'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; import { getIdFromGraphQLId } from '~/graphql_shared/utils'; -import PackageTags from '~/packages/shared/components/package_tags.vue'; -import PublishMethod from '~/packages/shared/components/publish_method.vue'; +import PackageTags from '~/packages_and_registries/shared/components/package_tags.vue'; +import PublishMethod from '~/packages_and_registries/shared/components/publish_method.vue'; import VersionRow from '~/packages_and_registries/package_registry/components/details/version_row.vue'; import ListItem from '~/vue_shared/components/registry/list_item.vue'; import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue'; diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/app_spec.js.snap b/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/app_spec.js.snap deleted file mode 100644 index 5af75868084..00000000000 --- a/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/app_spec.js.snap +++ /dev/null @@ -1,69 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`PackagesListApp renders 1`] = ` -<div> - <package-title-stub - count="2" - helpurl="packageHelpUrl" - /> - - <package-search-stub /> - - <div> - <section - class="row empty-state text-center" - > - <div - class="col-12" - > - <div - class="svg-250 svg-content" - > - <img - alt="" - class="gl-max-w-full" - role="img" - src="emptyListIllustration" - /> - </div> - </div> - - <div - class="col-12" - > - <div - class="text-content gl-mx-auto gl-my-0 gl-p-5" - > - <h1 - class="h4" - > - There are no packages yet - </h1> - - <p> - Learn how to - <b-link-stub - class="gl-link" - event="click" - href="emptyListHelpUrl" - routertag="a" - target="_blank" - > - publish and share your packages - </b-link-stub> - with GitLab. - </p> - - <div - class="gl-display-flex gl-flex-wrap gl-justify-content-center" - > - <!----> - - <!----> - </div> - </div> - </div> - </section> - </div> -</div> -`; diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/package_list_row_spec.js.snap b/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/package_list_row_spec.js.snap index 2f2be797251..165ee962417 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/package_list_row_spec.js.snap +++ b/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/package_list_row_spec.js.snap @@ -6,7 +6,7 @@ exports[`packages_list_row renders 1`] = ` data-qa-selector="package_row" > <div - class="gl-display-flex gl-align-items-center gl-py-3 gl-px-5" + class="gl-display-flex gl-align-items-center gl-py-3" > <!----> @@ -77,7 +77,9 @@ exports[`packages_list_row renders 1`] = ` <div class="gl-display-flex gl-align-items-center gl-min-h-6" > - <span> + <span + data-testid="created-date" + > Created <timeago-tooltip-stub cssclass="" @@ -90,7 +92,7 @@ exports[`packages_list_row renders 1`] = ` </div> <div - class="gl-w-9 gl-display-none gl-sm-display-flex gl-justify-content-end gl-pr-1" + class="gl-w-9 gl-display-flex gl-justify-content-end gl-pr-1" > <gl-button-stub aria-label="Remove package" diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/publish_method_spec.js.snap b/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/publish_method_spec.js.snap index 919dbe25ffe..4407c4a2003 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/publish_method_spec.js.snap +++ b/spec/frontend/packages_and_registries/package_registry/components/list/__snapshots__/publish_method_spec.js.snap @@ -37,6 +37,7 @@ exports[`publish_method renders 1`] = ` text="b83d6e391c22777fca1ed3012fce84f633d7fed0" title="Copy commit SHA" tooltipplacement="top" + variant="default" /> </div> `; diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/app_spec.js b/spec/frontend/packages_and_registries/package_registry/components/list/app_spec.js deleted file mode 100644 index ad848f367e0..00000000000 --- a/spec/frontend/packages_and_registries/package_registry/components/list/app_spec.js +++ /dev/null @@ -1,282 +0,0 @@ -import { GlEmptyState, GlSprintf, GlLink } from '@gitlab/ui'; -import { createLocalVue } from '@vue/test-utils'; - -import VueApollo from 'vue-apollo'; -import { nextTick } from 'vue'; -import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; -import createMockApollo from 'helpers/mock_apollo_helper'; -import waitForPromises from 'helpers/wait_for_promises'; -import PackageListApp from '~/packages_and_registries/package_registry/components/list/app.vue'; -import PackageTitle from '~/packages_and_registries/package_registry/components/list/package_title.vue'; -import PackageSearch from '~/packages_and_registries/package_registry/components/list/package_search.vue'; -import OriginalPackageList from '~/packages_and_registries/package_registry/components/list/packages_list.vue'; -import DeletePackage from '~/packages_and_registries/package_registry/components/functional/delete_package.vue'; - -import { - PROJECT_RESOURCE_TYPE, - GROUP_RESOURCE_TYPE, - GRAPHQL_PAGE_SIZE, -} from '~/packages_and_registries/package_registry/constants'; - -import getPackagesQuery from '~/packages_and_registries/package_registry/graphql/queries/get_packages.query.graphql'; - -import { packagesListQuery, packageData, pagination } from '../../mock_data'; - -jest.mock('~/lib/utils/common_utils'); -jest.mock('~/flash'); - -const localVue = createLocalVue(); - -describe('PackagesListApp', () => { - let wrapper; - let apolloProvider; - - const defaultProvide = { - packageHelpUrl: 'packageHelpUrl', - emptyListIllustration: 'emptyListIllustration', - emptyListHelpUrl: 'emptyListHelpUrl', - isGroupPage: true, - fullPath: 'gitlab-org', - }; - - const PackageList = { - name: 'package-list', - template: '<div><slot name="empty-state"></slot></div>', - props: OriginalPackageList.props, - }; - const GlLoadingIcon = { name: 'gl-loading-icon', template: '<div>loading</div>' }; - - const searchPayload = { - sort: 'VERSION_DESC', - filters: { packageName: 'foo', packageType: 'CONAN' }, - }; - - const findPackageTitle = () => wrapper.findComponent(PackageTitle); - const findSearch = () => wrapper.findComponent(PackageSearch); - const findListComponent = () => wrapper.findComponent(PackageList); - const findEmptyState = () => wrapper.findComponent(GlEmptyState); - const findDeletePackage = () => wrapper.findComponent(DeletePackage); - - const mountComponent = ({ - resolver = jest.fn().mockResolvedValue(packagesListQuery()), - provide = defaultProvide, - } = {}) => { - localVue.use(VueApollo); - - const requestHandlers = [[getPackagesQuery, resolver]]; - apolloProvider = createMockApollo(requestHandlers); - - wrapper = shallowMountExtended(PackageListApp, { - localVue, - apolloProvider, - provide, - stubs: { - GlEmptyState, - GlLoadingIcon, - GlSprintf, - GlLink, - PackageList, - DeletePackage, - }, - }); - }; - - afterEach(() => { - wrapper.destroy(); - }); - - const waitForFirstRequest = () => { - // emit a search update so the query is executed - findSearch().vm.$emit('update', { sort: 'NAME_DESC', filters: [] }); - return waitForPromises(); - }; - - it('does not execute the query without sort being set', () => { - const resolver = jest.fn().mockResolvedValue(packagesListQuery()); - - mountComponent({ resolver }); - - expect(resolver).not.toHaveBeenCalled(); - }); - - it('renders', async () => { - mountComponent(); - - await waitForFirstRequest(); - - expect(wrapper.element).toMatchSnapshot(); - }); - - it('has a package title', async () => { - mountComponent(); - - await waitForFirstRequest(); - - expect(findPackageTitle().exists()).toBe(true); - expect(findPackageTitle().props('count')).toBe(2); - }); - - describe('search component', () => { - it('exists', () => { - mountComponent(); - - expect(findSearch().exists()).toBe(true); - }); - - it('on update triggers a new query with updated values', async () => { - const resolver = jest.fn().mockResolvedValue(packagesListQuery()); - mountComponent({ resolver }); - - findSearch().vm.$emit('update', searchPayload); - - await waitForPromises(); - - expect(resolver).toHaveBeenCalledWith( - expect.objectContaining({ - groupSort: searchPayload.sort, - ...searchPayload.filters, - }), - ); - }); - }); - - describe('list component', () => { - let resolver; - - beforeEach(() => { - resolver = jest.fn().mockResolvedValue(packagesListQuery()); - mountComponent({ resolver }); - - return waitForFirstRequest(); - }); - - it('exists and has the right props', () => { - expect(findListComponent().props()).toMatchObject({ - list: expect.arrayContaining([expect.objectContaining({ id: packageData().id })]), - isLoading: false, - pageInfo: expect.objectContaining({ endCursor: pagination().endCursor }), - }); - }); - - it('when list emits next-page fetches the next set of records', () => { - findListComponent().vm.$emit('next-page'); - - expect(resolver).toHaveBeenCalledWith( - expect.objectContaining({ after: pagination().endCursor, first: GRAPHQL_PAGE_SIZE }), - ); - }); - - it('when list emits prev-page fetches the prev set of records', () => { - findListComponent().vm.$emit('prev-page'); - - expect(resolver).toHaveBeenCalledWith( - expect.objectContaining({ before: pagination().startCursor, last: GRAPHQL_PAGE_SIZE }), - ); - }); - }); - - describe.each` - type | sortType - ${PROJECT_RESOURCE_TYPE} | ${'sort'} - ${GROUP_RESOURCE_TYPE} | ${'groupSort'} - `('$type query', ({ type, sortType }) => { - let provide; - let resolver; - - const isGroupPage = type === GROUP_RESOURCE_TYPE; - - beforeEach(() => { - provide = { ...defaultProvide, isGroupPage }; - resolver = jest.fn().mockResolvedValue(packagesListQuery({ type })); - mountComponent({ provide, resolver }); - return waitForFirstRequest(); - }); - - it('succeeds', () => { - expect(findPackageTitle().props('count')).toBe(2); - }); - - it('calls the resolver with the right parameters', () => { - expect(resolver).toHaveBeenCalledWith( - expect.objectContaining({ isGroupPage, [sortType]: 'NAME_DESC' }), - ); - }); - }); - - describe('empty state', () => { - beforeEach(() => { - const resolver = jest.fn().mockResolvedValue(packagesListQuery({ extend: { nodes: [] } })); - mountComponent({ resolver }); - - return waitForFirstRequest(); - }); - it('generate the correct empty list link', () => { - const link = findListComponent().findComponent(GlLink); - - expect(link.attributes('href')).toBe(defaultProvide.emptyListHelpUrl); - expect(link.text()).toBe('publish and share your packages'); - }); - - it('includes the right content on the default tab', () => { - expect(findEmptyState().text()).toContain(PackageListApp.i18n.emptyPageTitle); - }); - }); - - describe('filter without results', () => { - beforeEach(async () => { - mountComponent(); - - await waitForFirstRequest(); - - findSearch().vm.$emit('update', searchPayload); - - return nextTick(); - }); - - it('should show specific empty message', () => { - expect(findEmptyState().text()).toContain(PackageListApp.i18n.noResultsTitle); - expect(findEmptyState().text()).toContain(PackageListApp.i18n.widenFilters); - }); - }); - - describe('delete package', () => { - it('exists and has the correct props', async () => { - mountComponent(); - - await waitForFirstRequest(); - - expect(findDeletePackage().props()).toMatchObject({ - refetchQueries: [{ query: getPackagesQuery, variables: {} }], - showSuccessAlert: true, - }); - }); - - it('deletePackage is bound to package-list package:delete event', async () => { - mountComponent(); - - await waitForFirstRequest(); - - findListComponent().vm.$emit('package:delete', { id: 1 }); - - expect(findDeletePackage().emitted('start')).toEqual([[]]); - }); - - it('start and end event set loading correctly', async () => { - mountComponent(); - - await waitForFirstRequest(); - - findDeletePackage().vm.$emit('start'); - - await nextTick(); - - expect(findListComponent().props('isLoading')).toBe(true); - - findDeletePackage().vm.$emit('end'); - - await nextTick(); - - expect(findListComponent().props('isLoading')).toBe(false); - }); - }); -}); diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/package_list_row_spec.js b/spec/frontend/packages_and_registries/package_registry/components/list/package_list_row_spec.js index a276db104d7..292667ec47c 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/list/package_list_row_spec.js +++ b/spec/frontend/packages_and_registries/package_registry/components/list/package_list_row_spec.js @@ -3,9 +3,11 @@ import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; import { createMockDirective, getBinding } from 'helpers/vue_mock_directive'; import PackagesListRow from '~/packages_and_registries/package_registry/components/list/package_list_row.vue'; -import PackagePath from '~/packages/shared/components/package_path.vue'; -import PackageTags from '~/packages/shared/components/package_tags.vue'; -import PackageIconAndName from '~/packages/shared/components/package_icon_and_name.vue'; +import PackagePath from '~/packages_and_registries/shared/components/package_path.vue'; +import PackageTags from '~/packages_and_registries/shared/components/package_tags.vue'; +import PackageIconAndName from '~/packages_and_registries/shared/components/package_icon_and_name.vue'; +import PublishMethod from '~/packages_and_registries/package_registry/components/list/publish_method.vue'; +import TimeagoTooltip from '~/vue_shared/components/time_ago_tooltip.vue'; import { PACKAGE_ERROR_STATUS } from '~/packages_and_registries/package_registry/constants'; import ListItem from '~/vue_shared/components/registry/list_item.vue'; @@ -29,6 +31,9 @@ describe('packages_list_row', () => { const findPackageLink = () => wrapper.findComponent(GlLink); const findWarningIcon = () => wrapper.findByTestId('warning-icon'); const findLeftSecondaryInfos = () => wrapper.findByTestId('left-secondary-infos'); + const findPublishMethod = () => wrapper.findComponent(PublishMethod); + const findCreatedDateText = () => wrapper.findByTestId('created-date'); + const findTimeAgoTooltip = () => wrapper.findComponent(TimeagoTooltip); const mountComponent = ({ packageEntity = packageWithoutTags, @@ -153,4 +158,23 @@ describe('packages_list_row', () => { expect(findPackageIconAndName().text()).toBe(packageWithoutTags.packageType.toLowerCase()); }); }); + + describe('right info', () => { + it('has publish method component', () => { + mountComponent({ + packageEntity: { ...packageWithoutTags, pipelines: { nodes: packagePipelines() } }, + }); + + expect(findPublishMethod().props('pipeline')).toEqual(packagePipelines()[0]); + }); + + it('has the created date', () => { + mountComponent(); + + expect(findCreatedDateText().text()).toMatchInterpolatedText(PackagesListRow.i18n.createdAt); + expect(findTimeAgoTooltip().props()).toMatchObject({ + time: packageData().createdAt, + }); + }); + }); }); diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js b/spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js index de4e9c8ae5b..97978dee909 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js +++ b/spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js @@ -1,8 +1,8 @@ import { GlKeysetPagination, GlModal, GlSprintf } from '@gitlab/ui'; import { nextTick } from 'vue'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; -import PackagesListRow from '~/packages/shared/components/package_list_row.vue'; -import PackagesListLoader from '~/packages/shared/components/packages_list_loader.vue'; +import PackagesListRow from '~/packages_and_registries/package_registry/components/list/package_list_row.vue'; +import PackagesListLoader from '~/packages_and_registries/shared/components/packages_list_loader.vue'; import { DELETE_PACKAGE_TRACKING_ACTION, REQUEST_DELETE_PACKAGE_TRACKING_ACTION, |