UPDATED Jest Unit Tests for Monitoring Functionality

Updated Unit Tests to cover monitoring functionality

Issue-ID: POLICY-3561
Change-Id: I8434cf5d60463d60175ef6e48f0e75e8c4f656da
Signed-off-by: brunomilitzer <bruno.militzer@est.tech>

7 files changed, 358 insertions, 23 deletions

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/AccordionHeader.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/AccordionHeader.js
index 2997239..a34b5b3 100644
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/AccordionHeader.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/AccordionHeader.js
@@ -19,9 +19,9 @@
  *
  */
 
+import React from "react";
 import styled from "styled-components";
 import { Accordion, Button } from "react-bootstrap";
-import React, { useEffect, useState } from "react";
 
 const UninitialisedHeader = styled.div`
   margin: 0;
@@ -62,6 +62,12 @@ const ToggleButton = styled(Button)`
 
 const AccordionHeader = (props) => {
 
+  const index = props.index;
+
+  console.log("----------------");
+  console.log(index);
+  console.log("----------------");
+
   const toggleState = () => {
     switch (props.orderedState) {
       case 'UNINITIALISED':
@@ -70,6 +76,8 @@ const AccordionHeader = (props) => {
         return renderPassiveOrderedState();
       case 'RUNNING':
         return renderRunningOrderedState();
+      default:
+        return renderUninitialisedOrderedState();
     }
   }
 
@@ -77,7 +85,7 @@ const AccordionHeader = (props) => {
 
     return (
       <UninitialisedHeader className="panel-header">
-        <Accordion.Toggle as={ToggleButton} variant="link" eventKey={ props.index.toString() }>
+        <Accordion.Toggle as={ToggleButton} variant="link" eventKey={ index.toString() }>
           { props.title }
         </Accordion.Toggle>
       </UninitialisedHeader>
@@ -85,11 +93,9 @@ const AccordionHeader = (props) => {
   }
 
   const renderPassiveOrderedState = () => {
-    console.log("renderPassiveOrderedState called");
-
     return (
       <PassiveHeader className="panel-header">
-        <Accordion.Toggle as={ToggleButton} variant="link" eventKey={ props.index.toString() }>
+        <Accordion.Toggle as={ToggleButton} variant="link" eventKey={ index.toString() }>
           { props.title }
         </Accordion.Toggle>
       </PassiveHeader>
@@ -97,11 +103,9 @@ const AccordionHeader = (props) => {
   }
 
   const renderRunningOrderedState = () => {
-    console.log("renderRunningOrderedState called");
-
     return (
       <RunningHeader className="panel-header">
-        <Accordion.Toggle as={ToggleButton} variant="link" eventKey={ props.index.toString() }>
+        <Accordion.Toggle as={ToggleButton} variant="link" eventKey={ index.toString() }>
           { props.title }
         </Accordion.Toggle>
       </RunningHeader>
@@ -109,7 +113,7 @@ const AccordionHeader = (props) => {
   }
 
   return (
-    toggleState()
+     toggleState()
   );
 }
 
diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/AccordionHeader.test.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/AccordionHeader.test.js
index 7685340..987f1fc 100644
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/AccordionHeader.test.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/AccordionHeader.test.js
@@ -27,12 +27,24 @@ import toJson from "enzyme-to-json";
 describe('Verify AccordionHeader', () => {
 
   const index = 0;
-  const title = "PMSH Instance";
-  const orderState = "UNINITIALISED";
-  const container = shallow(<AccordionHeader title={ { title } } orderState={ { orderState } } index={ { index } } key={ { index } }/>);
 
   it("renders correctly", () => {
+    const container = shallow(<AccordionHeader index={ index }/>);
     expect(toJson(container)).toMatchSnapshot();
   });
 
+  it("renders correctly when orderState is uninitialized", () => {
+    const container = shallow(<AccordionHeader title={ "UNINITIALISED_TEST" } orderState={ "UNINITIALISED" } index={ index } key={ index }/>);
+    expect(toJson(container)).toMatchSnapshot();
+  });
+
+  it("renders correctly when orderState is passive", () => {
+    const container = shallow(<AccordionHeader title={ "PASSIVE_TEST" } orderState={ "PASSIVE" } index={ index } key={ index }/>);
+    expect(toJson(container)).toMatchSnapshot();
+  });
+
+  it("renders correctly when orderState is running", () => {
+    const container = shallow(<AccordionHeader title={ "RUNNING_TEST" } orderState={ "RUNNING" } index={ index } key={ index }/>);
+    expect(toJson(container)).toMatchSnapshot();
+  });
 });
\ No newline at end of file
diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/ChangeOrderStateModal.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/ChangeOrderStateModal.js
index d8efd3a..3486ebf 100644
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/ChangeOrderStateModal.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/ChangeOrderStateModal.js
@@ -20,7 +20,7 @@
 import styled from "styled-components";
 import Modal from "react-bootstrap/Modal";
 import Button from "react-bootstrap/Button";
-import React, { useContext, useEffect, useRef, useState } from "react";
+import React, { useEffect, useState } from "react";
 import InstantiationOrderStateChangeItem from "./InstantiationOrderStateChangeItem";
 import ControlLoopService from "../../../api/ControlLoopService";
 import { Alert, Container, Dropdown } from "react-bootstrap";
diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/MonitorInstantiation.test.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/MonitorInstantiation.test.js
index cce6225..ea98073 100644
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/MonitorInstantiation.test.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/MonitorInstantiation.test.js
@@ -17,40 +17,77 @@
  *  ============LICENSE_END=========================================================
  */
 
-import { shallow } from "enzyme";
+import React from "react";
+import { mount, shallow } from "enzyme";
 import toJson from "enzyme-to-json";
+import { act } from "react-dom/test-utils";
 import { createMemoryHistory } from "history";
-import React from "react";
 import MonitorInstantiation from "./MonitorInstantiation";
-import { act } from "react-dom/test-utils";
+import ControlLoopService from "../../../api/ControlLoopService";
+import clLoopList from "./testFiles/monitoringControlLoopList.json";
+
+const logSpy = jest.spyOn(console, 'error')
+const history = createMemoryHistory();
+
+describe('Verify MonitorInstantiation', () => {
+  const flushPromises = () => new Promise(setImmediate);
 
-describe('Verify MonitoringInstantiation', () => {
-  const container = shallow(<MonitorInstantiation />);
-  const containerWithHistory = shallow(<MonitorInstantiation history={ createMemoryHistory() }/>);
+  beforeEach(() => {
+    logSpy.mockClear();
+  });
 
   it("renders correctly", () => {
+    const container = shallow(<MonitorInstantiation />);
     expect(toJson(container)).toMatchSnapshot();
   });
 
   it('should have a Button element', () => {
+    const container = shallow(<MonitorInstantiation />);
     expect(container.find('Button').length).toEqual(1);
   });
 
   it('handleClose called when bottom button clicked', () => {
+    const container = shallow(<MonitorInstantiation history={ history } />);
     const logSpy = jest.spyOn(console, 'log');
 
     act(() => {
-      containerWithHistory.find('[variant="secondary"]').simulate('click');
+      container.find('[variant="secondary"]').simulate('click');
       expect(logSpy).toHaveBeenCalledWith('handleClose called');
     });
   });
 
   it('handleClose called when top-right button clicked', () => {
+    const container = shallow(<MonitorInstantiation history={ history } />);
     const logSpy = jest.spyOn(console, 'log');
 
     act(() => {
-      containerWithHistory.find('[size="xl"]').get(0).props.onHide();
+      container.find('[size="xl"]').get(0).props.onHide();
       expect(logSpy).toHaveBeenCalledWith('handleClose called');
     });
   });
+
+  it('Check useEffect is being called', async () => {
+    jest.resetAllMocks();
+    jest.spyOn(ControlLoopService, 'getControlLoopInstantiation')
+      .mockImplementationOnce(async () => {
+        return Promise.resolve({
+          ok: true,
+          status: 200,
+          text: () => "OK",
+          json: () => {
+            return Promise.resolve(clLoopList);
+          }
+        });
+      });
+
+    const component = mount(<MonitorInstantiation />);
+    const useEffect = jest.spyOn(React, "useEffect");
+
+    await act(async () => {
+      await flushPromises()
+      component.update();
+      await expect(useEffect).toHaveBeenCalled();
+    });
+    component.unmount();
+  });
 });
diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/__snapshots__/AccordionHeader.test.js.snap b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/__snapshots__/AccordionHeader.test.js.snap
index b4a707b..da86eb7 100644
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/__snapshots__/AccordionHeader.test.js.snap
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/__snapshots__/AccordionHeader.test.js.snap
@@ -1,3 +1,211 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Verify AccordionHeader renders correctly 1`] = `""`;
+exports[`Verify AccordionHeader renders correctly 1`] = `
+<styled.div
+  className="panel-header"
+>
+  <ForwardRef
+    as={
+      Object {
+        "$$typeof": Symbol(react.forward_ref),
+        "attrs": Array [],
+        "componentStyle": e {
+          "baseHash": -417256348,
+          "baseStyle": undefined,
+          "componentId": "sc-hKFxyN",
+          "isStatic": false,
+          "rules": Array [
+            "
+  color: #000000;
+  text-decoration: none;
+
+  :hover, :active {
+    color: #000000;
+    text-decoration: none !important;
+  }
+",
+          ],
+          "staticRulesId": "",
+        },
+        "foldedComponentIds": Array [],
+        "render": [Function],
+        "shouldForwardProp": undefined,
+        "styledComponentId": "sc-hKFxyN",
+        "target": Object {
+          "$$typeof": Symbol(react.forward_ref),
+          "defaultProps": Object {
+            "active": false,
+            "disabled": false,
+            "variant": "primary",
+          },
+          "render": [Function],
+        },
+        "toString": [Function],
+        "warnTooManyClasses": [Function],
+        "withComponent": [Function],
+      }
+    }
+    eventKey="0"
+    variant="link"
+  />
+</styled.div>
+`;
+
+exports[`Verify AccordionHeader renders correctly when orderState is passive 1`] = `
+<styled.div
+  className="panel-header"
+>
+  <ForwardRef
+    as={
+      Object {
+        "$$typeof": Symbol(react.forward_ref),
+        "attrs": Array [],
+        "componentStyle": e {
+          "baseHash": -417256348,
+          "baseStyle": undefined,
+          "componentId": "sc-hKFxyN",
+          "isStatic": false,
+          "rules": Array [
+            "
+  color: #000000;
+  text-decoration: none;
+
+  :hover, :active {
+    color: #000000;
+    text-decoration: none !important;
+  }
+",
+          ],
+          "staticRulesId": "",
+        },
+        "foldedComponentIds": Array [],
+        "render": [Function],
+        "shouldForwardProp": undefined,
+        "styledComponentId": "sc-hKFxyN",
+        "target": Object {
+          "$$typeof": Symbol(react.forward_ref),
+          "defaultProps": Object {
+            "active": false,
+            "disabled": false,
+            "variant": "primary",
+          },
+          "render": [Function],
+        },
+        "toString": [Function],
+        "warnTooManyClasses": [Function],
+        "withComponent": [Function],
+      }
+    }
+    eventKey="0"
+    variant="link"
+  >
+    PASSIVE_TEST
+  </ForwardRef>
+</styled.div>
+`;
+
+exports[`Verify AccordionHeader renders correctly when orderState is running 1`] = `
+<styled.div
+  className="panel-header"
+>
+  <ForwardRef
+    as={
+      Object {
+        "$$typeof": Symbol(react.forward_ref),
+        "attrs": Array [],
+        "componentStyle": e {
+          "baseHash": -417256348,
+          "baseStyle": undefined,
+          "componentId": "sc-hKFxyN",
+          "isStatic": false,
+          "rules": Array [
+            "
+  color: #000000;
+  text-decoration: none;
+
+  :hover, :active {
+    color: #000000;
+    text-decoration: none !important;
+  }
+",
+          ],
+          "staticRulesId": "",
+        },
+        "foldedComponentIds": Array [],
+        "render": [Function],
+        "shouldForwardProp": undefined,
+        "styledComponentId": "sc-hKFxyN",
+        "target": Object {
+          "$$typeof": Symbol(react.forward_ref),
+          "defaultProps": Object {
+            "active": false,
+            "disabled": false,
+            "variant": "primary",
+          },
+          "render": [Function],
+        },
+        "toString": [Function],
+        "warnTooManyClasses": [Function],
+        "withComponent": [Function],
+      }
+    }
+    eventKey="0"
+    variant="link"
+  >
+    RUNNING_TEST
+  </ForwardRef>
+</styled.div>
+`;
+
+exports[`Verify AccordionHeader renders correctly when orderState is uninitialized 1`] = `
+<styled.div
+  className="panel-header"
+>
+  <ForwardRef
+    as={
+      Object {
+        "$$typeof": Symbol(react.forward_ref),
+        "attrs": Array [],
+        "componentStyle": e {
+          "baseHash": -417256348,
+          "baseStyle": undefined,
+          "componentId": "sc-hKFxyN",
+          "isStatic": false,
+          "rules": Array [
+            "
+  color: #000000;
+  text-decoration: none;
+
+  :hover, :active {
+    color: #000000;
+    text-decoration: none !important;
+  }
+",
+          ],
+          "staticRulesId": "",
+        },
+        "foldedComponentIds": Array [],
+        "render": [Function],
+        "shouldForwardProp": undefined,
+        "styledComponentId": "sc-hKFxyN",
+        "target": Object {
+          "$$typeof": Symbol(react.forward_ref),
+          "defaultProps": Object {
+            "active": false,
+            "disabled": false,
+            "variant": "primary",
+          },
+          "render": [Function],
+        },
+        "toString": [Function],
+        "warnTooManyClasses": [Function],
+        "withComponent": [Function],
+      }
+    }
+    eventKey="0"
+    variant="link"
+  >
+    UNINITIALISED_TEST
+  </ForwardRef>
+</styled.div>
+`;
diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/__snapshots__/MonitorInstantiation.test.js.snap b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/__snapshots__/MonitorInstantiation.test.js.snap
index df5c243..ad1f7f1 100644
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/__snapshots__/MonitorInstantiation.test.js.snap
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/__snapshots__/MonitorInstantiation.test.js.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Verify MonitoringInstantiation renders correctly 1`] = `
+exports[`Verify MonitorInstantiation renders correctly 1`] = `
 <Styled(Modal)
   backdrop="static"
   keyboard={false}
diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/testFiles/monitoringControlLoopList.json b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/testFiles/monitoringControlLoopList.json
new file mode 100644
index 0000000..ee170f8
--- /dev/null
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/testFiles/monitoringControlLoopList.json
@@ -0,0 +1,74 @@
+{
+    "controlLoopList":[
+        {
+            "name":"PMSH_Instance1",
+            "version":"2.3.1",
+            "derivedFrom":null,
+            "metadata":null,
+            "description":"PMSH control loop _Instance1",
+            "definition":{
+                "name":"org.onap.domain.pmsh.PMSHControlLoopDefinition_Instance1",
+                "version":"1.2.3"
+            },
+            "state":"PASSIVE",
+            "orderedState":"PASSIVE",
+            "elements":{
+                "edb332de-ad83-44a7-9c86-f8158cd0de7f":{
+                    "id":"edb332de-ad83-44a7-9c86-f8158cd0de7f",
+                    "definition":{
+                        "name":"org.onap.domain.pmsh.PMSH_MonitoringPolicyControlLoopElement_Instance1",
+                        "version":"1.2.3"
+                    },
+                    "participantType":{
+                        "name":"org.onap.policy.controlloop.PolicyControlLoopParticipant",
+                        "version":"2.3.1"
+                    },
+                    "participantId":{
+                        "name":"org.onap.PM_Policy",
+                        "version":"1.0.0"
+                    },
+                    "state":"UNINITIALISED",
+                    "orderedState":"UNINITIALISED",
+                    "toscaServiceTemplateFragment":null,
+                    "description":null,
+                    "clElementStatistics":null,
+                    "propertiesMap":{
+
+                    }
+                },
+                "68e95fa7-0acf-4635-b454-47a50f299614":{
+                    "id":"68e95fa7-0acf-4635-b454-47a50f299614",
+                    "definition":{
+                        "name":"org.onap.domain.pmsh.PMSH_OperationalPolicyControlLoopElement_Instance1",
+                        "version":"1.2.3"
+                    },
+                    "participantType":{
+                        "name":"org.onap.policy.controlloop.PolicyControlLoopParticipant",
+                        "version":"2.3.1"
+                    },
+                    "participantId":{
+                        "name":"org.onap.PM_Policy",
+                        "version":"1.0.0"
+                    },
+                    "state":"UNINITIALISED",
+                    "orderedState":"UNINITIALISED",
+                    "toscaServiceTemplateFragment":null,
+                    "description":null,
+                    "clElementStatistics":null,
+                    "propertiesMap":{
+
+                    }
+                }
+            },
+            "primed":false,
+            "type":"org.onap.domain.pmsh.PMSHControlLoopDefinition_Instance1",
+            "typeVersion":"1.2.3",
+            "key":{
+                "name":"PMSH_Instance1",
+                "version":"2.3.1"
+            },
+            "definedName":"PMSH_Instance1",
+            "definedVersion":"2.3.1"
+        }
+    ]
+}
\ No newline at end of file