VFModule with missing data should show alert icon

Issue-ID: VID-737
Signed-off-by: Yoav Schneiderman <yoav.schneiderman@intl.att.com>
Change-Id: I02b4cc9defb87ab618e395c8c608f48a93461e6f

2 files changed, 21 insertions, 7 deletions

diff --git a/vid-webpack-master/cypress/integration/iFrames/drawingBoard.e2e.ts b/vid-webpack-master/cypress/integration/iFrames/drawingBoard.e2e.ts
index 1fcc82802..cf870b7b9 100644
--- a/vid-webpack-master/cypress/integration/iFrames/drawingBoard.e2e.ts
+++ b/vid-webpack-master/cypress/integration/iFrames/drawingBoard.e2e.ts
@@ -301,6 +301,21 @@ describe('Drawing board', function () {
       cy.updateServiceShouldNotOverrideChild();
     });
 
+
+    it('should show vfModule missong data icon ', () => {
+      const serviceModelId : string = 'f4d84bb4-a416-4b4e-997e-0059973630b9';
+      let res = getReduxWithVNFMissingData();
+      res.service.serviceInstance['f4d84bb4-a416-4b4e-997e-0059973630b9'].vnfs['2017-488_PASQUALE-vPE 0:0001'].vfModules['2017488_pasqualevpe0..2017488PasqualeVpe..PASQUALE_base_vPE_BV..module-0']['2017488_pasqualevpe0..2017488PasqualeVpe..PASQUALE_base_vPE_BV..module-0jkyqv'].isMissingData = true;
+      cy.setReduxState(<any>res);
+      cy.openIframe(`app/ui/#/servicePlanning?serviceModelId=${serviceModelId}`);
+      cy.getElementByDataTestsId('node-040e591e-5d30-4e0d-850f-7266e5a8e013-2017488_pasqualevpe0..2017488PasqualeVpe..PASQUALE_base_vPE_BV..module-0-alert-icon').should('have.class', 'icon-alert');
+
+      cy.getElementByDataTestsId('node-040e591e-5d30-4e0d-850f-7266e5a8e013-2017488_pasqualevpe0..2017488PasqualeVpe..PASQUALE_base_vPE_BV..module-0-menu-btn').eq(1).click({force:true})
+        .getElementByDataTestsId('context-menu-edit').click()
+        .getElementByDataTestsId('form-set').click()
+        .getElementByDataTestsId('node-040e591e-5d30-4e0d-850f-7266e5a8e013-2017488_pasqualevpe0..2017488PasqualeVpe..PASQUALE_base_vPE_BV..module-0-alert-icon').should('not.have.class', 'icon-alert');
+    });
+
     xit('should display service model name', () => {
       cy.readFile('cypress/support/jsonBuilders/mocks/jsons/emptyServiceRedux.json').then((res) => {
         cy.setReduxState(<any>res);
diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/drawing-board-tree.html b/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/drawing-board-tree.html
index 8db53e808..ea2362949 100644
--- a/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/drawing-board-tree.html
+++ b/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/drawing-board-tree.html
@@ -27,7 +27,8 @@
              id="drawing-board-tree">
 
     <ng-template #treeNodeTemplate let-node let-index="index">
-      <div class="main-row" [attr.id]="getNodeId(node)" [attr.data-tests-id]="'node-'+node.data.modelId +'-' +node.data.modelName"
+      <div class="main-row" [attr.id]="getNodeId(node)"
+           [attr.data-tests-id]="'node-'+node.data.modelId +'-' +node.data.modelName"
            (click)="selectNode(node)"
            [ngClass]="{'isLinked' : isLinkedInstance(node?.data)}">
         <custom-popover class="failed-popover-wrap" *ngIf="node?.data?.isFailed" [value]="node?.data?.statusMessage"
@@ -89,10 +90,10 @@
           </context-menu>
           </span>
           <span
-            *ngIf="drawingBoardTreeService.isVNFMissingData(node, serviceModelId)"
+            *ngIf="drawingBoardTreeService.isVNFMissingData(node, serviceModelId) || drawingBoardTreeService.isVFModuleMissingData(node, serviceModelId)"
             tooltip="{{ missingDataTooltip }}"
             tooltipPlacement="left"
-            [attr.data-tests-id]="'node-'+node.data.modelId +'-' +node.data.modelName+'-alert-icon'"
+            [attr.data-tests-id]="'node-'+ node.data.modelId + '-' + node.data.modelName +'-alert-icon'"
             class="icon-alert">
               <svg-icon
                 [mode]="'warning'"
@@ -101,15 +102,13 @@
                 [name]="'alert-triangle-o'">
               </svg-icon>
           </span>
-          <span *ngIf="drawingBoardTreeService.isVFModuleMissingData(node, serviceModelId)" class="icon-alert"
-                tooltip="{{ missingDataTooltip }}" tooltipPlacement="left"
-                [attr.data-tests-id]="'node-'+node.data.modelId +'-' +node.data.modelName+'-alert-icon'"></span>
         </div>
 
         <div class="action-status">
           <span
             [ngClass]="isUpgraded(node)?'action-status-type upgrade':'action-status-type delete'"
-            [attr.data-tests-id]="isUpgraded(node)?'action-status-type':'delete-status-type'" [ngStyle]="{ 'opacity': isUpgraded(node) || isDeleted(node) ? '1' : '0'}">{{isUpgraded(node)?"Upgrade":"Delete"}}</span>
+            [attr.data-tests-id]="isUpgraded(node)?'action-status-type':'delete-status-type'"
+            [ngStyle]="{ 'opacity': isUpgraded(node) || isDeleted(node) ? '1' : '0'}">{{isUpgraded(node) ? "Upgrade" : "Delete"}}</span>
         </div>
       </div>
     </ng-template>