@rancher/shell 3.0.5-rc.5 → 3.0.5-rc.7

package/components/fleet/__tests__/FleetGitRepoPaths.test.ts

@@ -0,0 +1,265 @@
+import { mount } from '@vue/test-utils';
+import { _EDIT } from '@shell/config/query-params';
+import FleetGitRepoPaths, { Subpath, getRelevantPrefixes } from '@shell/components/fleet/FleetGitRepoPaths.vue';
+
+describe('fx: getRelevantPrefixes', () => {
+  it('should return an empty array for an empty input array', () => {
+    const paths: string[] = [];
+
+    expect(getRelevantPrefixes(paths)).toStrictEqual([]);
+  });
+
+  it('should return the single path if only one is provided', () => {
+    const paths: string[] = ['aaa'];
+
+    expect(getRelevantPrefixes(paths)).toStrictEqual(['aaa']);
+  });
+
+  it('should return only 2nd level prefixes', () => {
+    const paths: string[] = [
+      'folderA/aaa',
+      'folderA/subfolderB/bbb',
+      'folderC/ccc'
+    ];
+
+    const res = getRelevantPrefixes(paths);
+
+    expect(res).toStrictEqual([
+      'folderC',
+      'folderA/subfolderB',
+      'folderA'
+    ]);
+  });
+
+  it('should return common prefix between 2 paths with same prefix', () => {
+    const paths: string[] = [
+      'level1/level2',
+      'level1/level2/aaa'
+    ];
+
+    const res = getRelevantPrefixes(paths);
+
+    expect(res).toStrictEqual([
+      'level1/level2'
+    ]);
+  });
+
+  it('should return common prefix between 2 paths with same low level prefix', () => {
+    const paths: string[] = [
+      'aaa/bbb/ccc',
+      'aaa/bbb/eee/fff'
+    ];
+
+    const res = getRelevantPrefixes(paths);
+
+    expect(res).toStrictEqual([
+      'aaa/bbb/eee',
+      'aaa/bbb'
+    ]);
+  });
+
+  it('should return all original paths if they are leaves or satisfy the one-child condition', () => {
+    const paths: string[] = [
+      'aaa',
+      'bbb',
+      'ccc'
+    ];
+
+    const res = getRelevantPrefixes(paths);
+
+    expect(res).toStrictEqual(['ccc', 'bbb', 'aaa']);
+  });
+
+  it('should handle multiple prefixes', () => {
+    const paths: string[] = [
+      'root/file1.txt',
+      'root/file2.txt',
+      'root/file3.txt'
+    ];
+
+    const res = getRelevantPrefixes(paths);
+
+    expect(res).toStrictEqual([
+      'root'
+    ]);
+  });
+
+  it('should add leaf nodes and single-child original paths, not grouping parents', () => {
+    const paths: string[] = [
+      'driven/kustomize/path1',
+      'driven/kustomize/path2',
+      'driven/kustomize',
+      'driven/simple',
+      'driven/helm'
+    ];
+
+    const res = getRelevantPrefixes(paths);
+
+    expect(res).toStrictEqual([
+      'driven/kustomize',
+      'driven',
+    ].sort((a, b) => b.localeCompare(a)));
+  });
+});
+
+describe('decode spec.targets to build UI source data', () => {
+  describe('mode: edit', () => {
+    const mode = _EDIT;
+
+    it('should build empty rows from empty paths and empty bundles', async() => {
+      const paths: string[] = [];
+      const bundles: Subpath[] = [];
+
+      const wrapper = mount(FleetGitRepoPaths, {
+        props: {
+          value:   { paths, bundles },
+          mode,
+          touched: {}
+        },
+      });
+
+      const { rows } = wrapper.vm;
+
+      expect(rows).toStrictEqual([]);
+    });
+
+    it('should build 1 row from 1 path', async() => {
+      const paths: string[] = ['path1'];
+      const bundles: Subpath[] = [];
+
+      const wrapper = mount(FleetGitRepoPaths, {
+        props: {
+          value:   { paths, bundles },
+          mode,
+          touched: {}
+        },
+      });
+
+      const { rows } = wrapper.vm;
+
+      expect(rows).toStrictEqual([{ path: 'path1' }]);
+    });
+
+    it('should build empty rows from empty subpaths', async() => {
+      const paths: string[] = [];
+      const bundles: any[] = [{}];
+
+      const wrapper = mount(FleetGitRepoPaths, {
+        props: {
+          value:   { paths, bundles },
+          mode,
+          touched: {}
+        },
+      });
+
+      const { rows } = wrapper.vm;
+
+      expect(rows).toStrictEqual([]);
+    });
+
+    it('should build empty rows from bundles with empty key', async() => {
+      const paths: string[] = [];
+      const bundles: Subpath[] = [{ base: '', options: 'dev.yaml' }];
+
+      const wrapper = mount(FleetGitRepoPaths, {
+        props: {
+          value:   { paths, bundles },
+          mode,
+          touched: {}
+        },
+      });
+
+      const { rows } = wrapper.vm;
+
+      expect(rows).toStrictEqual([]);
+    });
+
+    it('should build 1 path from bundles with empty options', async() => {
+      const paths: string[] = [];
+      const bundles: Subpath[] = [{ base: 'aaa', options: '' }];
+
+      const wrapper = mount(FleetGitRepoPaths, {
+        props: {
+          value:   { paths, bundles },
+          mode,
+          touched: {}
+        },
+      });
+
+      const { rows } = wrapper.vm;
+
+      expect(rows).toStrictEqual([{
+        isBundles: true,
+        path:      'aaa',
+        subpaths:  []
+      }]);
+    });
+
+    it('should build 1 row from bundles', async() => {
+      const paths: string[] = [];
+      const bundles: Subpath[] = [{ base: 'dev', options: 'dev.yaml' }];
+
+      const wrapper = mount(FleetGitRepoPaths, {
+        props: {
+          value:   { paths, bundles },
+          mode,
+          touched: {}
+        },
+      });
+
+      const { rows } = wrapper.vm;
+
+      expect(rows).toStrictEqual([{
+        isBundles: true,
+        path:      'dev',
+        subpaths:  [{
+          base:    '',
+          options: 'dev.yaml'
+        }]
+      }]);
+    });
+
+    it('should build rows from mixed paths and bundles', async() => {
+      const paths: string[] = ['folderC', 'folderA/subfolderB', 'folderA'];
+      const bundles: Subpath[] = [{
+        base:    'folderA',
+        options: 'dev.yaml'
+      }, {
+        base:    'vvv',
+        options: 'vvv.yaml'
+      }];
+
+      const wrapper = mount(FleetGitRepoPaths, {
+        props: {
+          value:   { paths, bundles },
+          mode,
+          touched: {}
+        },
+      });
+
+      const { rows } = wrapper.vm;
+
+      expect(rows).toStrictEqual([
+        {
+          path:     'vvv',
+          subpaths: [{
+            base:    '',
+            options: 'vvv.yaml'
+          }],
+          isBundles: true
+        },
+        {
+          path:     'folderA',
+          subpaths: [{
+            base:    '',
+            options: 'dev.yaml'
+          }],
+          isBundles: true
+        },
+        { path: 'folderC' },
+        { path: 'folderA/subfolderB' },
+        { path: 'folderA' }
+      ]);
+    });
+  });
+});

