summaryrefslogtreecommitdiffstats
path: root/ui-react/src/components
diff options
context:
space:
mode:
authorsebdet <sebastien.determe@intl.att.com>2021-04-28 11:12:45 +0200
committerS�bastien Determe <sebastien.determe@intl.att.com>2021-05-05 13:05:48 +0000
commit44fac5a66971a6013c429537ab2b509d1a1a8a91 (patch)
treef1e24b9eeb191ad5c4e5bdcc03f46b89b85eafd5 /ui-react/src/components
parent4423d367c47d818493fbad627a43ba68f87d15f2 (diff)
Add Tests on UI
Add some test to UI and fix errors reported by JEST during Ui tests Issue-ID: POLICY-3200 Signed-off-by: sebdet <sebastien.determe@intl.att.com> Change-Id: I69e93ad1f1714fa60a0c7ea9b1f3fb691f089f8a Signed-off-by: sebdet <sebastien.determe@intl.att.com>
Diffstat (limited to 'ui-react/src/components')
-rw-r--r--ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js4
-rw-r--r--ui-react/src/components/dialogs/Loop/DeployLoopModal.js4
-rw-r--r--ui-react/src/components/dialogs/Loop/ModifyLoopModal.js7
-rw-r--r--ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap9
-rw-r--r--ui-react/src/components/dialogs/Policy/PolicyEditor.js3
-rw-r--r--ui-react/src/components/dialogs/Policy/PolicyEditor.test.js71
-rw-r--r--ui-react/src/components/dialogs/Policy/PolicyModal.js21
-rw-r--r--ui-react/src/components/dialogs/Policy/PolicyModal.test.js13
-rw-r--r--ui-react/src/components/dialogs/Policy/ToscaViewer.js16
-rw-r--r--ui-react/src/components/dialogs/Policy/ToscaViewer.test.js54
-rw-r--r--ui-react/src/components/dialogs/Policy/__snapshots__/PolicyEditor.test.js.snap788
-rw-r--r--ui-react/src/components/dialogs/Policy/__snapshots__/PolicyModal.test.js.snap159
-rw-r--r--ui-react/src/components/dialogs/Policy/__snapshots__/ToscaViewer.test.js.snap30
-rw-r--r--ui-react/src/components/dialogs/Policy/toscaData.test.json179
-rw-r--r--ui-react/src/components/dialogs/Policy/toscaData.test.yaml13
-rw-r--r--ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js4
-rw-r--r--ui-react/src/components/dialogs/UserInfoModal.js2
-rw-r--r--ui-react/src/components/dialogs/__snapshots__/UserInfoModal.test.js.snap2
-rw-r--r--ui-react/src/components/loop_viewer/logs/LoopLogs.js7
-rw-r--r--ui-react/src/components/loop_viewer/logs/__snapshots__/LoopLogs.test.js.snap1
-rw-r--r--ui-react/src/components/loop_viewer/status/LoopStatus.js7
-rw-r--r--ui-react/src/components/loop_viewer/status/__snapshots__/LoopStatus.test.js.snap2
-rw-r--r--ui-react/src/components/loop_viewer/svg/SvgGenerator.js24
23 files changed, 1356 insertions, 64 deletions
diff --git a/ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js b/ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js
index 1caa22dc7..8ef53b412 100644
--- a/ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js
+++ b/ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js
@@ -26,6 +26,10 @@ import CreateLoopModal from './CreateLoopModal';
import LoopService from '../../../api/LoopService';
import TemplateService from '../../../api/TemplateService';
+let errorMessage = '';
+window.alert = jest.fn().mockImplementation((mesg) => { errorMessage = mesg ; return });
+
+
describe('Verify CreateLoopModal', () => {
it('Test the render method', async () => {
diff --git a/ui-react/src/components/dialogs/Loop/DeployLoopModal.js b/ui-react/src/components/dialogs/Loop/DeployLoopModal.js
index 921ba1806..803cfa9cb 100644
--- a/ui-react/src/components/dialogs/Loop/DeployLoopModal.js
+++ b/ui-react/src/components/dialogs/Loop/DeployLoopModal.js
@@ -138,7 +138,7 @@ export default class DeployLoopModal extends React.Component {
const deployJsonList = this.state.temporaryPropertiesJson["dcaeDeployParameters"];
var indents = [];
Object.keys(deployJsonList).forEach(item =>
- indents.push(<Tab eventKey={item} title={item}>
+ indents.push(<Tab key={item} eventKey={item} title={item}>
{this.renderDeployParam(deployJsonList[item])}
</Tab>)
);
@@ -147,7 +147,7 @@ export default class DeployLoopModal extends React.Component {
renderDeployParam(deployJson) {
var indents = [];
Object.keys(deployJson).forEach(item =>
- indents.push(<FormStyled>
+ indents.push(<FormStyled key={item}>
<Form.Label>{item}</Form.Label>
<Form.Control type="text" name={item} onChange={this.handleChange} defaultValue={deployJson[item]}></Form.Control>
</FormStyled>));
diff --git a/ui-react/src/components/dialogs/Loop/ModifyLoopModal.js b/ui-react/src/components/dialogs/Loop/ModifyLoopModal.js
index 5154a880b..f6c0d2ede 100644
--- a/ui-react/src/components/dialogs/Loop/ModifyLoopModal.js
+++ b/ui-react/src/components/dialogs/Loop/ModifyLoopModal.js
@@ -122,13 +122,6 @@ export default class ModifyLoopModal extends React.Component {
this.initializeToscaPolicyModelsInfo();
}
- componentWillReceiveProps(newProps) {
- this.setState({
- loopCache: newProps.loopCache,
- temporaryPropertiesJson: JSON.parse(JSON.stringify(newProps.loopCache.getGlobalProperties()))
- });
- }
-
initializeToscaPolicyModelsInfo() {
var operationalPolicies = this.state.loopCache.getOperationalPolicies();
var selectedPolicyModels = [];
diff --git a/ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap b/ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap
index 4779ced0d..33f8faa77 100644
--- a/ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap
+++ b/ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap
@@ -26,9 +26,12 @@ exports[`Verify DeployLoopModal Test the render method 1`] = `
>
<Tab
eventKey="testMs"
+ key="testMs"
title="testMs"
>
- <Styled(FormGroup)>
+ <Styled(FormGroup)
+ key="location_id"
+ >
<FormLabel
column={false}
srOnly={false}
@@ -42,7 +45,9 @@ exports[`Verify DeployLoopModal Test the render method 1`] = `
type="text"
/>
</Styled(FormGroup)>
- <Styled(FormGroup)>
+ <Styled(FormGroup)
+ key="policy_id"
+ >
<FormLabel
column={false}
srOnly={false}
diff --git a/ui-react/src/components/dialogs/Policy/PolicyEditor.js b/ui-react/src/components/dialogs/Policy/PolicyEditor.js
index 8ee48535f..be77f14e9 100644
--- a/ui-react/src/components/dialogs/Policy/PolicyEditor.js
+++ b/ui-react/src/components/dialogs/Policy/PolicyEditor.js
@@ -31,7 +31,6 @@ import TextField from '@material-ui/core/TextField';
import Alert from 'react-bootstrap/Alert';
import PolicyService from '../../../api/PolicyService';
import OnapUtils from '../../../utils/OnapUtils';
-import uuid from 'react-uuid';
const DivWhiteSpaceStyled = styled.div`
white-space: pre;
@@ -61,7 +60,7 @@ export default class PolicyEditor extends React.Component {
showSuccessAlert: false,
showFailAlert: false,
jsonEditor: null,
- jsonEditorDivId: uuid(),
+ jsonEditorDivId: this.props.policyModelType + "_" + this.props.policyModelTypeVersion + "_" + this.props.policyName + "_" + this.props.policyVersion,
}
constructor(props, context) {
diff --git a/ui-react/src/components/dialogs/Policy/PolicyEditor.test.js b/ui-react/src/components/dialogs/Policy/PolicyEditor.test.js
new file mode 100644
index 000000000..0b734430a
--- /dev/null
+++ b/ui-react/src/components/dialogs/Policy/PolicyEditor.test.js
@@ -0,0 +1,71 @@
+/*-
+ * ============LICENSE_START=======================================================
+ * ONAP POLICY-CLAMP
+ * ================================================================================
+ * Copyright (C) 2021 AT&T Intellectual Property. All rights
+ * reserved.
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END============================================
+ * ===================================================================
+ *
+ */
+import React from 'react';
+import PolicyEditor from './PolicyEditor';
+import { shallow, mount } from 'enzyme';
+import PolicyToscaService from '../../../api/PolicyToscaService';
+
+describe('Verify PolicyEditor', () => {
+ const fs = require('fs');
+
+ let toscaJson = fs.readFileSync('src/components/dialogs/Policy/toscaData.test.json', {encoding:'utf8', flag:'r'})
+
+ const policyProperties = {
+ "tca.policy": {
+ "domain": "measurementsForVfScaling",
+ "metricsPerEventName": [
+ {
+ "policyScope": "DCAE",
+ "thresholds": [
+ {
+ "version": "1.0.2",
+ "severity": "MAJOR",
+ "thresholdValue": 200,
+ "closedLoopEventStatus": "ONSET",
+ "closedLoopControlName": "LOOP_test",
+ "direction": "LESS_OR_EQUAL",
+ "fieldPath": "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedTotalPacketsDelta"
+ }
+ ],
+ "eventName": "vLoadBalancer",
+ "policyVersion": "v0.0.1",
+ "controlLoopSchemaType": "VM",
+ "policyName": "DCAE.Config_tca-hi-lo"
+ }
+ ]
+ }
+ };
+
+
+ it('Test the render method',async () => {
+ PolicyToscaService.getToscaPolicyModel = jest.fn().mockImplementation(() => {
+ return Promise.resolve(toscaJson);
+ });
+
+ const component = mount(<PolicyEditor policyModelType="onap.policies.monitoring.tcagen2" policyModelTypeVersion="1.0.0"
+ policyName="org.onap.new" policyVersion="1.0.0" policyProperties={policyProperties}
+ policiesTableUpdateFunction={() => {}} />);
+ await PolicyToscaService.getToscaPolicyModel();
+ expect(component).toMatchSnapshot();
+ });
+}); \ No newline at end of file
diff --git a/ui-react/src/components/dialogs/Policy/PolicyModal.js b/ui-react/src/components/dialogs/Policy/PolicyModal.js
index 2fa0b5432..4a883fffa 100644
--- a/ui-react/src/components/dialogs/Policy/PolicyModal.js
+++ b/ui-react/src/components/dialogs/Policy/PolicyModal.js
@@ -138,21 +138,6 @@ export default class PolicyModal extends React.Component {
}
createJsonEditor(toscaModel, editorData) {
- /*JSONEditor.defaults.themes.myBootstrap4 = JSONEditor.defaults.themes.bootstrap4.extend({
- getTab: function(text,tabId) {
- var liel = document.createElement('li');
- liel.classList.add('nav-item');
- var ael = document.createElement("a");
- ael.classList.add("nav-link");
- ael.setAttribute("style",'padding:10px;max-width:160px;');
- ael.setAttribute("href", "#" + tabId);
- ael.setAttribute('data-toggle', 'tab');
- text.setAttribute("style",'word-wrap:break-word;');
- ael.appendChild(text);
- liel.appendChild(ael);
- return liel;
- }
- });*/
return new JSONEditor(document.getElementById("editor"),
{ schema: toscaModel,
startval: editorData,
@@ -312,17 +297,17 @@ export default class PolicyModal extends React.Component {
}
renderButton() {
- var allElement = [(<Button variant="secondary" onClick={this.handleClose}>
+ var allElement = [(<Button key="close" variant="secondary" onClick={this.handleClose}>
Close
</Button>)];
if(this.state.policyInstanceType !== OnapConstant.operationalPolicyType || !this.state.loopCache.isOpenLoopTemplate()) {
allElement.push((
- <Button variant="primary" disabled={this.readOnly} onClick={this.handleSave}>
+ <Button key="save" variant="primary" disabled={this.readOnly} onClick={this.handleSave}>
Save Changes
</Button>
));
allElement.push((
- <Button variant="primary" disabled={this.readOnly} onClick={this.handleRefresh}>
+ <Button key="refresh" variant="primary" disabled={this.readOnly} onClick={this.handleRefresh}>
Refresh
</Button>
));
diff --git a/ui-react/src/components/dialogs/Policy/PolicyModal.test.js b/ui-react/src/components/dialogs/Policy/PolicyModal.test.js
index cb0a32020..1e6fac0a0 100644
--- a/ui-react/src/components/dialogs/Policy/PolicyModal.test.js
+++ b/ui-react/src/components/dialogs/Policy/PolicyModal.test.js
@@ -1,8 +1,8 @@
/*-
* ============LICENSE_START=======================================================
- * ONAP CLAMP
+ * ONAP POLICY-CLAMP
* ================================================================================
- * Copyright (C) 2020 AT&T Intellectual Property. All rights
+ * Copyright (C) 2020-2021 AT&T Intellectual Property. All rights
* reserved.
* ================================================================================
* Licensed under the Apache License, Version 2.0 (the "License");
@@ -26,6 +26,7 @@ import PolicyModal from './PolicyModal';
import LoopCache from '../../../api/LoopCache';
import LoopService from '../../../api/LoopService';
import OnapConstant from '../../../utils/OnapConstants';
+import { shallow } from 'enzyme';
describe('Verify PolicyModal', () => {
beforeEach(() => {
@@ -52,11 +53,12 @@ describe('Verify PolicyModal', () => {
"jsonRepresentation" : {"schema": {}}
}]
};
+
const loopCache = new LoopCache(loopCacheStr);
const historyMock = { push: jest.fn() };
const flushPromises = () => new Promise(setImmediate);
const match = {params: {policyName:"OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca", policyInstanceType: OnapConstant.operationalPolicyType}}
-
+
it('Test handleClose', () => {
const handleClose = jest.spyOn(PolicyModal.prototype,'handleClose');
const component = mount(<PolicyModal history={historyMock} match={match} loopCache={loopCache}/>)
@@ -125,4 +127,9 @@ describe('Verify PolicyModal', () => {
instance.handlePdpSubgroupChange(event);
expect(component.state('chosenPdpSubgroup')).toEqual("option1");
});
+
+ it('Test the render method', () => {
+ const component = shallow(<PolicyModal loopCache={loopCache} match={match}/>)
+ expect(component).toMatchSnapshot();
+ });
}); \ No newline at end of file
diff --git a/ui-react/src/components/dialogs/Policy/ToscaViewer.js b/ui-react/src/components/dialogs/Policy/ToscaViewer.js
index d150e39db..fa83aa245 100644
--- a/ui-react/src/components/dialogs/Policy/ToscaViewer.js
+++ b/ui-react/src/components/dialogs/Policy/ToscaViewer.js
@@ -49,18 +49,18 @@ export default class ToscaViewer extends React.Component {
getToscaModelYamlFor(toscaData) {
PolicyToscaService.getToscaPolicyModelYaml(toscaData["policyModelType"], toscaData["version"]).then(respYamlPolicyTosca => {
this.setState({
- yamlPolicyTosca: respYamlPolicyTosca,
- })
+ yamlPolicyTosca: respYamlPolicyTosca,
+ })
});
}
render() {
return (
- <ToscaDiv>
- <pre>{this.state.yamlPolicyTosca}</pre>
- <Button variant="secondary" title="Create a new policy version from the defined parameters"
- onClick={this.handleCreateNewVersion}>Create New Version</Button>
- </ToscaDiv>
+ <ToscaDiv>
+ <pre>{this.state.yamlPolicyTosca}</pre>
+ <Button variant="secondary" title="Create a new policy version from the defined parameters"
+ onClick={this.handleCreateNewVersion}>Create New Version</Button>
+ </ToscaDiv>
);
}
-} \ No newline at end of file
+}
diff --git a/ui-react/src/components/dialogs/Policy/ToscaViewer.test.js b/ui-react/src/components/dialogs/Policy/ToscaViewer.test.js
new file mode 100644
index 000000000..cc8c59a03
--- /dev/null
+++ b/ui-react/src/components/dialogs/Policy/ToscaViewer.test.js
@@ -0,0 +1,54 @@
+/*-
+ * ============LICENSE_START=======================================================
+ * ONAP POLICY-CLAMP
+ * ================================================================================
+ * Copyright (C) 2021 AT&T Intellectual Property. All rights
+ * reserved.
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END============================================
+ * ===================================================================
+ *
+ */
+import React from 'react';
+import ToscaViewer from './ToscaViewer';
+import { shallow, mount } from 'enzyme';
+import PolicyToscaService from '../../../api/PolicyToscaService';
+
+describe('Verify ToscaViewer', () => {
+ const fs = require('fs');
+
+ let toscaYaml = fs.readFileSync('src/components/dialogs/Policy/toscaData.test.yaml', {encoding:'utf8', flag:'r'})
+
+ const toscaData = {
+ "policyModelType": "onap.policies.controlloop.Guard",
+ "version": "1.0.0",
+ "policyAcronym": "Guard",
+ "createdDate": "2021-04-09T02:29:31.407356Z",
+ "updatedDate": "2021-04-09T02:29:31.407356Z",
+ "updatedBy": "Not found",
+ "createdBy": "Not found",
+ "tableData": {
+ "id": 0
+ }
+ };
+
+ it('Test the render method',async () => {
+ PolicyToscaService.getToscaPolicyModelYaml = jest.fn().mockImplementation(() => {
+ return Promise.resolve(toscaYaml);
+ });
+ const component = shallow(<ToscaViewer toscaData={toscaData}/>);
+ await PolicyToscaService.getToscaPolicyModelYaml();
+ expect(component).toMatchSnapshot();
+ });
+});
diff --git a/ui-react/src/components/dialogs/Policy/__snapshots__/PolicyEditor.test.js.snap b/ui-react/src/components/dialogs/Policy/__snapshots__/PolicyEditor.test.js.snap
new file mode 100644
index 000000000..959b52a36
--- /dev/null
+++ b/ui-react/src/components/dialogs/Policy/__snapshots__/PolicyEditor.test.js.snap
@@ -0,0 +1,788 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Verify PolicyEditor Test the render method 1`] = `
+<PolicyEditor
+ policiesTableUpdateFunction={[Function]}
+ policyModelType="onap.policies.monitoring.tcagen2"
+ policyModelTypeVersion="1.0.0"
+ policyName="org.onap.new"
+ policyProperties={
+ Object {
+ "tca.policy": Object {
+ "domain": "measurementsForVfScaling",
+ "metricsPerEventName": Array [
+ Object {
+ "controlLoopSchemaType": "VM",
+ "eventName": "vLoadBalancer",
+ "policyName": "DCAE.Config_tca-hi-lo",
+ "policyScope": "DCAE",
+ "policyVersion": "v0.0.1",
+ "thresholds": Array [
+ Object {
+ "closedLoopControlName": "LOOP_test",
+ "closedLoopEventStatus": "ONSET",
+ "direction": "LESS_OR_EQUAL",
+ "fieldPath": "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedTotalPacketsDelta",
+ "severity": "MAJOR",
+ "thresholdValue": 200,
+ "version": "1.0.2",
+ },
+ ],
+ },
+ ],
+ },
+ }
+ }
+ policyVersion="1.0.0"
+>
+ <styled.div>
+ <div
+ className="sc-dlfnbm iSTbVM"
+ >
+ <Alert
+ closeLabel="Close alert"
+ dismissible={true}
+ onClose={[Function]}
+ show={false}
+ transition={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "defaultProps": Object {
+ "appear": false,
+ "in": false,
+ "mountOnEnter": false,
+ "timeout": 300,
+ "unmountOnExit": false,
+ },
+ "render": [Function],
+ }
+ }
+ variant="success"
+ >
+ <Fade
+ appear={false}
+ in={false}
+ mountOnEnter={false}
+ timeout={300}
+ unmountOnExit={true}
+ >
+ <Transition
+ addEndListener={[Function]}
+ appear={false}
+ enter={true}
+ exit={true}
+ in={false}
+ mountOnEnter={false}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ timeout={300}
+ unmountOnExit={true}
+ />
+ </Fade>
+ </Alert>
+ <Alert
+ closeLabel="Close alert"
+ dismissible={true}
+ onClose={[Function]}
+ show={false}
+ transition={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "defaultProps": Object {
+ "appear": false,
+ "in": false,
+ "mountOnEnter": false,
+ "timeout": 300,
+ "unmountOnExit": false,
+ },
+ "render": [Function],
+ }
+ }
+ variant="danger"
+ >
+ <Fade
+ appear={false}
+ in={false}
+ mountOnEnter={false}
+ timeout={300}
+ unmountOnExit={true}
+ >
+ <Transition
+ addEndListener={[Function]}
+ appear={false}
+ enter={true}
+ exit={true}
+ in={false}
+ mountOnEnter={false}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ timeout={300}
+ unmountOnExit={true}
+ />
+ </Fade>
+ </Alert>
+ <WithStyles(ForwardRef(TextField))
+ defaultValue="org.onap.new"
+ id="policyName"
+ label="Required"
+ onChange={[Function]}
+ required={true}
+ size="small"
+ variant="outlined"
+ >
+ <ForwardRef(TextField)
+ classes={
+ Object {
+ "root": "MuiTextField-root",
+ }
+ }
+ defaultValue="org.onap.new"
+ id="policyName"
+ label="Required"
+ onChange={[Function]}
+ required={true}
+ size="small"
+ variant="outlined"
+ >
+ <WithStyles(ForwardRef(FormControl))
+ className="MuiTextField-root"
+ color="primary"
+ disabled={false}
+ error={false}
+ fullWidth={false}
+ required={true}
+ size="small"
+ variant="outlined"
+ >
+ <ForwardRef(FormControl)
+ className="MuiTextField-root"
+ classes={
+ Object {
+ "fullWidth": "MuiFormControl-fullWidth",
+ "marginDense": "MuiFormControl-marginDense",
+ "marginNormal": "MuiFormControl-marginNormal",
+ "root": "MuiFormControl-root",
+ }
+ }
+ color="primary"
+ disabled={false}
+ error={false}
+ fullWidth={false}
+ required={true}
+ size="small"
+ variant="outlined"
+ >
+ <div
+ className="MuiFormControl-root MuiTextField-root"
+ >
+ <WithStyles(ForwardRef(InputLabel))
+ htmlFor="policyName"
+ id="policyName-label"
+ >
+ <ForwardRef(InputLabel)
+ classes={
+ Object {
+ "animated": "MuiInputLabel-animated",
+ "asterisk": "MuiInputLabel-asterisk",
+ "disabled": "Mui-disabled",
+ "error": "Mui-error",
+ "filled": "MuiInputLabel-filled",
+ "focused": "Mui-focused",
+ "formControl": "MuiInputLabel-formControl",
+ "marginDense": "MuiInputLabel-marginDense",
+ "outlined": "MuiInputLabel-outlined",
+ "required": "Mui-required",
+ "root": "MuiInputLabel-root",
+ "shrink": "MuiInputLabel-shrink",
+ }
+ }
+ htmlFor="policyName"
+ id="policyName-label"
+ >
+ <WithStyles(ForwardRef(FormLabel))
+ className="MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-marginDense MuiInputLabel-outlined"
+ classes={
+ Object {
+ "asterisk": "MuiInputLabel-asterisk",
+ "disabled": "Mui-disabled",
+ "error": "Mui-error",
+ "focused": "Mui-focused",
+ "required": "Mui-required",
+ }
+ }
+ data-shrink={true}
+ htmlFor="policyName"
+ id="policyName-label"
+ >
+ <ForwardRef(FormLabel)
+ className="MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-marginDense MuiInputLabel-outlined"
+ classes={
+ Object {
+ "asterisk": "MuiFormLabel-asterisk MuiInputLabel-asterisk",
+ "colorSecondary": "MuiFormLabel-colorSecondary",
+ "disabled": "Mui-disabled Mui-disabled",
+ "error": "Mui-error Mui-error",
+ "filled": "MuiFormLabel-filled",
+ "focused": "Mui-focused Mui-focused",
+ "required": "Mui-required Mui-required",
+ "root": "MuiFormLabel-root",
+ }
+ }
+ data-shrink={true}
+ htmlFor="policyName"
+ id="policyName-label"
+ >
+ <label
+ className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-marginDense MuiInputLabel-outlined MuiFormLabel-filled Mui-required Mui-required"
+ data-shrink={true}
+ htmlFor="policyName"
+ id="policyName-label"
+ >
+ Required
+ <span
+ aria-hidden={true}
+ className="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ </ForwardRef(FormLabel)>
+ </WithStyles(ForwardRef(FormLabel))>
+ </ForwardRef(InputLabel)>
+ </WithStyles(ForwardRef(InputLabel))>
+ <WithStyles(ForwardRef(OutlinedInput))
+ autoFocus={false}
+ defaultValue="org.onap.new"
+ fullWidth={false}
+ id="policyName"
+ label={
+ <React.Fragment>
+ Required
+  *
+ </React.Fragment>
+ }
+ multiline={false}
+ onChange={[Function]}
+ >
+ <ForwardRef(OutlinedInput)
+ autoFocus={false}
+ classes={
+ Object {
+ "adornedEnd": "MuiOutlinedInput-adornedEnd",
+ "adornedStart": "MuiOutlinedInput-adornedStart",
+ "colorSecondary": "MuiOutlinedInput-colorSecondary",
+ "disabled": "Mui-disabled",
+ "error": "Mui-error",
+ "focused": "Mui-focused",
+ "input": "MuiOutlinedInput-input",
+ "inputAdornedEnd": "MuiOutlinedInput-inputAdornedEnd",
+ "inputAdornedStart": "MuiOutlinedInput-inputAdornedStart",
+ "inputMarginDense": "MuiOutlinedInput-inputMarginDense",
+ "inputMultiline": "MuiOutlinedInput-inputMultiline",
+ "marginDense": "MuiOutlinedInput-marginDense",
+ "multiline": "MuiOutlinedInput-multiline",
+ "notchedOutline": "MuiOutlinedInput-notchedOutline",
+ "root": "MuiOutlinedInput-root",
+ }
+ }
+ defaultValue="org.onap.new"
+ fullWidth={false}
+ id="policyName"
+ label={
+ <React.Fragment>
+ Required
+  *
+ </React.Fragment>
+ }
+ multiline={false}
+ onChange={[Function]}
+ >
+ <WithStyles(ForwardRef(InputBase))
+ autoFocus={false}
+ classes={
+ Object {
+ "adornedEnd": "MuiOutlinedInput-adornedEnd",
+ "adornedStart": "MuiOutlinedInput-adornedStart",
+ "colorSecondary": "MuiOutlinedInput-colorSecondary",
+ "disabled": "Mui-disabled",
+ "error": "Mui-error",
+ "focused": "Mui-focused",
+ "input": "MuiOutlinedInput-input",
+ "inputAdornedEnd": "MuiOutlinedInput-inputAdornedEnd",
+ "inputAdornedStart": "MuiOutlinedInput-inputAdornedStart",
+ "inputMarginDense": "MuiOutlinedInput-inputMarginDense",
+ "inputMultiline": "MuiOutlinedInput-inputMultiline",
+ "marginDense": "MuiOutlinedInput-marginDense",
+ "multiline": "MuiOutlinedInput-multiline",
+ "notchedOutline": null,
+ "root": "MuiOutlinedInput-root",
+ }
+ }
+ defaultValue="org.onap.new"
+ fullWidth={false}
+ id="policyName"
+ inputComponent="input"
+ multiline={false}
+ onChange={[Function]}
+ renderSuffix={[Function]}
+ type="text"
+ >
+ <ForwardRef(InputBase)
+ autoFocus={false}
+ classes={
+ Object {
+ "adornedEnd": "MuiInputBase-adornedEnd MuiOutlinedInput-adornedEnd",
+ "adornedStart": "MuiInputBase-adornedStart MuiOutlinedInput-adornedStart",
+ "colorSecondary": "MuiInputBase-colorSecondary MuiOutlinedInput-colorSecondary",
+ "disabled": "Mui-disabled Mui-disabled",
+ "error": "Mui-error Mui-error",
+ "focused": "Mui-focused Mui-focused",
+ "formControl": "MuiInputBase-formControl",
+ "fullWidth": "MuiInputBase-fullWidth",
+ "input": "MuiInputBase-input MuiOutlinedInput-input",
+ "inputAdornedEnd": "MuiInputBase-inputAdornedEnd MuiOutlinedInput-inputAdornedEnd",
+ "inputAdornedStart": "MuiInputBase-inputAdornedStart MuiOutlinedInput-inputAdornedStart",
+ "inputHiddenLabel": "MuiInputBase-inputHiddenLabel",
+ "inputMarginDense": "MuiInputBase-inputMarginDense MuiOutlinedInput-inputMarginDense",
+ "inputMultiline": "MuiInputBase-inputMultiline MuiOutlinedInput-inputMultiline",
+ "inputTypeSearch": "MuiInputBase-inputTypeSearch",
+ "marginDense": "MuiInputBase-marginDense MuiOutlinedInput-marginDense",
+ "multiline": "MuiInputBase-multiline MuiOutlinedInput-multiline",
+ "root": "MuiInputBase-root MuiOutlinedInput-root",
+ }
+ }
+ defaultValue="org.onap.new"
+ fullWidth={false}
+ id="policyName"
+ inputComponent="input"
+ multiline={false}
+ onChange={[Function]}
+ renderSuffix={[Function]}
+ type="text"
+ >
+ <div
+ className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl MuiInputBase-marginDense MuiOutlinedInput-marginDense"
+ onClick={[Function]}
+ >
+ <input
+ aria-invalid={false}
+ autoFocus={false}
+ className="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputMarginDense MuiOutlinedInput-inputMarginDense"
+ defaultValue="org.onap.new"
+ disabled={false}
+ id="policyName"
+ onAnimationStart={[Function]}
+ onBlur={[Function]}
+ onChange={[Function]}
+ onFocus={[Function]}
+ required={true}
+ type="text"
+ />
+ <WithStyles(ForwardRef(NotchedOutline))
+ className="MuiOutlinedInput-notchedOutline"
+ label={
+ <React.Fragment>
+ Required
+  *
+ </React.Fragment>
+ }
+ labelWidth={0}
+ notched={true}
+ >
+ <ForwardRef(NotchedOutline)
+ className="MuiOutlinedInput-notchedOutline"
+ classes={
+ Object {
+ "legend": "PrivateNotchedOutline-legend-2",
+ "legendLabelled": "PrivateNotchedOutline-legendLabelled-3",
+ "legendNotched": "PrivateNotchedOutline-legendNotched-4",
+ "root": "PrivateNotchedOutline-root-1",
+ }
+ }
+ label={
+ <React.Fragment>
+ Required
+  *
+ </React.Fragment>
+ }
+ labelWidth={0}
+ notched={true}
+ >
+ <fieldset
+ aria-hidden={true}
+ className="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ className="PrivateNotchedOutline-legendLabelled-3 PrivateNotchedOutline-legendNotched-4"
+ >
+ <span>
+ Required
+  *
+ </span>
+ </legend>
+ </fieldset>
+ </ForwardRef(NotchedOutline)>
+ </WithStyles(ForwardRef(NotchedOutline))>
+ </div>
+ </ForwardRef(InputBase)>
+ </WithStyles(ForwardRef(InputBase))>
+ </ForwardRef(OutlinedInput)>
+ </WithStyles(ForwardRef(OutlinedInput))>
+ </div>
+ </ForwardRef(FormControl)>
+ </WithStyles(ForwardRef(FormControl))>
+ </ForwardRef(TextField)>
+ </WithStyles(ForwardRef(TextField))>
+ <WithStyles(ForwardRef(TextField))
+ defaultValue="1.0.0"
+ id="policyVersion"
+ label="Required"
+ onChange={[Function]}
+ required={true}
+ size="small"
+ variant="outlined"
+ >
+ <ForwardRef(TextField)
+ classes={
+ Object {
+ "root": "MuiTextField-root",
+ }
+ }
+ defaultValue="1.0.0"
+ id="policyVersion"
+ label="Required"
+ onChange={[Function]}
+ required={true}
+ size="small"
+ variant="outlined"
+ >
+ <WithStyles(ForwardRef(FormControl))
+ className="MuiTextField-root"
+ color="primary"
+ disabled={false}
+ error={false}
+ fullWidth={false}
+ required={true}
+ size="small"
+ variant="outlined"
+ >
+ <ForwardRef(FormControl)
+ className="MuiTextField-root"
+ classes={
+ Object {
+ "fullWidth": "MuiFormControl-fullWidth",
+ "marginDense": "MuiFormControl-marginDense",
+ "marginNormal": "MuiFormControl-marginNormal",
+ "root": "MuiFormControl-root",
+ }
+ }
+ color="primary"
+ disabled={false}
+ error={false}
+ fullWidth={false}
+ required={true}
+ size="small"
+ variant="outlined"
+ >
+ <div
+ className="MuiFormControl-root MuiTextField-root"
+ >
+ <WithStyles(ForwardRef(InputLabel))
+ htmlFor="policyVersion"
+ id="policyVersion-label"
+ >
+ <ForwardRef(InputLabel)
+ classes={
+ Object {
+ "animated": "MuiInputLabel-animated",
+ "asterisk": "MuiInputLabel-asterisk",
+ "disabled": "Mui-disabled",
+ "error": "Mui-error",
+ "filled": "MuiInputLabel-filled",
+ "focused": "Mui-focused",
+ "formControl": "MuiInputLabel-formControl",
+ "marginDense": "MuiInputLabel-marginDense",
+ "outlined": "MuiInputLabel-outlined",
+ "required": "Mui-required",
+ "root": "MuiInputLabel-root",
+ "shrink": "MuiInputLabel-shrink",
+ }
+ }
+ htmlFor="policyVersion"
+ id="policyVersion-label"
+ >
+ <WithStyles(ForwardRef(FormLabel))
+ className="MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-marginDense MuiInputLabel-outlined"
+ classes={
+ Object {
+ "asterisk": "MuiInputLabel-asterisk",
+ "disabled": "Mui-disabled",
+ "error": "Mui-error",
+ "focused": "Mui-focused",
+ "required": "Mui-required",
+ }
+ }
+ data-shrink={true}
+ htmlFor="policyVersion"
+ id="policyVersion-label"
+ >
+ <ForwardRef(FormLabel)
+ className="MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-marginDense MuiInputLabel-outlined"
+ classes={
+ Object {
+ "asterisk": "MuiFormLabel-asterisk MuiInputLabel-asterisk",
+ "colorSecondary": "MuiFormLabel-colorSecondary",
+ "disabled": "Mui-disabled Mui-disabled",
+ "error": "Mui-error Mui-error",
+ "filled": "MuiFormLabel-filled",
+ "focused": "Mui-focused Mui-focused",
+ "required": "Mui-required Mui-required",
+ "root": "MuiFormLabel-root",
+ }
+ }
+ data-shrink={true}
+ htmlFor="policyVersion"
+ id="policyVersion-label"
+ >
+ <label
+ className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-marginDense MuiInputLabel-outlined MuiFormLabel-filled Mui-required Mui-required"
+ data-shrink={true}
+ htmlFor="policyVersion"
+ id="policyVersion-label"
+ >
+ Required
+ <span
+ aria-hidden={true}
+ className="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ </ForwardRef(FormLabel)>
+ </WithStyles(ForwardRef(FormLabel))>
+ </ForwardRef(InputLabel)>
+ </WithStyles(ForwardRef(InputLabel))>
+ <WithStyles(ForwardRef(OutlinedInput))
+ autoFocus={false}
+ defaultValue="1.0.0"
+ fullWidth={false}
+ id="policyVersion"
+ label={
+ <React.Fragment>
+ Required
+  *
+ </React.Fragment>
+ }
+ multiline={false}
+ onChange={[Function]}
+ >
+ <ForwardRef(OutlinedInput)
+ autoFocus={false}
+ classes={
+ Object {
+ "adornedEnd": "MuiOutlinedInput-adornedEnd",
+ "adornedStart": "MuiOutlinedInput-adornedStart",
+ "colorSecondary": "MuiOutlinedInput-colorSecondary",
+ "disabled": "Mui-disabled",
+ "error": "Mui-error",
+ "focused": "Mui-focused",
+ "input": "MuiOutlinedInput-input",
+ "inputAdornedEnd": "MuiOutlinedInput-inputAdornedEnd",
+ "inputAdornedStart": "MuiOutlinedInput-inputAdornedStart",
+ "inputMarginDense": "MuiOutlinedInput-inputMarginDense",
+ "inputMultiline": "MuiOutlinedInput-inputMultiline",
+ "marginDense": "MuiOutlinedInput-marginDense",
+ "multiline": "MuiOutlinedInput-multiline",
+ "notchedOutline": "MuiOutlinedInput-notchedOutline",
+ "root": "MuiOutlinedInput-root",
+ }
+ }
+ defaultValue="1.0.0"
+ fullWidth={false}
+ id="policyVersion"
+ label={
+ <React.Fragment>
+ Required
+  *
+ </React.Fragment>
+ }
+ multiline={false}
+ onChange={[Function]}
+ >
+ <WithStyles(ForwardRef(InputBase))
+ autoFocus={false}
+ classes={
+ Object {
+ "adornedEnd": "MuiOutlinedInput-adornedEnd",
+ "adornedStart": "MuiOutlinedInput-adornedStart",
+ "colorSecondary": "MuiOutlinedInput-colorSecondary",
+ "disabled": "Mui-disabled",
+ "error": "Mui-error",
+ "focused": "Mui-focused",
+ "input": "MuiOutlinedInput-input",
+ "inputAdornedEnd": "MuiOutlinedInput-inputAdornedEnd",
+ "inputAdornedStart": "MuiOutlinedInput-inputAdornedStart",
+ "inputMarginDense": "MuiOutlinedInput-inputMarginDense",
+ "inputMultiline": "MuiOutlinedInput-inputMultiline",
+ "marginDense": "MuiOutlinedInput-marginDense",
+ "multiline": "MuiOutlinedInput-multiline",
+ "notchedOutline": null,
+ "root": "MuiOutlinedInput-root",
+ }
+ }
+ defaultValue="1.0.0"
+ fullWidth={false}
+ id="policyVersion"
+ inputComponent="input"
+ multiline={false}
+ onChange={[Function]}
+ renderSuffix={[Function]}
+ type="text"
+ >
+ <ForwardRef(InputBase)
+ autoFocus={false}
+ classes={
+ Object {
+ "adornedEnd": "MuiInputBase-adornedEnd MuiOutlinedInput-adornedEnd",
+ "adornedStart": "MuiInputBase-adornedStart MuiOutlinedInput-adornedStart",
+ "colorSecondary": "MuiInputBase-colorSecondary MuiOutlinedInput-colorSecondary",
+ "disabled": "Mui-disabled Mui-disabled",
+ "error": "Mui-error Mui-error",
+ "focused": "Mui-focused Mui-focused",
+ "formControl": "MuiInputBase-formControl",
+ "fullWidth": "MuiInputBase-fullWidth",
+ "input": "MuiInputBase-input MuiOutlinedInput-input",
+ "inputAdornedEnd": "MuiInputBase-inputAdornedEnd MuiOutlinedInput-inputAdornedEnd",
+ "inputAdornedStart": "MuiInputBase-inputAdornedStart MuiOutlinedInput-inputAdornedStart",
+ "inputHiddenLabel": "MuiInputBase-inputHiddenLabel",
+ "inputMarginDense": "MuiInputBase-inputMarginDense MuiOutlinedInput-inputMarginDense",
+ "inputMultiline": "MuiInputBase-inputMultiline MuiOutlinedInput-inputMultiline",
+ "inputTypeSearch": "MuiInputBase-inputTypeSearch",
+ "marginDense": "MuiInputBase-marginDense MuiOutlinedInput-marginDense",
+ "multiline": "MuiInputBase-multiline MuiOutlinedInput-multiline",
+ "root": "MuiInputBase-root MuiOutlinedInput-root",
+ }
+ }
+ defaultValue="1.0.0"
+ fullWidth={false}
+ id="policyVersion"
+ inputComponent="input"
+ multiline={false}
+ onChange={[Function]}
+ renderSuffix={[Function]}
+ type="text"
+ >
+ <div
+ className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl MuiInputBase-marginDense MuiOutlinedInput-marginDense"
+ onClick={[Function]}
+ >
+ <input
+ aria-invalid={false}
+ autoFocus={false}
+ className="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputMarginDense MuiOutlinedInput-inputMarginDense"
+ defaultValue="1.0.0"
+ disabled={false}
+ id="policyVersion"
+ onAnimationStart={[Function]}
+ onBlur={[Function]}
+ onChange={[Function]}
+ onFocus={[Function]}
+ required={true}
+ type="text"
+ />
+ <WithStyles(ForwardRef(NotchedOutline))
+ className="MuiOutlinedInput-notchedOutline"
+ label={
+ <React.Fragment>
+ Required
+  *
+ </React.Fragment>
+ }
+ labelWidth={0}
+ notched={true}
+ >
+ <ForwardRef(NotchedOutline)
+ className="MuiOutlinedInput-notchedOutline"
+ classes={
+ Object {
+ "legend": "PrivateNotchedOutline-legend-2",
+ "legendLabelled": "PrivateNotchedOutline-legendLabelled-3",
+ "legendNotched": "PrivateNotchedOutline-legendNotched-4",
+ "root": "PrivateNotchedOutline-root-1",
+ }
+ }
+ label={
+ <React.Fragment>
+ Required
+  *
+ </React.Fragment>
+ }
+ labelWidth={0}
+ notched={true}
+ >
+ <fieldset
+ aria-hidden={true}
+ className="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ className="PrivateNotchedOutline-legendLabelled-3 PrivateNotchedOutline-legendNotched-4"
+ >
+ <span>
+ Required
+  *
+ </span>
+ </legend>
+ </fieldset>
+ </ForwardRef(NotchedOutline)>
+ </WithStyles(ForwardRef(NotchedOutline))>
+ </div>
+ </ForwardRef(InputBase)>
+ </WithStyles(ForwardRef(InputBase))>
+ </ForwardRef(OutlinedInput)>
+ </WithStyles(ForwardRef(OutlinedInput))>
+ </div>
+ </ForwardRef(FormControl)>
+ </WithStyles(ForwardRef(FormControl))>
+ </ForwardRef(TextField)>
+ </WithStyles(ForwardRef(TextField))>
+ <Button
+ active={false}
+ disabled={false}
+ onClick={[Function]}
+ title="Create a new policy version from the defined parameters"
+ variant="secondary"
+ >
+ <button
+ className="btn btn-secondary"
+ disabled={false}
+ onClick={[Function]}
+ title="Create a new policy version from the defined parameters"
+ type="button"
+ >
+ Create New Version
+ </button>
+ </Button>
+ <styled.div
+ id="onap.policies.monitoring.tcagen2_1.0.0_org.onap.new_1.0.0"
+ title="Policy Properties"
+ >
+ <div
+ className="sc-gsTCUz dAYWPx"
+ id="onap.policies.monitoring.tcagen2_1.0.0_org.onap.new_1.0.0"
+ title="Policy Properties"
+ />
+ </styled.div>
+ </div>
+ </styled.div>
+</PolicyEditor>
+`;
diff --git a/ui-react/src/components/dialogs/Policy/__snapshots__/PolicyModal.test.js.snap b/ui-react/src/components/dialogs/Policy/__snapshots__/PolicyModal.test.js.snap
new file mode 100644
index 000000000..8b1261b1c
--- /dev/null
+++ b/ui-react/src/components/dialogs/Policy/__snapshots__/PolicyModal.test.js.snap
@@ -0,0 +1,159 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Verify PolicyModal Test the render method 1`] = `
+<Styled(Modal)
+ backdrop="static"
+ keyboard={false}
+ onHide={[Function]}
+ show={true}
+ size="xl"
+>
+ <ModalHeader
+ closeButton={true}
+ closeLabel="Close"
+ >
+ <ModalTitle>
+ Edit the policy
+ </ModalTitle>
+ </ModalHeader>
+ <Alert
+ closeLabel="Close alert"
+ dismissible={true}
+ onClose={[Function]}
+ show={false}
+ transition={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "defaultProps": Object {
+ "appear": false,
+ "in": false,
+ "mountOnEnter": false,
+ "timeout": 300,
+ "unmountOnExit": false,
+ },
+ "render": [Function],
+ }
+ }
+ variant="success"
+ >
+ <styled.div />
+ </Alert>
+ <Alert
+ closeLabel="Close alert"
+ dismissible={true}
+ onClose={[Function]}
+ show={false}
+ transition={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "defaultProps": Object {
+ "appear": false,
+ "in": false,
+ "mountOnEnter": false,
+ "timeout": 300,
+ "unmountOnExit": false,
+ },
+ "render": [Function],
+ }
+ }
+ variant="danger"
+ >
+ <styled.div />
+ </Alert>
+ <ModalBody>
+ <div
+ id="editor"
+ />
+ <FormGroup
+ as={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "defaultProps": Object {
+ "noGutters": false,
+ },
+ "render": [Function],
+ }
+ }
+ controlId="formPlaintextEmail"
+ >
+ <FormLabel
+ column={true}
+ sm="2"
+ srOnly={false}
+ >
+ Pdp Group Info
+ </FormLabel>
+ <Col
+ sm="3"
+ >
+ <StateManager
+ defaultInputValue=""
+ defaultMenuIsOpen={false}
+ defaultValue={null}
+ onChange={[Function]}
+ options={
+ Array [
+ Object {
+ "label": "monitoring",
+ "value": "monitoring",
+ },
+ ]
+ }
+ value={
+ Object {
+ "label": undefined,
+ "value": undefined,
+ }
+ }
+ />
+ </Col>
+ <Col
+ sm="3"
+ >
+ <StateManager
+ defaultInputValue=""
+ defaultMenuIsOpen={false}
+ defaultValue={null}
+ onChange={[Function]}
+ options={Array []}
+ value={
+ Object {
+ "label": undefined,
+ "value": undefined,
+ }
+ }
+ />
+ </Col>
+ </FormGroup>
+ </ModalBody>
+ <ModalFooter>
+ <Button
+ active={false}
+ disabled={false}
+ key="close"
+ onClick={[Function]}
+ variant="secondary"
+ >
+ Close
+ </Button>
+ <Button
+ active={false}
+ disabled={false}
+ key="save"
+ onClick={[Function]}
+ variant="primary"
+ >
+ Save Changes
+ </Button>
+ <Button
+ active={false}
+ disabled={false}
+ key="refresh"
+ onClick={[Function]}
+ variant="primary"
+ >
+ Refresh
+ </Button>
+ </ModalFooter>
+</Styled(Modal)>
+`;
diff --git a/ui-react/src/components/dialogs/Policy/__snapshots__/ToscaViewer.test.js.snap b/ui-react/src/components/dialogs/Policy/__snapshots__/ToscaViewer.test.js.snap
new file mode 100644
index 000000000..61fb4850d
--- /dev/null
+++ b/ui-react/src/components/dialogs/Policy/__snapshots__/ToscaViewer.test.js.snap
@@ -0,0 +1,30 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Verify ToscaViewer Test the render method 1`] = `
+<styled.div>
+ <pre>
+ tosca_definitions_version: tosca_simple_yaml_1_1_0
+policy_types:
+ onap.policies.controlloop.Guard:
+ properties: {
+ }
+ name: onap.policies.controlloop.Guard
+ version: 1.0.0
+ derived_from: tosca.policies.Root
+ metadata: {
+ }
+ description: Guard Policies for Control Loop Operational Policies
+name: ToscaServiceTemplateSimple
+version: 1.0.0
+
+ </pre>
+ <Button
+ active={false}
+ disabled={false}
+ title="Create a new policy version from the defined parameters"
+ variant="secondary"
+ >
+ Create New Version
+ </Button>
+</styled.div>
+`;
diff --git a/ui-react/src/components/dialogs/Policy/toscaData.test.json b/ui-react/src/components/dialogs/Policy/toscaData.test.json
new file mode 100644
index 000000000..3b001b384
--- /dev/null
+++ b/ui-react/src/components/dialogs/Policy/toscaData.test.json
@@ -0,0 +1,179 @@
+{
+ "title": "onap.policies.monitoring.tcagen2",
+ "type": "object",
+ "required": [
+ "tca.policy"
+ ],
+ "properties": {
+ "tca.policy": {
+ "title": "onap.datatypes.monitoring.tca_policy",
+ "type": "object",
+ "required": [
+ "domain",
+ "metricsPerEventName"
+ ],
+ "properties": {
+ "domain": {
+ "type": "string",
+ "description": "Domain name to which TCA needs to be applied",
+ "default": "measurementsForVfScaling",
+ "const": "measurementsForVfScaling"
+ },
+ "metricsPerEventName": {
+ "type": "array",
+ "description": "Contains eventName and threshold details that need to be applied to given eventName",
+ "items": {
+ "title": "onap.datatypes.monitoring.metricsPerEventName",
+ "type": "object",
+ "required": [
+ "controlLoopSchemaType",
+ "eventName",
+ "policyName",
+ "policyScope",
+ "policyVersion",
+ "thresholds"
+ ],
+ "properties": {
+ "controlLoopSchemaType": {
+ "type": "string",
+ "description": "Specifies Control Loop Schema Type for the event Name e.g. VNF, VM",
+ "enum": [
+ "VM",
+ "VNF"
+ ]
+ },
+ "eventName": {
+ "type": "string",
+ "description": "Event name to which thresholds need to be applied"
+ },
+ "policyName": {
+ "type": "string",
+ "description": "TCA Policy Scope Name"
+ },
+ "policyScope": {
+ "type": "string",
+ "description": "TCA Policy Scope"
+ },
+ "policyVersion": {
+ "type": "string",
+ "description": "TCA Policy Scope Version"
+ },
+ "thresholds": {
+ "type": "array",
+ "description": "Thresholds associated with eventName",
+ "items": {
+ "title": "onap.datatypes.monitoring.thresholds",
+ "type": "object",
+ "required": [
+ "closedLoopControlName",
+ "closedLoopEventStatus",
+ "direction",
+ "fieldPath",
+ "severity",
+ "thresholdValue",
+ "version"
+ ],
+ "properties": {
+ "closedLoopControlName": {
+ "type": "string",
+ "description": "Closed Loop Control Name associated with the threshold"
+ },
+ "closedLoopEventStatus": {
+ "type": "string",
+ "description": "Closed Loop Event Status of the threshold",
+ "enum": [
+ "ONSET",
+ "ABATED"
+ ]
+ },
+ "direction": {
+ "type": "string",
+ "description": "Direction of the threshold",
+ "enum": [
+ "LESS",
+ "LESS_OR_EQUAL",
+ "GREATER",
+ "GREATER_OR_EQUAL",
+ "EQUAL"
+ ]
+ },
+ "fieldPath": {
+ "type": "string",
+ "description": "Json field Path as per CEF message which needs to be analyzed for TCA",
+ "enum": [
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedTotalPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedOctetsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedUnicastPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedMulticastPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedBroadcastPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedDiscardedPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedErrorPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedTotalPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedOctetsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedUnicastPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedMulticastPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedBroadcastPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedDiscardedPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedErrorPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedTotalPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedOctetsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedUnicastPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedMulticastPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedBroadcastPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedDiscardedPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedErrorPacketsDelta",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedTotalPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedOctetsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedUnicastPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedMulticastPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedBroadcastPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedDiscardedPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].transmittedErrorPacketsAccumulated",
+ "$.event.measurementsForVfScalingFields.cpuUsageArray[*].cpuIdle",
+ "$.event.measurementsForVfScalingFields.cpuUsageArray[*].cpuUsageInterrupt",
+ "$.event.measurementsForVfScalingFields.cpuUsageArray[*].cpuUsageNice",
+ "$.event.measurementsForVfScalingFields.cpuUsageArray[*].cpuUsageSoftIrq",
+ "$.event.measurementsForVfScalingFields.cpuUsageArray[*].cpuUsageSteal",
+ "$.event.measurementsForVfScalingFields.cpuUsageArray[*].cpuUsageSystem",
+ "$.event.measurementsForVfScalingFields.cpuUsageArray[*].cpuWait",
+ "$.event.measurementsForVfScalingFields.cpuUsageArray[*].percentUsage",
+ "$.event.measurementsForVfScalingFields.meanRequestLatency",
+ "$.event.measurementsForVfScalingFields.memoryUsageArray[*].memoryBuffered",
+ "$.event.measurementsForVfScalingFields.memoryUsageArray[*].memoryCached",
+ "$.event.measurementsForVfScalingFields.memoryUsageArray[*].memoryConfigured",
+ "$.event.measurementsForVfScalingFields.memoryUsageArray[*].memoryFree",
+ "$.event.measurementsForVfScalingFields.memoryUsageArray[*].memoryUsed",
+ "$.event.measurementsForVfScalingFields.additionalMeasurements[*].arrayOfFields[0].value"
+ ]
+ },
+ "severity": {
+ "type": "string",
+ "description": "Threshold Event Severity",
+ "enum": [
+ "CRITICAL",
+ "MAJOR",
+ "MINOR",
+ "WARNING",
+ "NORMAL"
+ ]
+ },
+ "thresholdValue": {
+ "type": "integer",
+ "description": "Threshold value for the field Path inside CEF message"
+ },
+ "version": {
+ "type": "string",
+ "description": "Version number associated with the threshold"
+ }
+ }
+ },
+ "format": "tabs-top"
+ }
+ }
+ },
+ "format": "tabs-top"
+ }
+ }
+ }
+ }
+}
diff --git a/ui-react/src/components/dialogs/Policy/toscaData.test.yaml b/ui-react/src/components/dialogs/Policy/toscaData.test.yaml
new file mode 100644
index 000000000..15a3cec35
--- /dev/null
+++ b/ui-react/src/components/dialogs/Policy/toscaData.test.yaml
@@ -0,0 +1,13 @@
+tosca_definitions_version: tosca_simple_yaml_1_1_0
+policy_types:
+ onap.policies.controlloop.Guard:
+ properties: {
+ }
+ name: onap.policies.controlloop.Guard
+ version: 1.0.0
+ derived_from: tosca.policies.Root
+ metadata: {
+ }
+ description: Guard Policies for Control Loop Operational Policies
+name: ToscaServiceTemplateSimple
+version: 1.0.0
diff --git a/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js b/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js
index eb6e70f3d..4796b8d73 100644
--- a/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js
+++ b/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js
@@ -1,8 +1,8 @@
/*-
* ============LICENSE_START=======================================================
- * ONAP CLAMP
+ * ONAP POLICY-CLAMP
* ================================================================================
- * Copyright (C) 2019 AT&T Intellectual Property. All rights
+ * Copyright (C) 2019, 2021 AT&T Intellectual Property. All rights
* reserved.
* ================================================================================
* Licensed under the Apache License, Version 2.0 (the "License");
diff --git a/ui-react/src/components/dialogs/UserInfoModal.js b/ui-react/src/components/dialogs/UserInfoModal.js
index 4b779dece..96eabb4c2 100644
--- a/ui-react/src/components/dialogs/UserInfoModal.js
+++ b/ui-react/src/components/dialogs/UserInfoModal.js
@@ -58,7 +58,7 @@ export default class UserInfoModal extends React.Component {
renderPermissions() {
if (this.state.userInfo["allPermissions"]) {
var listOfPermissions = this.state.userInfo["allPermissions"].map(function(perm) {
- return <Form.Control plaintext readOnly defaultValue={perm} />;
+ return <Form.Control key={perm} plaintext readOnly defaultValue={perm} />;
})
return listOfPermissions;
} else {
diff --git a/ui-react/src/components/dialogs/__snapshots__/UserInfoModal.test.js.snap b/ui-react/src/components/dialogs/__snapshots__/UserInfoModal.test.js.snap
index 7c725bc42..548a2d938 100644
--- a/ui-react/src/components/dialogs/__snapshots__/UserInfoModal.test.js.snap
+++ b/ui-react/src/components/dialogs/__snapshots__/UserInfoModal.test.js.snap
@@ -91,11 +91,13 @@ exports[`Verify UserInfoModal Test the render method full permission 1`] = `
<Col>
<FormControl
defaultValue="permission1"
+ key="permission1"
plaintext={true}
readOnly={true}
/>
<FormControl
defaultValue="permission2"
+ key="permission2"
plaintext={true}
readOnly={true}
/>
diff --git a/ui-react/src/components/loop_viewer/logs/LoopLogs.js b/ui-react/src/components/loop_viewer/logs/LoopLogs.js
index b3f052626..e3d9f601f 100644
--- a/ui-react/src/components/loop_viewer/logs/LoopLogs.js
+++ b/ui-react/src/components/loop_viewer/logs/LoopLogs.js
@@ -66,10 +66,9 @@ export default class LoopLogs extends React.Component {
}
renderLogs() {
- if (this.state.loopCache.getLoopLogsArray() != null) {
- return (
- this.state.loopCache.getLoopLogsArray().map(row => <TableRow logRow={row} />)
- )
+ let logsArray = this.state.loopCache.getLoopLogsArray();
+ if (logsArray != null) {
+ return (logsArray.map(row => <TableRow key={row.id} logRow={row} />));
}
}
diff --git a/ui-react/src/components/loop_viewer/logs/__snapshots__/LoopLogs.test.js.snap b/ui-react/src/components/loop_viewer/logs/__snapshots__/LoopLogs.test.js.snap
index 75b817bab..996c67457 100644
--- a/ui-react/src/components/loop_viewer/logs/__snapshots__/LoopLogs.test.js.snap
+++ b/ui-react/src/components/loop_viewer/logs/__snapshots__/LoopLogs.test.js.snap
@@ -45,6 +45,7 @@ exports[`Verify LoopLogs Test the render method 1`] = `
</thead>
<tbody>
<TableRow
+ key="1"
logRow={
Object {
"id": 1,
diff --git a/ui-react/src/components/loop_viewer/status/LoopStatus.js b/ui-react/src/components/loop_viewer/status/LoopStatus.js
index d960c31e6..4b35b48e1 100644
--- a/ui-react/src/components/loop_viewer/status/LoopStatus.js
+++ b/ui-react/src/components/loop_viewer/status/LoopStatus.js
@@ -57,12 +57,13 @@ export default class LoopStatus extends React.Component {
renderStatus() {
- if (this.state.loopCache.getComponentStates() != null) {
- return Object.keys(this.state.loopCache.getComponentStates()).map((key) => {
+ let componentStates = this.state.loopCache.getComponentStates();
+ if (componentStates != null) {
+ return Object.keys(componentStates).map((key) => {
console.debug("Adding status for: ",key);
var res={}
res[key]=this.state.loopCache.getComponentStates()[key];
- return (<TableRow statusRow={{'componentName':key,'stateName':this.state.loopCache.getComponentStates()[key].componentState.stateName,'description':this.state.loopCache.getComponentStates()[key].componentState.description}} />)
+ return (<TableRow key={key} statusRow={{'componentName':key,'stateName':this.state.loopCache.getComponentStates()[key].componentState.stateName,'description':this.state.loopCache.getComponentStates()[key].componentState.description}} />)
})
}
diff --git a/ui-react/src/components/loop_viewer/status/__snapshots__/LoopStatus.test.js.snap b/ui-react/src/components/loop_viewer/status/__snapshots__/LoopStatus.test.js.snap
index 73da5fff1..24d879de9 100644
--- a/ui-react/src/components/loop_viewer/status/__snapshots__/LoopStatus.test.js.snap
+++ b/ui-react/src/components/loop_viewer/status/__snapshots__/LoopStatus.test.js.snap
@@ -40,6 +40,7 @@ exports[`Verify LoopStatus Test the render method 1`] = `
</thead>
<tbody>
<TableRow
+ key="POLICY"
statusRow={
Object {
"componentName": "POLICY",
@@ -49,6 +50,7 @@ exports[`Verify LoopStatus Test the render method 1`] = `
}
/>
<TableRow
+ key="DCAE"
statusRow={
Object {
"componentName": "DCAE",
diff --git a/ui-react/src/components/loop_viewer/svg/SvgGenerator.js b/ui-react/src/components/loop_viewer/svg/SvgGenerator.js
index f5f5047ba..6d3cd7a21 100644
--- a/ui-react/src/components/loop_viewer/svg/SvgGenerator.js
+++ b/ui-react/src/components/loop_viewer/svg/SvgGenerator.js
@@ -59,16 +59,16 @@ class SvgGenerator extends React.Component {
}
shouldComponentUpdate(nextProps, nextState) {
- return this.state.loopCache !== nextState.loopCache;
+ return this.state.loopCache !== nextProps.loopCache;
}
- componentWillReceiveProps(newProps) {
- if (this.state.loopCache !== newProps.loopCache) {
- this.setState({
- loopCache: newProps.loopCache,
- });
- }
- }
+ componentDidUpdate(prevProps) {
+ if (prevProps.loopCache !== this.props.loopCache) {
+ this.setState({
+ loopCache: this.props.loopCache,
+ });
+ }
+ }
handleSvgClick(event) {
console.debug("svg click event received");
@@ -233,10 +233,10 @@ class SvgGenerator extends React.Component {
return (
<DivStyled onClick={this.handleSvgClick} >
- <svg height={svgHeight} width={svgWidth} viewBox="0,0,{svgWidth},{svgHeight}" preserveAspectRatio="none">
- <svg x="-50" y="25">
- {allTheElements}
- </svg>
+ <svg key="main" height={svgHeight} width={svgWidth} viewBox="0,0,{svgWidth},{svgHeight}" preserveAspectRatio="none">
+ <svg key="content" x="-50" y="25">
+ {allTheElements}
+ </svg>
</svg>
</DivStyled>
);