fix(docker): Fixed imageId parsing and digest support (#7053)

app/scripts/modules/docker/src/image/DockerImageAndTagSelector.tsx

@@ -84,7 +84,7 @@ export class DockerImageAndTagSelector extends React.Component<
     const repositoryOptions =
       props.repository && props.repository.length ? [{ label: props.repository, value: props.repository }] : [];
     const tagOptions = props.tag && props.tag.length ? [{ label: props.tag, value: props.tag }] : [];
-
+    const parsedImageId = DockerImageUtils.splitImageId(props.imageId);
     const defineManually = Boolean(props.imageId && props.imageId.includes('${'));
 
     this.state = {
@@ -96,7 +96,7 @@ export class DockerImageAndTagSelector extends React.Component<
       repositoryOptions,
       defineManually,
       tagOptions,
-      lookupType: props.digest ? 'digest' : 'tag',
+      lookupType: props.digest || parsedImageId.digest ? 'digest' : 'tag',
     };
   }
 
@@ -429,6 +429,8 @@ export class DockerImageAndTagSelector extends React.Component<
       tagOptions,
     } = this.state;
 
+    const parsedImageId = DockerImageUtils.splitImageId(imageId);
+
     const manualInputToggle = (
       <div className="sp-formItem groupHeader">
         <div className="sp-formItem__left">
@@ -659,7 +661,7 @@ export class DockerImageAndTagSelector extends React.Component<
             <input
               className="form-control input-sm"
               placeholder="sha256:abc123"
-              value={digest || ''}
+              value={digest || parsedImageId.digest || ''}
               onChange={e => this.valueChanged('digest', e.target.value)}
               required={true}
             />

app/scripts/modules/docker/src/image/DockerImageUtils.spec.ts

@@ -0,0 +1,102 @@
+import { DockerImageUtils } from './DockerImageUtils';
+
+describe('imageId parsing', () => {
+  it('parses undefined without choking', () => {
+    expect(DockerImageUtils.splitImageId(undefined)).toEqual({
+      organization: '',
+      repository: '',
+      digest: undefined,
+      tag: undefined,
+    });
+  });
+
+  it('parses image with no organization and no tag/digest', () => {
+    const imageId = 'image';
+    expect(DockerImageUtils.splitImageId(imageId)).toEqual({
+      organization: '',
+      repository: 'image',
+      digest: undefined,
+      tag: undefined,
+    });
+  });
+
+  it('parses image with tag but no organization', () => {
+    const imageId = 'image:tag';
+    expect(DockerImageUtils.splitImageId(imageId)).toEqual({
+      organization: '',
+      repository: 'image',
+      digest: undefined,
+      tag: 'tag',
+    });
+  });
+
+  it('parses image with no organization and correctly distinguishes digest from tag', () => {
+    const imageId = 'image:sha256:abc123';
+    expect(DockerImageUtils.splitImageId(imageId)).toEqual({
+      organization: '',
+      repository: 'image',
+      digest: 'sha256:abc123',
+      tag: undefined,
+    });
+  });
+
+  it('parses image with organization but no tag/digest', () => {
+    const imageId = 'organization/image';
+    expect(DockerImageUtils.splitImageId(imageId)).toEqual({
+      organization: 'organization',
+      repository: 'organization/image',
+      digest: undefined,
+      tag: undefined,
+    });
+  });
+
+  it('parses image with organization and tag', () => {
+    const imageId = 'organization/image:tag';
+    expect(DockerImageUtils.splitImageId(imageId)).toEqual({
+      organization: 'organization',
+      repository: 'organization/image',
+      digest: undefined,
+      tag: 'tag',
+    });
+  });
+
+  it('parses image with organization and correctly distinguishes digest from tag', () => {
+    const imageId = 'organization/image:sha256:abc123';
+    expect(DockerImageUtils.splitImageId(imageId)).toEqual({
+      organization: 'organization',
+      repository: 'organization/image',
+      digest: 'sha256:abc123',
+      tag: undefined,
+    });
+  });
+
+  it('parses image with nested organization', () => {
+    const imageId = 'nested/organization/image';
+    expect(DockerImageUtils.splitImageId(imageId)).toEqual({
+      organization: 'nested/organization',
+      repository: 'nested/organization/image',
+      digest: undefined,
+      tag: undefined,
+    });
+  });
+
+  it('parses image with tag and nested organization', () => {
+    const imageId = 'nested/organization/image:tag';
+    expect(DockerImageUtils.splitImageId(imageId)).toEqual({
+      organization: 'nested/organization',
+      repository: 'nested/organization/image',
+      digest: undefined,
+      tag: 'tag',
+    });
+  });
+
+  it('parses image with nested organization and correctly distinguishes digest from tag', () => {
+    const imageId = 'nested/organization/image:sha256:abc123';
+    expect(DockerImageUtils.splitImageId(imageId)).toEqual({
+      organization: 'nested/organization',
+      repository: 'nested/organization/image',
+      digest: 'sha256:abc123',
+      tag: undefined,
+    });
+  });
+});

app/scripts/modules/docker/src/image/DockerImageUtils.ts

@@ -7,13 +7,15 @@ export interface IDockerImageParts {
 
 export class DockerImageUtils {
   // Split the image id up into the selectable parts to feed the UI
-  public static splitImageId(imageId: string): IDockerImageParts {
-    const parts = imageId.split('/');
-    const organization = parts.length > 1 ? parts.shift() : '';
-    const rest = parts.shift().split(':');
-    const repository = organization.length > 0 ? `${organization}/${rest.shift()}` : rest.shift();
+  public static splitImageId(imageId = ''): IDockerImageParts {
+    const imageParts = imageId.split(':');
+    const repository = imageParts[0];
+    const repositoryParts = repository.split('/');
+    // Everything before the last slash is considered the organization
+    const organization = repositoryParts.slice(0, -1).join('/');
+
+    const lookup = imageParts.length > 1 ? imageParts.slice(1).join(':') : '';
 
-    const lookup = rest.shift();
     let tag: string;
     let digest: string;
     if (lookup) {

app/scripts/modules/titus/src/serverGroup/configure/ServerGroupCommandBuilder.js

@@ -146,7 +146,12 @@ module.exports = angular
         }
 
         if (mode !== 'editPipeline') {
-          command.imageId = serverGroup.image.dockerImageName + ':' + serverGroup.image.dockerImageVersion;
+          command.imageId =
+            serverGroup.image.dockerImageName +
+            ':' +
+            (serverGroup.image.dockerImageVersion
+              ? serverGroup.image.dockerImageVersion
+              : serverGroup.image.dockerImageDigest);
         }
 
         return $q.when(command);