package/components/fleet/__tests__/FleetOCIStorageSecret.test.ts

@@ -79,11 +79,11 @@ describe('component: FleetOCIStorageSecret', () => {
       const wrapper = mount(FleetOCIStorageSecret, {
         props: {
           workspace: 'fleet-local',
-          secret:    null,
+          secret:    '',
           mode,
         },
         data() {
-          return { secrets: [], workspaces };
+          return { secrets: [], workspaces } as any;
         },
       });
 
@@ -95,11 +95,11 @@ describe('component: FleetOCIStorageSecret', () => {
       const wrapper = mount(FleetOCIStorageSecret, {
         props: {
           workspace: 'fleet-local',
-          secret:    null,
+          secret:    '',
           mode,
         },
         data() {
-          return { secrets, workspaces };
+          return { secrets, workspaces } as any;
         },
       });
 
@@ -114,11 +114,11 @@ describe('component: FleetOCIStorageSecret', () => {
       const wrapper = mount(FleetOCIStorageSecret, {
         props: {
           workspace: 'fleet-default',
-          secret:    null,
+          secret:    '',
           mode,
         },
         data() {
-          return { secrets, workspaces };
+          return { secrets, workspaces } as any;
         },
       });
 
@@ -134,11 +134,11 @@ describe('component: FleetOCIStorageSecret', () => {
       const wrapper = mount(FleetOCIStorageSecret, {
         props: {
           workspace: 'fleet-custom-workspace',
-          secret:    null,
+          secret:    '',
           mode,
         },
         data() {
-          return { secrets, workspaces };
+          return { secrets, workspaces } as any;
         },
       });
 
@@ -156,11 +156,11 @@ describe('component: FleetOCIStorageSecret', () => {
       const wrapper = mount(FleetOCIStorageSecret, {
         props: {
           workspace: '',
-          secret:    null,
+          secret:    '',
           mode,
         },
         data() {
-          return { secrets, workspaces };
+          return { secrets, workspaces } as any;
         },
       });
 
@@ -174,11 +174,11 @@ describe('component: FleetOCIStorageSecret', () => {
       const wrapper = mount(FleetOCIStorageSecret, {
         props: {
           workspace: '',
-          secret:    null,
+          secret:    '',
           mode,
         },
         data() {
-          return { secrets, workspaces };
+          return { secrets, workspaces } as any;
         },
       });
 
@@ -200,7 +200,7 @@ describe('component: FleetOCIStorageSecret', () => {
           mode,
         },
         data() {
-          return { secrets, workspaces };
+          return { secrets, workspaces } as any;
         },
       });
 

package/components/fleet/__tests__/FleetValuesFrom.test.ts

@@ -0,0 +1,300 @@
+import { mount } from '@vue/test-utils';
+import flushPromises from 'flush-promises';
+import { _CREATE, _EDIT } from '@shell/config/query-params';
+import FleetValuesFrom from '@shell/components/fleet/FleetValuesFrom.vue';
+
+const requiredSetup = () => {
+  return { global: { mocks: { $store: { getters: { namespaces: () => ['fleet-default', 'fleet-local'] } } } } };
+};
+
+const allConfigMaps = [
+  {
+    id:       'fleet-local/configmap-1',
+    name:     'configmap-1',
+    metadata: {
+      namespace: 'fleet-local',
+      name:      'configmap-1'
+    },
+    data: { foo0: 'bar0' }
+  },
+  {
+    id:       'fleet-default/configmap-2',
+    name:     'configmap-2',
+    metadata: {
+      namespace: 'fleet-default',
+      name:      'configmap-2'
+    },
+    data: { foo1: 'bar1' }
+  }
+];
+
+const allSecrets = [
+  {
+    id:       'fleet-local/secret-1',
+    name:     'secret-1',
+    metadata: {
+      namespace: 'fleet-local',
+      name:      'secret-1'
+    },
+    data: { foo2: 'bar2' }
+  },
+  {
+    id:       'fleet-default/secret-2',
+    name:     'secret-2',
+    metadata: {
+      namespace: 'fleet-default',
+      name:      'secret-2'
+    },
+    data: { foo3: 'bar3' }
+  }
+];
+
+describe('component: FleetValuesFrom', () => {
+  describe.each([
+    _CREATE,
+    _EDIT
+  ])('mode: %p', (mode) => {
+    it('should show loading label when secrets or configMaps are empty', async() => {
+      const wrapper = mount(FleetValuesFrom, {
+        ...requiredSetup(),
+        props: {
+          value:     [],
+          namespace: 'fleet-default',
+          mode,
+        },
+      });
+
+      await flushPromises();
+
+      const loading = wrapper.find('[data-testid="fleet-values-from-loading"]');
+      const itemsContainer = wrapper.find('[data-testid="fleet-values-from-list"]');
+
+      expect(itemsContainer.exists()).toBe(false);
+      expect(loading.exists()).toBe(true);
+    });
+
+    it('should decode spec.helm.valuesFrom to build UI form', async() => {
+      const wrapper = mount(FleetValuesFrom, {
+        ...requiredSetup(),
+        props: {
+          value: [
+            {
+              configMapKeyRef: {
+                key:       'foo0',
+                name:      'configmap-2',
+                namespace: 'fleet-default'
+              }
+            },
+            {
+              secretKeyRef: {
+                key:       'foo3',
+                name:      'secret-2',
+                namespace: 'fleet-default'
+              }
+            }
+          ],
+          namespace: 'fleet-default',
+          mode,
+        },
+        data: () => ({
+          allSecrets,
+          allConfigMaps
+        })
+      });
+
+      await flushPromises();
+
+      const configMapRef = wrapper.find('[data-testid="fleet-values-from-item-0"]').element;
+      const secretRef = wrapper.find('[data-testid="fleet-values-from-item-1"]').element;
+
+      expect(configMapRef.textContent).toContain('configMapKeyRef'); // Type column
+      expect(configMapRef.textContent).toContain('configmap-2'); // ConfigMap column
+      expect(configMapRef.textContent).toContain('foo0'); // Key column
+
+      expect(secretRef.textContent).toContain('secretKeyRef'); // Type column
+      expect(secretRef.textContent).toContain('secret-2'); // Secret column
+      expect(secretRef.textContent).toContain('foo3'); // Key column
+    });
+
+    it.each([
+      'fleet-default',
+      'fleet-local'
+    ])('should encode UI rows to spec.helm.valuesFrom having namespace %p', async(namespace) => {
+      const wrapper = mount(FleetValuesFrom, {
+        ...requiredSetup(),
+        props: {
+          value: [],
+          namespace,
+          mode,
+        },
+      });
+
+      wrapper.setData({
+        valuesFrom: [
+          {
+            id:        0,
+            valueFrom: {
+              configMapKeyRef: {
+                key:  'foo0',
+                name: 'configmap-2'
+              }
+            }
+          },
+          {
+            id:        1,
+            valueFrom: {
+              secretKeyRef: {
+                key:  'foo2',
+                name: 'secret-2'
+              }
+            }
+          }
+        ]
+      });
+
+      wrapper.vm.update();
+
+      await flushPromises();
+
+      expect(wrapper.emitted('update:value')?.[0][0]).toStrictEqual([{
+        configMapKeyRef: {
+          key: 'foo0', name: 'configmap-2', namespace,
+        }
+      }, {
+        secretKeyRef: {
+          key: 'foo2', name: 'secret-2', namespace,
+        }
+      }]);
+    });
+
+    it('should reset ConfigMap/Secret and Key columns on Type change', async() => {
+      const wrapper = mount(FleetValuesFrom, {
+        ...requiredSetup(),
+        props: {
+          value: [
+            {
+              configMapKeyRef: {
+                key:       'foo0',
+                name:      'configmap-2',
+                namespace: 'fleet-default'
+              }
+            },
+            {
+              secretKeyRef: {
+                key:       'foo3',
+                name:      'secret-2',
+                namespace: 'fleet-default'
+              }
+            }
+          ],
+          namespace: 'fleet-default',
+          mode,
+        },
+        data: () => ({
+          allSecrets,
+          allConfigMaps
+        })
+      });
+
+      await flushPromises();
+
+      // Change Type from ConfigMap Key to Secret Key
+      wrapper.vm.updateValueFrom(0, {
+        name:      'configmap-2',
+        valueFrom: {
+          secretKeyRef: {
+            key:      'foo0',
+            name:     'configmap-2',
+            optional: false
+          }
+        }
+      } as any);
+
+      await flushPromises();
+
+      const exConfigMapRef = wrapper.find('[data-testid="fleet-values-from-item-0"]').element;
+
+      // Type column is changed to Secret
+      expect(exConfigMapRef.textContent).toContain('secretKeyRef'); // Type column
+
+      // Config Map and Key fields are deleted from row 1
+      expect(exConfigMapRef.textContent).not.toContain('configmap-2'); // ConfigMap column
+      expect(exConfigMapRef.textContent).not.toContain('foo0'); // Key column
+
+      // excluding row 1 from emit
+      expect(wrapper.emitted('update:value')?.[0][0]).toStrictEqual([{
+        secretKeyRef: {
+          key: 'foo3', name: 'secret-2', namespace: 'fleet-default'
+        }
+      }]);
+    });
+
+    it('should reset Key column on Ref change', async() => {
+      const wrapper = mount(FleetValuesFrom, {
+        ...requiredSetup(),
+        props: {
+          value: [
+            {
+              configMapKeyRef: {
+                key:       'foo0',
+                name:      'configmap-2',
+                namespace: 'fleet-default'
+              }
+            },
+            {
+              secretKeyRef: {
+                key:       'foo3',
+                name:      'secret-2',
+                namespace: 'fleet-default'
+              }
+            }
+          ],
+          namespace: 'fleet-default',
+          mode,
+        },
+        data: () => ({
+          allSecrets,
+          allConfigMaps
+        })
+      });
+
+      await flushPromises();
+
+      // Change Config Map ref
+      wrapper.vm.updateValueFrom(0, {
+        name:      'configmap-3',
+        valueFrom: {
+          configMapKeyRef: {
+            key:      'foo4',
+            name:     'configmap-3',
+            optional: false
+          }
+        }
+      } as any);
+
+      await flushPromises();
+
+      const configMapRef = wrapper.find('[data-testid="fleet-values-from-item-0"]').element;
+
+      // Type column is not changed
+      expect(configMapRef.textContent).toContain('configMapKeyRef'); // Type column
+
+      // Config Map column is now configmap-3
+      expect(configMapRef.textContent).toContain('configmap-3'); // ConfigMap column
+
+      // Key column is empty
+      expect(configMapRef.textContent).toContain('workload.container.command.fromResource.key.label%Loading'); // Key column
+
+      // Emit empty Key
+      expect(wrapper.emitted('update:value')?.[0][0]).toStrictEqual([{
+        configMapKeyRef: {
+          key: '', name: 'configmap-3', namespace: 'fleet-default'
+        }
+      }, {
+        secretKeyRef: {
+          key: 'foo3', name: 'secret-2', namespace: 'fleet-default'
+        }
+      }]);
+    });
+  });
+});

package/components/fleet/dashboard/ResourceCard.vue

@@ -170,6 +170,7 @@ export default {
 <style lang="scss" scoped>
   .dashboard-resource-card {
     margin: 1px;
+    height: 100%;
   }
 
   .icon-lg {

package/components/fleet/dashboard/ResourceCardSummary.vue

@@ -89,7 +89,7 @@ export default {
       >
         <span
           v-clean-tooltip="value.stateDescription"
-          class="label wrap-text fixed-height"
+          class="label wrap-text"
           :class="{ 'text-error' : value.stateObj.error }"
         >
           {{ value.stateDescription }}
@@ -192,8 +192,4 @@ export default {
     -webkit-line-clamp: 5;
     -webkit-box-orient: vertical;
   }
-
-  .fixed-height {
-    height: 80px;
-  }
 </style>