1 files changed, 37 insertions, 4 deletions
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);
+    });
+  });
 });