diff options
Diffstat (limited to 'spec/frontend/packages/shared')
4 files changed, 71 insertions, 18 deletions
diff --git a/spec/frontend/packages/shared/components/__snapshots__/package_list_row_spec.js.snap b/spec/frontend/packages/shared/components/__snapshots__/package_list_row_spec.js.snap index 77095f7c611..03b98478f3e 100644 --- a/spec/frontend/packages/shared/components/__snapshots__/package_list_row_spec.js.snap +++ b/spec/frontend/packages/shared/components/__snapshots__/package_list_row_spec.js.snap @@ -51,20 +51,7 @@ exports[`packages_list_row renders 1`] = ` <!----> - <div - class="d-flex align-items-center" - data-testid="package-type" - > - <gl-icon-stub - class="gl-ml-3 gl-mr-2" - name="package" - size="16" - /> - - <span> - Maven - </span> - </div> + <div /> <package-path-stub path="foo/bar/baz" diff --git a/spec/frontend/packages/shared/components/package_icon_and_name_spec.js b/spec/frontend/packages/shared/components/package_icon_and_name_spec.js new file mode 100644 index 00000000000..c96a570a29c --- /dev/null +++ b/spec/frontend/packages/shared/components/package_icon_and_name_spec.js @@ -0,0 +1,32 @@ +import { GlIcon } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; +import PackageIconAndName from '~/packages/shared/components/package_icon_and_name.vue'; + +describe('PackageIconAndName', () => { + let wrapper; + + const findIcon = () => wrapper.find(GlIcon); + + const mountComponent = () => { + wrapper = shallowMount(PackageIconAndName, { + slots: { + default: 'test', + }, + }); + }; + + it('has an icon', () => { + mountComponent(); + + const icon = findIcon(); + + expect(icon.exists()).toBe(true); + expect(icon.props('name')).toBe('package'); + }); + + it('renders the slot content', () => { + mountComponent(); + + expect(wrapper.text()).toBe('test'); + }); +}); diff --git a/spec/frontend/packages/shared/components/package_list_row_spec.js b/spec/frontend/packages/shared/components/package_list_row_spec.js index 1c0ef7e3539..fd54cd0f25d 100644 --- a/spec/frontend/packages/shared/components/package_list_row_spec.js +++ b/spec/frontend/packages/shared/components/package_list_row_spec.js @@ -1,7 +1,9 @@ import { shallowMount } from '@vue/test-utils'; + import PackagesListRow from '~/packages/shared/components/package_list_row.vue'; import PackagePath from '~/packages/shared/components/package_path.vue'; import PackageTags from '~/packages/shared/components/package_tags.vue'; + import ListItem from '~/vue_shared/components/registry/list_item.vue'; import { packageList } from '../../mock_data'; @@ -11,20 +13,30 @@ describe('packages_list_row', () => { const [packageWithoutTags, packageWithTags] = packageList; + const InfrastructureIconAndName = { name: 'InfrastructureIconAndName', template: '<div></div>' }; + const PackageIconAndName = { name: 'PackageIconAndName', template: '<div></div>' }; + const findPackageTags = () => wrapper.find(PackageTags); const findPackagePath = () => wrapper.find(PackagePath); const findDeleteButton = () => wrapper.find('[data-testid="action-delete"]'); - const findPackageType = () => wrapper.find('[data-testid="package-type"]'); + const findPackageIconAndName = () => wrapper.find(PackageIconAndName); + const findInfrastructureIconAndName = () => wrapper.find(InfrastructureIconAndName); const mountComponent = ({ isGroup = false, packageEntity = packageWithoutTags, showPackageType = true, disableDelete = false, + provide, } = {}) => { wrapper = shallowMount(PackagesListRow, { store, - stubs: { ListItem }, + provide, + stubs: { + ListItem, + InfrastructureIconAndName, + PackageIconAndName, + }, propsData: { packageLink: 'foo', packageEntity, @@ -72,13 +84,13 @@ describe('packages_list_row', () => { it('shows the type when set', () => { mountComponent(); - expect(findPackageType().exists()).toBe(true); + expect(findPackageIconAndName().exists()).toBe(true); }); it('does not show the type when not set', () => { mountComponent({ showPackageType: false }); - expect(findPackageType().exists()).toBe(false); + expect(findPackageIconAndName().exists()).toBe(false); }); }); @@ -113,4 +125,25 @@ describe('packages_list_row', () => { expect(wrapper.emitted('packageToDelete')[0]).toEqual([packageWithoutTags]); }); }); + + describe('Infrastructure config', () => { + it('defaults to package registry components', () => { + mountComponent(); + + expect(findPackageIconAndName().exists()).toBe(true); + expect(findInfrastructureIconAndName().exists()).toBe(false); + }); + + it('mounts different component based on the provided values', () => { + mountComponent({ + provide: { + iconComponent: 'InfrastructureIconAndName', + }, + }); + + expect(findPackageIconAndName().exists()).toBe(false); + + expect(findInfrastructureIconAndName().exists()).toBe(true); + }); + }); }); diff --git a/spec/frontend/packages/shared/utils_spec.js b/spec/frontend/packages/shared/utils_spec.js index 4a95def1bef..463e4a4febb 100644 --- a/spec/frontend/packages/shared/utils_spec.js +++ b/spec/frontend/packages/shared/utils_spec.js @@ -38,6 +38,7 @@ describe('Packages shared utils', () => { ${'npm'} | ${'npm'} ${'nuget'} | ${'NuGet'} ${'pypi'} | ${'PyPI'} + ${'rubygems'} | ${'RubyGems'} ${'composer'} | ${'Composer'} ${'foo'} | ${null} `(`package type`, ({ packageType, expectedResult }) => { |