summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2
diff options
context:
space:
mode:
authorandre.schmid <andre.schmid@est.tech>2021-03-09 18:29:48 +0000
committerChristophe Closset <christophe.closset@intl.att.com>2021-03-22 16:37:22 +0000
commit1ccd74fb7723bc41424ca93902d68d351ce55462 (patch)
tree3b7ba6539b51e814e605f87b5f76c757f69086dd /catalog-ui/src/app/ng2
parent00acf3d39898cc712e8f3fd2afb69f26bc922f61 (diff)
Add Composition Page and create resource page/flow
Add UI Tests Composition Page, and create resource page and flow Change-Id: I004a2e8123df669e7318eca7feb58f8b1210dd65 Issue-ID: SDC-3523, SDC-3524 Signed-off-by: andre.schmid <andre.schmid@est.tech>
Diffstat (limited to 'catalog-ui/src/app/ng2')
-rw-r--r--catalog-ui/src/app/ng2/components/logic/substitution-filter/substitution-filter.component.html2
-rw-r--r--catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html3
-rw-r--r--catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.spec.ts151
-rw-r--r--catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts144
4 files changed, 238 insertions, 62 deletions
diff --git a/catalog-ui/src/app/ng2/components/logic/substitution-filter/substitution-filter.component.html b/catalog-ui/src/app/ng2/components/logic/substitution-filter/substitution-filter.component.html
index 01329b70d1..81fc5b48ee 100644
--- a/catalog-ui/src/app/ng2/components/logic/substitution-filter/substitution-filter.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/substitution-filter/substitution-filter.component.html
@@ -45,7 +45,7 @@
<div class="w-sdc-designer-sidebar-section-substitution-filter-footer">
<button
class="w-sdc-designer-sidebar-section-substitution-filter-footer-action add-rule-btn tlv-btn blue"
- data-tests-id="add-rule-button"
+ data-tests-id="add-substitution-filter-button"
(click)="onAddSubstitutionFilter(PROPERTIES)"
[disabled]="readonly">
{{'ADD_SUBSTITUTION_FILTER' | translate}}
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html
index 5511dc0ea8..61e2f5e744 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html
@@ -12,7 +12,8 @@
<sdc-tab *ngFor="let tab of tabs"
[titleIcon]="tab.titleIcon"
[active]="tab.isActive"
- [tooltipText]="tab.tooltipText">
+ [tooltipText]="tab.tooltipText"
+ [testId]="tab.testId">
<panel-tab [isActive]="tab.isActive"
[component]="selectedComponent"
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.spec.ts b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.spec.ts
index 6d96764b1c..d5c0b6093b 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.spec.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.spec.ts
@@ -27,49 +27,113 @@ describe('composition-panel component', () => {
let store: Store;
const tabs = {
- infoTab : {titleIcon: 'info-circle', component: InfoTabComponent, input: {}, isActive: true, tooltipText: 'Information'},
- policyProperties: {
- titleIcon: 'settings-o', component: GroupOrPolicyPropertiesTab, input: {type: 'policy'}, isActive: false, tooltipText: 'Properties'
- },
- policyTargets: {titleIcon: 'inputs-o', component: PolicyTargetsTabComponent, input: {}, isActive: false, tooltipText: 'Targets'},
- groupMembers: {titleIcon: 'inputs-o', component: GroupMembersTabComponent, input: {}, isActive: false, tooltipText: 'Members'},
- groupProperties: {
- titleIcon: 'settings-o', component: GroupOrPolicyPropertiesTab, input: {type: 'group'}, isActive: false, tooltipText: 'Properties'
- },
- deploymentArtifacts: {
- titleIcon: 'deployment-artifacts-o', component: ArtifactsTabComponent,
- input: { type: ArtifactGroupType.DEPLOYMENT}, isActive: false, tooltipText: 'Deployment Artifacts'
- },
- apiArtifacts: {
- titleIcon: 'api-o', component: ArtifactsTabComponent,
- input: { type: ArtifactGroupType.SERVICE_API}, isActive: false, tooltipText: 'API Artifacts'
- },
- infoArtifacts: {
- titleIcon: 'info-square-o', component: ArtifactsTabComponent,
- input: { type: ArtifactGroupType.INFORMATION}, isActive: false, tooltipText: 'Information Artifacts'
- },
- properties: {
- titleIcon: 'settings-o', component: PropertiesTabComponent,
- input: {title: 'Properties and Attributes'}, isActive: false, tooltipText: 'Properties'
- },
- reqAndCapabilities : {
- titleIcon: 'req-capabilities-o', component: ReqAndCapabilitiesTabComponent, input: {},
- isActive: false, tooltipText: 'Requirements and Capabilities'
- },
- substitutionFilter: {
- titleIcon: 'composition-o', component: SubstitutionFilterTabComponent, input: {title: 'SUBSTITUTION FILTER'},
- isActive: false, tooltipText: 'Substitution Filter'
- },
- inputs: {titleIcon: 'inputs-o', component: PropertiesTabComponent, input: {title: 'Inputs'}, isActive: false, tooltipText: 'Inputs'},
- settings: {titleIcon: 'settings-o', component: PropertiesTabComponent, input: {}, isActive: false, tooltipText: 'Settings'},
- interfaceOperations: {
- titleIcon: 'composition-o',
- component: InterfaceOperationsComponent,
- input: {title: 'Interface Operations'},
- isActive: false,
- tooltipText: 'Interface Operations'
- }
- };
+ infoTab: {
+ titleIcon: 'info-circle',
+ component: InfoTabComponent,
+ input: {},
+ isActive: true,
+ tooltipText: 'Information',
+ testId: 'detail-tab-information'
+ },
+ policyProperties: {
+ titleIcon: 'settings-o',
+ component: GroupOrPolicyPropertiesTab,
+ input: {type: 'policy'},
+ isActive: false,
+ tooltipText: 'Properties',
+ testId: 'detail-tab-policy-properties'
+ },
+ policyTargets: {
+ titleIcon: 'inputs-o',
+ component: PolicyTargetsTabComponent,
+ input: {},
+ isActive: false,
+ tooltipText: 'Targets',
+ testId: 'detail-tab-policy-targets'
+ },
+ groupMembers: {
+ titleIcon: 'inputs-o',
+ component: GroupMembersTabComponent,
+ input: {},
+ isActive: false,
+ tooltipText: 'Members',
+ testId: 'detail-tab-group-members'
+ },
+ groupProperties: {
+ titleIcon: 'settings-o',
+ component: GroupOrPolicyPropertiesTab,
+ input: {type: 'group'},
+ isActive: false,
+ tooltipText: 'Properties',
+ testId: 'detail-tab-group-properties'
+ },
+ deploymentArtifacts: {
+ titleIcon: 'deployment-artifacts-o',
+ component: ArtifactsTabComponent,
+ input: {type: ArtifactGroupType.DEPLOYMENT},
+ isActive: false,
+ tooltipText: 'Deployment Artifacts',
+ testId: 'detail-tab-deployment-artifacts'
+ },
+ apiArtifacts: {
+ titleIcon: 'api-o',
+ component: ArtifactsTabComponent,
+ input: {type: ArtifactGroupType.SERVICE_API},
+ isActive: false,
+ tooltipText: 'API Artifacts',
+ testId: 'detail-tab-api-artifacts'
+ },
+ infoArtifacts: {
+ titleIcon: 'info-square-o',
+ component: ArtifactsTabComponent,
+ input: {type: ArtifactGroupType.INFORMATION},
+ isActive: false,
+ tooltipText: 'Information Artifacts',
+ testId: 'detail-tab-information-artifacts'
+ },
+ properties: {
+ titleIcon: 'settings-o', component: PropertiesTabComponent,
+ input: {title: 'Properties and Attributes'}, isActive: false, tooltipText: 'Properties',
+ testId: 'detail-tab-properties-attributes'
+ },
+ reqAndCapabilities: {
+ titleIcon: 'req-capabilities-o', component: ReqAndCapabilitiesTabComponent, input: {},
+ isActive: false, tooltipText: 'Requirements and Capabilities',
+ testId: 'detail-tab-requirements-capabilities'
+ },
+ substitutionFilter: {
+ titleIcon: 'composition-o',
+ component: SubstitutionFilterTabComponent,
+ input: {title: 'SUBSTITUTION FILTER'},
+ isActive: false,
+ tooltipText: 'Substitution Filter',
+ testId: 'detail-tab-substitution-filter'
+ },
+ inputs: {
+ titleIcon: 'inputs-o',
+ component: PropertiesTabComponent,
+ input: {title: 'Inputs'},
+ isActive: false,
+ tooltipText: 'Inputs',
+ testId: 'detail-tab-inputs'
+ },
+ settings: {
+ titleIcon: 'settings-o',
+ component: PropertiesTabComponent,
+ input: {},
+ isActive: false,
+ tooltipText: 'Settings',
+ testId: 'detail-tab-settings'
+ },
+ interfaceOperations: {
+ titleIcon: 'composition-o',
+ component: InterfaceOperationsComponent,
+ input: {title: 'Interface Operations'},
+ isActive: false,
+ tooltipText: 'Interface Operations',
+ testId: 'detail-tab-interface-operations'
+ }
+ };
beforeEach(
async(() => {
@@ -95,7 +159,6 @@ describe('composition-panel component', () => {
const testInstance = new PolicyInstance();
fixture.componentInstance.initTabs(testInstance);
-
expect (fixture.componentInstance.tabs.length).toBe(3);
expect (fixture.componentInstance.tabs[0]).toEqual(tabs.infoTab);
expect (fixture.componentInstance.tabs[1]).toEqual(tabs.policyTargets);
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts
index 2ef4e7c9a9..6ed73b3384 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts
@@ -42,22 +42,134 @@ import {SubstitutionFilterTabComponent} from "./panel-tabs/substitution-filter-t
import {InterfaceOperationsComponent} from "../interface-operatons/interface-operations.component";
const tabs = {
- infoTab : {titleIcon: 'info-circle', component: InfoTabComponent, input: {}, isActive: true, tooltipText: 'Information'},
- policyProperties: {titleIcon: 'settings-o', component: GroupOrPolicyPropertiesTab, input: {type: 'policy'}, isActive: false, tooltipText: 'Properties'},
- policyTargets: {titleIcon: 'inputs-o', component: PolicyTargetsTabComponent, input: {}, isActive: false, tooltipText: 'Targets'},
- groupMembers: {titleIcon: 'inputs-o', component: GroupMembersTabComponent, input: {}, isActive: false, tooltipText: 'Members'},
- groupProperties: {titleIcon: 'settings-o', component: GroupOrPolicyPropertiesTab, input: {type: 'group'}, isActive: false, tooltipText: 'Properties'},
- deploymentArtifacts: {titleIcon: 'deployment-artifacts-o', component: ArtifactsTabComponent, input: { type: ArtifactGroupType.DEPLOYMENT}, isActive: false, tooltipText: 'Deployment Artifacts'},
- apiArtifacts: {titleIcon: 'api-o', component: ArtifactsTabComponent, input: { type: ArtifactGroupType.SERVICE_API}, isActive: false, tooltipText: 'API Artifacts'},
- infoArtifacts: {titleIcon: 'info-square-o', component: ArtifactsTabComponent, input: { type: ArtifactGroupType.INFORMATION}, isActive: false, tooltipText: 'Information Artifacts'},
- properties: {titleIcon: 'settings-o', component: PropertiesTabComponent, input: {title: 'Properties and Attributes'}, isActive: false, tooltipText: 'Properties'},
- reqAndCapabilities : { titleIcon: 'req-capabilities-o', component: ReqAndCapabilitiesTabComponent, input: {}, isActive: false, tooltipText: 'Requirements and Capabilities'},
- inputs: {titleIcon: 'inputs-o', component: PropertiesTabComponent, input: {title: 'Inputs'}, isActive: false, tooltipText: 'Inputs'},
- settings: {titleIcon: 'settings-o', component: PropertiesTabComponent, input: {}, isActive: false, tooltipText: 'Settings'},
- consumption: {titleIcon: 'api-o', component: ServiceConsumptionTabComponent, input: {title: 'OPERATION CONSUMPTION'}, isActive: false, tooltipText: 'Service Consumption'},
- dependencies: {titleIcon: 'archive', component: ServiceDependenciesTabComponent, input: {title: 'DIRECTIVES AND NODE FILTER'}, isActive: false, tooltipText: 'Service Dependencies'},
- substitutionFilter: {titleIcon: 'composition-o', component: SubstitutionFilterTabComponent, input: {title: 'SUBSTITUTION FILTER'}, isActive: false, tooltipText: 'Substitution Filter'},
- interfaceOperations: {titleIcon: 'composition-o', component: InterfaceOperationsComponent, input: {title: 'Interface Operations'}, isActive: false, tooltipText: 'Interface Operations'}
+ infoTab: {
+ titleIcon: 'info-circle',
+ component: InfoTabComponent,
+ input: {},
+ isActive: true,
+ tooltipText: 'Information',
+ testId: 'detail-tab-information'
+ },
+ policyProperties: {
+ titleIcon: 'settings-o',
+ component: GroupOrPolicyPropertiesTab,
+ input: {type: 'policy'},
+ isActive: false,
+ tooltipText: 'Properties',
+ testId: 'detail-tab-policy-properties'
+ },
+ policyTargets: {
+ titleIcon: 'inputs-o',
+ component: PolicyTargetsTabComponent,
+ input: {},
+ isActive: false,
+ tooltipText: 'Targets',
+ testId: 'detail-tab-policy-targets'
+ },
+ groupMembers: {
+ titleIcon: 'inputs-o',
+ component: GroupMembersTabComponent,
+ input: {},
+ isActive: false,
+ tooltipText: 'Members',
+ testId: 'detail-tab-group-members'
+ },
+ groupProperties: {
+ titleIcon: 'settings-o',
+ component: GroupOrPolicyPropertiesTab,
+ input: {type: 'group'},
+ isActive: false,
+ tooltipText: 'Properties',
+ testId: 'detail-tab-group-properties'
+ },
+ deploymentArtifacts: {
+ titleIcon: 'deployment-artifacts-o',
+ component: ArtifactsTabComponent,
+ input: {type: ArtifactGroupType.DEPLOYMENT},
+ isActive: false,
+ tooltipText: 'Deployment Artifacts',
+ testId: 'detail-tab-deployment-artifacts'
+ },
+ apiArtifacts: {
+ titleIcon: 'api-o',
+ component: ArtifactsTabComponent,
+ input: {type: ArtifactGroupType.SERVICE_API},
+ isActive: false,
+ tooltipText: 'API Artifacts',
+ testId: 'detail-tab-api-artifacts'
+ },
+ infoArtifacts: {
+ titleIcon: 'info-square-o',
+ component: ArtifactsTabComponent,
+ input: {type: ArtifactGroupType.INFORMATION},
+ isActive: false,
+ tooltipText: 'Information Artifacts',
+ testId: 'detail-tab-information-artifacts'
+ },
+ properties: {
+ titleIcon: 'settings-o',
+ component: PropertiesTabComponent,
+ input: {title: 'Properties and Attributes'},
+ isActive: false,
+ tooltipText: 'Properties',
+ testId: 'detail-tab-properties-attributes'
+ },
+ reqAndCapabilities: {
+ titleIcon: 'req-capabilities-o',
+ component: ReqAndCapabilitiesTabComponent,
+ input: {},
+ isActive: false,
+ tooltipText: 'Requirements and Capabilities',
+ testId: 'detail-tab-requirements-capabilities'
+ },
+ inputs: {
+ titleIcon: 'inputs-o',
+ component: PropertiesTabComponent,
+ input: {title: 'Inputs'},
+ isActive: false,
+ tooltipText: 'Inputs',
+ testId: 'detail-tab-inputs'
+ },
+ settings: {
+ titleIcon: 'settings-o',
+ component: PropertiesTabComponent,
+ input: {},
+ isActive: false,
+ tooltipText: 'Settings',
+ testId: 'detail-tab-settings'
+ },
+ consumption: {
+ titleIcon: 'api-o',
+ component: ServiceConsumptionTabComponent,
+ input: {title: 'OPERATION CONSUMPTION'},
+ isActive: false,
+ tooltipText: 'Service Consumption',
+ testId: 'detail-tab-operation-consumption'
+ },
+ dependencies: {
+ titleIcon: 'archive',
+ component: ServiceDependenciesTabComponent,
+ input: {title: 'DIRECTIVES AND NODE FILTER'},
+ isActive: false,
+ tooltipText: 'Service Dependencies',
+ testId: 'detail-tab-directives-node-filter'
+ },
+ substitutionFilter: {
+ titleIcon: 'composition-o',
+ component: SubstitutionFilterTabComponent,
+ input: {title: 'SUBSTITUTION FILTER'},
+ isActive: false,
+ tooltipText: 'Substitution Filter',
+ testId: 'detail-tab-substitution-filter'
+ },
+ interfaceOperations: {
+ titleIcon: 'composition-o',
+ component: InterfaceOperationsComponent,
+ input: {title: 'Interface Operations'},
+ isActive: false,
+ tooltipText: 'Interface Operations',
+ testId: 'detail-tab-interface-operations'
+ }
};
@Component({