Add unit test for ProjectsExistWrapper

frontend/packages/dev-console/src/components/EmptyState.tsx

@@ -1,9 +1,8 @@
 import * as React from 'react';
 import { Gallery, GalleryItem } from '@patternfly/react-core';
 import { CatalogTile } from '@patternfly/react-catalog-view-extension';
-import { connect } from 'react-redux';
 import { history, PageHeading, useAccessReview } from '@console/internal/components/utils';
-import { formatNamespacedRouteForResource } from '@console/internal/actions/ui';
+import { formatNamespacedRouteForResource, getActiveNamespace } from '@console/internal/actions/ui';
 import {
   BuildConfigModel,
   ImageStreamModel,
@@ -19,16 +18,12 @@ import * as yamlIcon from '../images/yaml.svg';
 import * as dockerfileIcon from '../images/dockerfile.svg';
 import './EmptyState.scss';
 
-interface StateProps {
-  activeNamespace: string;
-}
-
 export interface EmptySProps {
   title: string;
   hintBlock?: React.ReactNode;
 }
 
-type Props = EmptySProps & StateProps;
+type Props = EmptySProps;
 
 const navigateTo = (e: React.SyntheticEvent, url: string) => {
   history.push(url);
@@ -46,9 +41,9 @@ const resourceAttributes = (model: K8sKind, namespace: string): AccessReviewReso
 
 const ODCEmptyState: React.FC<Props> = ({
   title,
-  activeNamespace,
   hintBlock = 'Select a way to create an application, component or service from one of the options.',
 }) => {
+  const activeNamespace = getActiveNamespace();
   const buildConfigsAccess = useAccessReview(resourceAttributes(BuildConfigModel, activeNamespace));
   const imageStreamAccess = useAccessReview(resourceAttributes(ImageStreamModel, activeNamespace));
   const deploymentConfigAccess = useAccessReview(
@@ -160,10 +155,4 @@ const ODCEmptyState: React.FC<Props> = ({
   );
 };
 
-const mapStateToProps = (state): StateProps => {
-  return {
-    activeNamespace: state.UI.get('activeNamespace'),
-  };
-};
-
-export default connect<StateProps>(mapStateToProps)(ODCEmptyState);
+export default ODCEmptyState;

frontend/packages/dev-console/src/components/__tests__/ProjectsExistWrapper.spec.tsx

@@ -0,0 +1,70 @@
+import * as React from 'react';
+import { shallow } from 'enzyme';
+import * as _ from 'lodash';
+import ProjectsExistWrapper from '../ProjectsExistWrapper';
+
+const projects: any = {
+  data: [],
+  loaded: true,
+};
+
+describe('ProjectsExistWrapper', () => {
+  it('should render projects exist wrapper component', () => {
+    const wrapper = shallow(
+      <ProjectsExistWrapper title="Topology" projects={projects}>
+        {}
+      </ProjectsExistWrapper>,
+    );
+    expect(wrapper).toBeTruthy();
+  });
+
+  it('should show loading box', () => {
+    const data = _.cloneDeep(projects);
+    data.loaded = false;
+    const wrapper = shallow(
+      <ProjectsExistWrapper title="Topology" projects={data}>
+        {}
+      </ProjectsExistWrapper>,
+    );
+    expect(wrapper.find('LoadingBox').exists()).toBeTruthy();
+  });
+
+  it('should show empty state hint block', () => {
+    const wrapper = shallow(
+      <ProjectsExistWrapper title="Topology" projects={projects}>
+        {}
+      </ProjectsExistWrapper>,
+    );
+    const hintBlock = shallow(wrapper.props().hintBlock);
+    expect(wrapper.find('ODCEmptyState').exists()).toBeTruthy();
+    expect(hintBlock.find('h2.co-hint-block__title').contains('No projects exist')).toBeTruthy();
+    expect(
+      hintBlock
+        .find('.co-hint-block__body p')
+        .contains(
+          'Select one of the following options to create an application, component or service. As part of the creation process a project and application will be created.',
+        ),
+    ).toBeTruthy();
+  });
+
+  it('should return children when project exist', () => {
+    const data = _.cloneDeep(projects);
+    data.data = [
+      {
+        name: 'cvogt',
+        selfLink: '/apis/project.openshift.io/v1/projects/cvogt',
+        uid: '3afaa628-fde7-4afa-8800-281b7b11f4bf',
+        resourceVersion: '91841',
+        creationTimestamp: '2019-12-19T16:08:38Z',
+      },
+    ];
+    const wrapper = shallow(
+      <ProjectsExistWrapper title="Topology" projects={data}>
+        {() => {
+          return <span>Child component</span>;
+        }}
+      </ProjectsExistWrapper>,
+    );
+    expect(wrapper.contains(<span>Child component</span>)).toBeTruthy();
+  });
+});