fix(core/pipeline): When a pipeline or jenkins parameter is no longer…

… accepted by the job/pipeline, show the parameter value (in addition to the name) in the warning message. (#7149)
spinnaker · Jun 27, 2019 · 973bd5c · 973bd5c
1 parent 8d929f0
commit 973bd5c
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 19 deletions.
diff --git a/app/scripts/modules/core/src/pipeline/config/stages/jenkins/jenkinsStage.html b/app/scripts/modules/core/src/pipeline/config/stages/jenkins/jenkinsStage.html
@@ -170,17 +170,16 @@ <h4 class="text-left">Job Parameters</h4>
         </label>
       </div>
     </div>
-    <div ng-if="invalidParameters.length" class="horizontal center sp-margin-l-top" style="width: 100%">
+    <div ng-if="hasInvalidParameters()" class="horizontal center sp-margin-l-top" style="width: 100%">
       <div class="alert alert-danger vertical">
         <p>
           <i class="fa fa-exclamation-triangle"></i>
           The following parameters are not accepted by the jenkins job but are still set in the stage configuration:
         </p>
-        <ul>
-          <li ng-repeat="paramName in invalidParameters">
-            {{paramName}}
-          </li>
-        </ul>
+        <div ng-repeat="(paramName, paramValue) in invalidParameters" class="flex-container-h" style="margin: 0.5em">
+          <label class="col-md-2">{{paramName}}</label>
+          <input class="flex-grow" type="text" style="width: 100%" disabled value="{{paramValue}}" />
+        </div>
         <button class="self-right passive" ng-click="jenkinsStageCtrl.removeInvalidParameters()">Remove all</button>
       </div>
     </div>

diff --git a/app/scripts/modules/core/src/pipeline/config/stages/jenkins/jenkinsStage.js b/app/scripts/modules/core/src/pipeline/config/stages/jenkins/jenkinsStage.js
@@ -4,6 +4,7 @@ import { Registry } from 'core/registry';
 
 import { IgorService, BuildServiceType } from 'core/ci/igor.service';
 import { JenkinsExecutionLabel } from './JenkinsExecutionLabel';
+import { pickBy } from 'lodash';
 
 const angular = require('angular');
 
@@ -118,8 +119,9 @@ module.exports = angular
 
             if ($scope.jobParams) {
               const acceptedJobParameters = $scope.jobParams.map(param => param.name);
-              $scope.invalidParameters = Object.keys($scope.userSuppliedParameters).filter(
-                paramName => !acceptedJobParameters.includes(paramName),
+              $scope.invalidParameters = pickBy(
+                $scope.userSuppliedParameters,
+                (value, name) => !acceptedJobParameters.includes(name),
               );
             }
 
@@ -133,6 +135,7 @@ module.exports = angular
         }
       }
 
+      $scope.hasInvalidParameters = () => Object.keys($scope.invalidParameters || {}).length;
       $scope.useDefaultParameters = {};
       $scope.userSuppliedParameters = {};
 
@@ -146,12 +149,12 @@ module.exports = angular
       };
 
       this.removeInvalidParameters = function() {
-        $scope.invalidParameters.forEach(param => {
+        Object.keys($scope.invalidParameters).forEach(param => {
           if ($scope.stage.parameters[param] !== 'undefined') {
             delete $scope.stage.parameters[param];
           }
         });
-        $scope.invalidParameters = [];
+        $scope.invalidParameters = {};
       };
 
       initializeMasters();

diff --git a/app/scripts/modules/core/src/pipeline/config/stages/pipeline/pipelineStage.html b/app/scripts/modules/core/src/pipeline/config/stages/pipeline/pipelineStage.html
@@ -83,17 +83,16 @@ <h4 class="text-left">Pipeline Parameters</h4>
         </label>
       </div>
     </div>
-    <div ng-if="invalidParameters.length" class="horizontal center sp-margin-l-top" style="width: 100%">
+    <div ng-if="hasInvalidParameters()" class="horizontal center sp-margin-l-top" style="width: 100%">
       <div class="alert alert-danger vertical">
         <p>
           <i class="fa fa-exclamation-triangle"></i>
           The following parameters are not accepted by the pipeline but are still set in the stage configuration:
         </p>
-        <ul>
-          <li ng-repeat="paramName in invalidParameters">
-            {{paramName}}
-          </li>
-        </ul>
+        <div ng-repeat="(paramName, paramValue) in invalidParameters" class="flex-container-h" style="margin: 0.5em">
+          <label class="col-md-2">{{paramName}}</label>
+          <input class="flex-grow" type="text" style="width: 100%" disabled value="{{paramValue}}" />
+        </div>
         <button class="self-right passive" ng-click="pipelineStageCtrl.removeInvalidParameters()">Remove all</button>
       </div>
     </div>

diff --git a/app/scripts/modules/core/src/pipeline/config/stages/pipeline/pipelineStage.js b/app/scripts/modules/core/src/pipeline/config/stages/pipeline/pipelineStage.js
@@ -1,5 +1,7 @@
 'use strict';
 
+import { pickBy } from 'lodash';
+
 const angular = require('angular');
 
 import { ApplicationReader } from 'core/application/service/ApplicationReader';
@@ -106,11 +108,13 @@ module.exports = angular
 
             if ($scope.pipelineParameters) {
               const acceptedPipelineParams = $scope.pipelineParameters.map(param => param.name);
-              $scope.invalidParameters = Object.keys($scope.userSuppliedParameters).filter(
-                paramName => !acceptedPipelineParams.includes(paramName),
+              $scope.invalidParameters = pickBy(
+                $scope.userSuppliedParameters,
+                (value, name) => !acceptedPipelineParams.includes(name),
               );
             }
 
+            $scope.hasInvalidParameters = () => Object.keys($scope.invalidParameters || {}).length;
             $scope.useDefaultParameters = {};
             _.each($scope.pipelineParameters, function(property) {
               if (!(property.name in $scope.stage.pipelineParameters) && property.default !== null) {
@@ -144,7 +148,7 @@ module.exports = angular
       };
 
       this.removeInvalidParameters = function() {
-        $scope.invalidParameters.forEach(param => {
+        Object.keys($scope.invalidParameters).forEach(param => {
           if ($scope.stage.pipelineParameters[param] !== 'undefined') {
             delete $scope.stage.pipelineParameters[param];
           }