feat(esc): Add support for task definition artifacts (#7162)

* feat(ecs): Add support for task definition artifacts * fix help text, unused var error * add context msgs to image options
spinnaker · Jul 1, 2019 · 5401a87 · 5401a87
1 parent ccf080a
commit 5401a87
Show file tree

Hide file tree

Showing 9 changed files with 468 additions and 38 deletions.
diff --git a/app/scripts/modules/ecs/src/ecs.help.ts b/app/scripts/modules/ecs/src/ecs.help.ts
@@ -52,6 +52,16 @@ const helpContents: { [key: string]: string } = {
     '<p>The container\'s logging driver.  This directly maps to the <a href="https://docs.docker.com/config/containers/logging/configure/#configure-the-default-logging-driver"><b>--log-driver</b> Docker flag.</a></p>',
   'ecs.logOptions':
     '<p>A map of log options.  This directly maps with the <a href="https://docs.docker.com/config/containers/logging/log_tags/"><b>--log-opt</b> Docker flag  </a></p>',
+  'ecs.taskDefinition':
+    '<p>The source of the ECS Task Definition. Task Definition contents can either be entering manually via input fields or from a selected JSON file artifact. Artifact file contents should be structured as an ECS "RegisterTaskDefinition" request.</p>',
+  'ecs.taskDefinitionArtifact': '<p>The artifact containing the ECS Task Definition.</p>',
+  'ecs.containerMappings':
+    '<p>The list of expected containers within the Task Definition and which container image they should use. Containers in the Task Definition which are not specified here will be registered as they appear in the artifact.</p>',
+  'ecs.containerMappingName':
+    '<p>The name of the container. Name should match the <a href="https://docs.aws.amazon.com/AmazonECS/latest/APIReference/API_ContainerDefinition.html#ECS-Type-ContainerDefinition-name"><b>containerDefinition.name</b></a> field as it appears in the Task Definition.</p>',
+  'ecs.containerMappingImage': '<p>The container image the named container should run.</p>',
+  'ecs.loadBalancedContainer':
+    '<p>The container in the Task Definition that should receive traffic from the load balancer. Required if a load balancer target group has been specified.</p>',
   'ecs.tags': '<p>The tags to apply to the task definition and the service',
   'ecs.environmentVariables':
     '<p>The environment variable(s) your container are deployed with. SERVER_GROUP, CLOUD_STACK and CLOUD_DETAIL environment variables are used during deployment to identify the task and cannot be set here.</p>',

diff --git a/app/scripts/modules/ecs/src/ecs.module.ts b/app/scripts/modules/ecs/src/ecs.module.ts
@@ -16,6 +16,7 @@ import './ecs.help';
 import { COMMON_MODULE } from './common/common.module';
 import { ECS_SERVERGROUP_MODULE } from './serverGroup/serverGroup.module';
 import { ECS_SERVER_GROUP_LOGGING } from './serverGroup/configure/wizard/logging/logging.component';
+import { TASK_DEFINITION_REACT } from './serverGroup/configure/wizard/taskDefinition/TaskDefinition';
 
 import './logo/ecs.logo.less';
 
@@ -38,6 +39,7 @@ angular
     require('./serverGroup/configure/wizard/advancedSettings/advancedSettings.component').name,
     require('./serverGroup/configure/wizard/container/container.component').name,
     require('./serverGroup/configure/wizard/horizontalScaling/horizontalScaling.component').name,
+    TASK_DEFINITION_REACT,
     ECS_SERVER_GROUP_LOGGING,
     ECS_NETWORKING_SECTION,
     ECS_CLUSTER_READ_SERVICE,

diff --git a/app/scripts/modules/ecs/src/serverGroup/configure/serverGroupCommandBuilder.service.js b/app/scripts/modules/ecs/src/serverGroup/configure/serverGroupCommandBuilder.service.js
@@ -141,6 +141,8 @@ module.exports = angular
               healthCheckGracePeriodSeconds: '',
               placementConstraints: [],
               placementStrategyName: '',
+              taskDefinitionArtifact: {},
+              useTaskDefinitionArtifact: false,
               placementStrategySequence: [],
               serviceDiscoveryAssociations: [],
               ecsClusterName: '',
@@ -201,6 +203,8 @@ module.exports = angular
             existingPipelineCluster: true,
             dirty: {},
             contextImages: contextImages,
+            pipeline: pipeline,
+            currentStage: current,
           };
 
           var viewOverrides = {
@@ -224,9 +228,12 @@ module.exports = angular
         return $q.when({
           viewState: {
             requiresTemplateSelection: true,
+            // applies viewState overrides after template selection
             overrides: {
               viewState: {
                 contextImages: contextImages,
+                pipeline: pipeline,
+                currentStage: current,
               },
             },
           },
@@ -247,6 +254,7 @@ module.exports = angular
       function buildServerGroupCommandFromExisting(application, serverGroup, mode = 'clone') {
         var preferredZonesLoader = AccountService.getPreferredZonesByAccount('ecs');
 
+        // TODO: not set when called w/ existing template, might need to call buildUpdateServerGroupCommand?
         var serverGroupName = NameUtils.parseServerGroupName(serverGroup.asg.autoScalingGroupName);
 
         var asyncLoader = $q.all({
@@ -291,6 +299,11 @@ module.exports = angular
               .map(process => process.processName)
               .filter(name => !enabledProcesses.includes(name)),
             targetGroup: serverGroup.targetGroup,
+            taskDefinitionArtifact: {},
+            taskDefinitionArtifactAccount: '',
+            useTaskDefinitionArtifact: false,
+            containerMappings: [],
+            loadBalancedContainer: '',
             copySourceScalingPoliciesAndActions: true,
             viewState: {
               instanceProfile: asyncData.instanceProfile,

diff --git a/app/scripts/modules/ecs/src/serverGroup/configure/serverGroupConfiguration.service.ts b/app/scripts/modules/ecs/src/serverGroup/configure/serverGroupConfiguration.service.ts
@@ -5,7 +5,10 @@ import {
   AccountService,
   CACHE_INITIALIZER_SERVICE,
   IAccountDetails,
+  IArtifact,
   IDeploymentStrategy,
+  IPipeline,
+  IStage,
   IRegion,
   IServerGroupCommand,
   IServerGroupCommandBackingData,
@@ -59,6 +62,8 @@ export interface IEcsDockerImage extends IDockerImage {
 
 export interface IEcsServerGroupCommandViewState extends IServerGroupCommandViewState {
   contextImages: IEcsDockerImage[];
+  pipeline: IPipeline;
+  currentStage: IStage;
 }
 
 export interface IEcsServerGroupCommandBackingDataFiltered extends IServerGroupCommandBackingDataFiltered {
@@ -87,6 +92,16 @@ export interface IEcsServerGroupCommandBackingData extends IServerGroupCommandBa
   images: IEcsDockerImage[];
 }
 
+export interface IEcsTaskDefinitionArtifact {
+  artifact?: IArtifact;
+  artifactId?: string;
+}
+
+export interface IEcsContainerMapping {
+  containerName: string;
+  imageDescription: IEcsDockerImage;
+}
+
 export interface IEcsServerGroupCommand extends IServerGroupCommand {
   backingData: IEcsServerGroupCommandBackingData;
   targetHealthyDeployPercentage: number;
@@ -95,6 +110,10 @@ export interface IEcsServerGroupCommand extends IServerGroupCommand {
   placementStrategySequence: IPlacementStrategy[];
   imageDescription: IEcsDockerImage;
   viewState: IEcsServerGroupCommandViewState;
+  taskDefinitionArtifact: IEcsTaskDefinitionArtifact;
+  taskDefinitionArtifactAccount: string;
+  containerMappings: IEcsContainerMapping[];
+  loadBalancedContainer: string;
 
   subnetTypeChanged: (command: IEcsServerGroupCommand) => IServerGroupCommandResult;
   placementStrategyNameChanged: (command: IEcsServerGroupCommand) => IServerGroupCommandResult;
@@ -210,6 +229,7 @@ export class EcsServerGroupConfigurationService {
       .then((backingData: Partial<IEcsServerGroupCommandBackingData>) => {
         backingData.accounts = keys(backingData.credentialsKeyedByAccount);
         backingData.filtered = {} as IEcsServerGroupCommandBackingDataFiltered;
+
         if (cmd.viewState.contextImages) {
           backingData.images = backingData.images.concat(cmd.viewState.contextImages);
         }

diff --git a/app/scripts/modules/ecs/src/serverGroup/configure/wizard/CloneServerGroup.ecs.controller.js b/app/scripts/modules/ecs/src/serverGroup/configure/wizard/CloneServerGroup.ecs.controller.js
@@ -8,6 +8,7 @@ import {
   SERVER_GROUP_WRITER,
   TaskMonitor,
   ModalWizard,
+  STAGE_ARTIFACT_SELECTOR_COMPONENT_REACT,
 } from '@spinnaker/core';
 
 import { ECS_SERVER_GROUP_CONFIGURATION_SERVICE } from '../serverGroupConfiguration.service';
@@ -25,6 +26,7 @@ module.exports = angular
     IAM_ROLE_READ_SERVICE,
     ECS_CLUSTER_READ_SERVICE,
     ECS_SECRET_READ_SERVICE,
+    STAGE_ARTIFACT_SELECTOR_COMPONENT_REACT,
   ])
   .controller('ecsCloneServerGroupCtrl', [
     '$scope',
@@ -81,6 +83,10 @@ module.exports = angular
           'ecs.serverGroup.advancedSettings',
           require('./advancedSettings/advancedSettings.html'),
         ),
+        taskDefinition: overrideRegistry.getTemplate(
+          'ecs.taskDefinition',
+          require('./taskDefinition/taskDefinition.html'),
+        ),
       };
 
       $scope.title = title;
@@ -157,7 +163,7 @@ module.exports = angular
       });
 
       function configureCommand() {
-        ecsServerGroupConfigurationService.configureCommand(serverGroupCommand).then(function() {
+        ecsServerGroupConfigurationService.configureCommand($scope.command).then(function() {
           $scope.state.loaded = true;
           initializeCommand();
           initializeSelectOptions();
@@ -225,5 +231,19 @@ module.exports = angular
         $scope.state.requiresTemplateSelection = false;
         configureCommand();
       };
+
+      // used by react components to update command fields in parent (angular) scope
+      $scope.notifyAngular = function(commandKey, value) {
+        if (commandKey == 'pipeline') {
+          $scope.command.viewState.pipeline = value;
+        } else {
+          $scope.command[commandKey] = value;
+        }
+      };
+
+      // used by react components to configure command for image queries
+      $scope.configureCommand = function(query) {
+        return ecsServerGroupConfigurationService.configureCommand($scope.command, query);
+      };
     },
   ]);
diff --git a/...les/ecs/src/serverGroup/configure/wizard/advancedSettings/advancedSettings.component.html b/...les/ecs/src/serverGroup/configure/wizard/advancedSettings/advancedSettings.component.html
@@ -38,26 +38,28 @@
     </div>
   </div>
 
-  <div class="form-group">
-    <div class="col-md-5 sm-label-right">
-      <b>Docker Image Credentials</b> <help-field key="ecs.dockerimagecredentials"></help-field>
-    </div>
-    <div class="col-md-7" ng-if="!$ctrl.command.backingData.filtered.secrets.length">
-      No account or region was selected, or no AWS Secrets Manager secrets are available in this account and region.
-    </div>
+  <div ng-if="!$ctrl.command.useTaskDefinitionArtifact">
+    <div class="form-group">
+      <div class="col-md-5 sm-label-right">
+        <b>Docker Image Credentials</b> <help-field key="ecs.dockerimagecredentials"></help-field>
+      </div>
+      <div class="col-md-7" ng-if="!$ctrl.command.backingData.filtered.secrets.length">
+        No account or region was selected, or no AWS Secrets Manager secrets are available in this account and region.
+      </div>
 
-    <div class="col-md-7" ng-if="$ctrl.command.backingData.filtered.secrets.length">
-      <ui-select
-        ng-model="$ctrl.command.dockerImageCredentialsSecret"
-        class="form-control input-sm"
-        required
-        on-select="$ctrl.fieldChanged()"
-      >
-        <ui-select-match>{{ $select.selected }}</ui-select-match>
-        <ui-select-choices repeat="secret in $ctrl.command.backingData.filtered.secrets | filter: $select.search">
-          <span ng-bind-html="secret"></span>
-        </ui-select-choices>
-      </ui-select>
+      <div class="col-md-7" ng-if="$ctrl.command.backingData.filtered.secrets.length">
+        <ui-select
+          ng-model="$ctrl.command.dockerImageCredentialsSecret"
+          class="form-control input-sm"
+          required
+          on-select="$ctrl.fieldChanged()"
+        >
+          <ui-select-match>{{ $select.selected }}</ui-select-match>
+          <ui-select-choices repeat="secret in $ctrl.command.backingData.filtered.secrets | filter: $select.search">
+            <span ng-bind-html="secret"></span>
+          </ui-select-choices>
+        </ui-select>
+      </div>
     </div>
   </div>
 
@@ -114,10 +116,10 @@
                 class="form-control input-sm"
                 ng-model="constraint.type"
                 ng-options="type for type in ['distinctInstance', 'memberOf']"
-              />
+              ></select>
             </td>
             <td>
-              <input type="text" class="form-control input-sm no-spel" ng-model="constraint.expression"/>
+              <input type="text" class="form-control input-sm no-spel" ng-model="constraint.expression" />
             </td>
             <td>
               <div class="form-control-static">
@@ -143,20 +145,22 @@
     </form>
   </div>
 
-  <div class="form-group">
-    <div class="sm-label-left">
-      <b>Docker labels (optional)</b>
-      <help-field key="ecs.dockerLabels"></help-field>
+  <div ng-if="!$ctrl.command.useTaskDefinitionArtifact">
+    <div class="form-group">
+      <div class="sm-label-left">
+        <b>Docker labels (optional)</b>
+        <help-field key="ecs.dockerLabels"></help-field>
+      </div>
+      <map-editor model="$ctrl.command.dockerLabels" allow-empty="true"></map-editor>
     </div>
-    <map-editor model="$ctrl.command.dockerLabels" allow-empty="true"></map-editor>
-  </div>
 
-  <div class="form-group">
-    <div class="sm-label-left">
-      <b>Environment Variables (optional)</b>
-      <help-field key="ecs.environmentVariables"></help-field>
+    <div class="form-group">
+      <div class="sm-label-left">
+        <b>Environment Variables (optional)</b>
+        <help-field key="ecs.environmentVariables"></help-field>
+      </div>
+      <map-editor model="$ctrl.command.environmentVariables" allow-empty="true"></map-editor>
     </div>
-    <map-editor model="$ctrl.command.environmentVariables" allow-empty="true"></map-editor>
   </div>
 
   <div class="form-group">
@@ -166,4 +170,15 @@
     </div>
     <map-editor model="$ctrl.command.tags" allow-empty="true"></map-editor>
   </div>
+
+  <div ng-if="$ctrl.command.useTaskDefinitionArtifact" style="color:#666;">
+    <hr />
+    <p>
+      <em
+        ><strong>Docker Image Credentials, Docker labels</strong>, and <strong>Environment Variables</strong> cannot be
+        individually set when using a Task Definition artifact. Please include them in their respective container
+        definition in that file.
+      </em>
+    </p>
+  </div>
 </div>
diff --git a/app/scripts/modules/ecs/src/serverGroup/configure/wizard/serverGroupWizard.html b/app/scripts/modules/ecs/src/serverGroup/configure/wizard/serverGroupWizard.html
@@ -13,15 +13,22 @@ <h3 us-spinner="{radius:30, width:8, length: 16}"></h3>
       <v2-wizard-page key="networking" label="Networking" done="true">
         <ng-include src="pages.networking"></ng-include>
       </v2-wizard-page>
-      <v2-wizard-page key="container" label="Container" done="true">
-        <ng-include src="pages.container"></ng-include>
+      <v2-wizard-page key="taskDefinition" label="Task Definition" done="true">
+        <ng-include src="pages.taskDefinition"></ng-include>
       </v2-wizard-page>
+      <div ng-if="!command.useTaskDefinitionArtifact">
+        <v2-wizard-page key="container" label="Container" done="true">
+          <ng-include src="pages.container"></ng-include>
+        </v2-wizard-page>
+      </div>
       <v2-wizard-page key="horizontalScaling" label="Horizontal Scaling" done="true">
         <ng-include src="pages.horizontalScaling"></ng-include>
       </v2-wizard-page>
-      <v2-wizard-page key="logging" label="Logging" done="true">
-        <ng-include src="pages.logging"></ng-include>
-      </v2-wizard-page>
+      <div ng-if="!command.useTaskDefinitionArtifact">
+        <v2-wizard-page key="logging" label="Logging" done="true">
+          <ng-include src="pages.logging"></ng-include>
+        </v2-wizard-page>
+      </div>
       <v2-wizard-page key="serviceDiscovery" label="Service Discovery" done="true">
         <ng-include src="pages.serviceDiscovery"></ng-include>
       </v2-wizard-page>