test/vnfSearch/VnfSearchProvStatusVisualization.test.js

   1 import React from 'react';
   2 import { shallow, mount } from 'enzyme';
   3 import {Provider} from 'react-redux'
   4 import configureStore from 'redux-mock-store';
   5 import { BarChart } from 'recharts';
   6
   7 import ConnectedVnfSearchProvStatusVisualization,
   8   { VnfSearchProvStatusVisualization } from 'app/vnfSearch/VnfSearchProvStatusVisualization.jsx';
   9 import { CHART_PROV_STATUS } from 'app/vnfSearch/VnfSearchConstants.js';
  10 import Spinner from 'utils/SpinnerContainer';
  11
  12 describe('VnfSearchProvStatusVisualization - Shallow render of component', () => {
  13   let wrapper;
  14   const processedProvStatusCountChartDataProp = {
  15     values: [
  16       {x: 'col 1', y: 3},
  17       {x: 'col 2', y: 7},
  18       {x: 'col 3', y: 2}
  19     ]
  20   };
  21
  22   beforeEach( () => {
  23     wrapper = shallow(
  24       <VnfSearchProvStatusVisualization
  25         enableBusyFeedback={false}
  26         processedProvStatusCountChartData={processedProvStatusCountChartDataProp}
  27       />
  28     );
  29   })
  30
  31   it('Render basic component', () => {
  32     expect(wrapper.length).toEqual(1);
  33     expect(wrapper.hasClass('visualizations')).toEqual(true);
  34   });
  35
  36   it('Verify Spinner is present but not visible', () => {
  37     expect(wrapper.find(Spinner)).toHaveLength(1);
  38     expect(wrapper.find(Spinner).props().loading).toEqual(false);
  39   });
  40
  41   it('Verify BarChart is displayed', () => {
  42     expect(wrapper.find(BarChart)).toHaveLength(1);
  43     expect(wrapper.find(BarChart).props().data).toEqual(processedProvStatusCountChartDataProp.values);
  44   });
  45 })
  46
  47 describe('VnfSearchProvStatusVisualization - Shallow render of component with no chart data', () => {
  48   let wrapper;
  49   const processedProvStatusCountChartDataProp = {
  50     values: null
  51   };
  52
  53   beforeEach( () => {
  54     wrapper = shallow(
  55       <VnfSearchProvStatusVisualization
  56         enableBusyFeedback={false}
  57         processedProvStatusCountChartData={processedProvStatusCountChartDataProp}
  58       />
  59     );
  60   })
  61
  62   it('Visualization graph hidden', () => {
  63     expect(wrapper.length).toEqual(1);
  64     expect(['visualizations', 'hidden'].every(className => wrapper.hasClass(className))).toEqual(true);
  65   });
  66 })
  67
  68 describe('VnfSearchProvStatusVisualization - Shallow render of component with busy feedback', () => {
  69   let wrapper;
  70   const processedProvStatusCountChartDataProp = {
  71     values: [
  72       {x: 'col 1', y: 3},
  73       {x: 'col 2', y: 7},
  74       {x: 'col 3', y: 2}
  75     ]
  76   };
  77
  78   beforeEach( () => {
  79     wrapper = shallow(
  80       <VnfSearchProvStatusVisualization
  81         enableBusyFeedback={true}
  82         processedProvStatusCountChartData={processedProvStatusCountChartDataProp}
  83       />
  84     );
  85   })
  86
  87   it('Render basic component', () => {
  88     expect(wrapper.length).toEqual(1);
  89     expect(wrapper.hasClass('visualizations')).toEqual(true);
  90   });
  91
  92   it('Verify Spinner is present and visible', () => {
  93     expect(wrapper.find(Spinner)).toHaveLength(1);
  94     expect(wrapper.find(Spinner).props().loading).toEqual(true);
  95   });
  96
  97   it('Verify BarChart is displayed', () => {
  98     expect(wrapper.find(BarChart)).toHaveLength(1);
  99     expect(wrapper.find(BarChart).props().data).toEqual(processedProvStatusCountChartDataProp.values);
 100   });
 101 })
 102
 103 describe('VnfSearchProvStatusVisualization - Render React Component (wrapped in <Provider>)', () => {
 104   const initialState = {
 105     vnfSearch: {
 106       processedProvStatusCountChartData: {
 107         values: [
 108           {x: 'col 1', y: 3},
 109           {x: 'col 2', y: 7},
 110           {x: 'col 3', y: 2}
 111         ]
 112       },
 113       enableBusyFeedback: false
 114     }
 115   };
 116   const mockStore = configureStore();
 117   let store, wrapper;
 118
 119   beforeEach( () => {
 120     store = mockStore(initialState);
 121     wrapper = mount(<Provider store={store}><ConnectedVnfSearchProvStatusVisualization /></Provider>);
 122   })
 123
 124   it('Render the connected component', () => {
 125     expect(wrapper.find(ConnectedVnfSearchProvStatusVisualization).length).toEqual(1);
 126   });
 127
 128   it('Validate props from store', () => {
 129     expect(wrapper.find(VnfSearchProvStatusVisualization).props().enableBusyFeedback).toEqual(initialState.vnfSearch.enableBusyFeedback);
 130     expect(wrapper.find(VnfSearchProvStatusVisualization).props().processedProvStatusCountChartData).toEqual(initialState.vnfSearch.processedProvStatusCountChartData);
 131   });
 132 })
 133
 134 describe('VnfSearchProvStatusVisualization - Render React Component (wrapped in <Provider>) with default props', () => {
 135   const initialState = {
 136     vnfSearch: {}
 137   };
 138   const mockStore = configureStore();
 139   let store, wrapper;
 140
 141   beforeEach( () => {
 142     store = mockStore(initialState);
 143     wrapper = mount(<Provider store={store}><ConnectedVnfSearchProvStatusVisualization /></Provider>);
 144   })
 145
 146   it('Render the connected component', () => {
 147     expect(wrapper.find(ConnectedVnfSearchProvStatusVisualization).length).toEqual(1);
 148   });
 149
 150   it('Validate default props loaded', () => {
 151     expect(wrapper.find(VnfSearchProvStatusVisualization).props().enableBusyFeedback).toEqual(false);
 152     expect(wrapper.find(VnfSearchProvStatusVisualization).props().processedProvStatusCountChartData).toEqual(CHART_PROV_STATUS.emptyData);
 153   });
 154 })