@rancher/shell 3.0.12-rc.3 → 3.0.12-rc.4

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

@@ -1835,4 +1835,257 @@ describe('component: FleetClusterTargets', () => {
       expect(wrapper.vm.selectedClusterGroups).toStrictEqual([]);
     });
   });
+
+  describe('resolveClusterDisplayName', () => {
+    it.each([
+      ['c-m-abc123', 'my-production-cluster'],
+      ['c-m-def456', 'my-staging-cluster'],
+    ])('should return nameDisplay for metadata.name "%s"', (metadataName, expectedDisplay) => {
+      const mockClusters = [
+        {
+          metadata:    { namespace: 'fleet-default', name: 'c-m-abc123' },
+          nameDisplay: 'my-production-cluster'
+        },
+        {
+          metadata:    { namespace: 'fleet-default', name: 'c-m-def456' },
+          nameDisplay: 'my-staging-cluster'
+        }
+      ];
+
+      const wrapper = mount(FleetClusterTargets, {
+        ...requiredSetup(),
+        props: {
+          targets:   [],
+          namespace: 'fleet-default',
+          mode:      _EDIT
+        }
+      });
+
+      wrapper.setData({ allClusters: mockClusters });
+
+      expect(wrapper.vm.resolveClusterDisplayName(metadataName)).toStrictEqual(expectedDisplay);
+    });
+
+    it('should return the original name when no cluster matches', () => {
+      const mockClusters = [
+        {
+          metadata:    { namespace: 'fleet-default', name: 'c-m-abc123' },
+          nameDisplay: 'my-production-cluster'
+        }
+      ];
+
+      const wrapper = mount(FleetClusterTargets, {
+        ...requiredSetup(),
+        props: {
+          targets:   [],
+          namespace: 'fleet-default',
+          mode:      _EDIT
+        }
+      });
+
+      wrapper.setData({ allClusters: mockClusters });
+
+      expect(wrapper.vm.resolveClusterDisplayName('non-existent')).toStrictEqual('non-existent');
+    });
+
+    it('should not resolve cluster from a different namespace', () => {
+      const mockClusters = [
+        {
+          metadata:    { namespace: 'other-namespace', name: 'c-m-abc123' },
+          nameDisplay: 'my-production-cluster'
+        }
+      ];
+
+      const wrapper = mount(FleetClusterTargets, {
+        ...requiredSetup(),
+        props: {
+          targets:   [],
+          namespace: 'fleet-default',
+          mode:      _EDIT
+        }
+      });
+
+      wrapper.setData({ allClusters: mockClusters });
+
+      expect(wrapper.vm.resolveClusterDisplayName('c-m-abc123')).toStrictEqual('c-m-abc123');
+    });
+  });
+
+  describe('clustersOptions', () => {
+    it('should use nameDisplay for both label and value', () => {
+      const mockClusters = [
+        {
+          metadata:    { namespace: 'fleet-default', name: 'c-m-abc123' },
+          nameDisplay: 'my-production-cluster',
+          status:      { provider: 'rke2' }
+        },
+        {
+          metadata:    { namespace: 'fleet-default', name: 'c-m-def456' },
+          nameDisplay: 'my-staging-cluster',
+          status:      { provider: 'rke2' }
+        }
+      ];
+
+      const wrapper = mount(FleetClusterTargets, {
+        ...requiredSetup(),
+        props: {
+          targets:   [],
+          namespace: 'fleet-default',
+          mode:      _EDIT
+        }
+      });
+
+      wrapper.setData({ allClusters: mockClusters });
+
+      const options = wrapper.vm.clustersOptions;
+
+      expect(options).toStrictEqual([
+        {
+          label: 'my-production-cluster', value: 'my-production-cluster', disabled: false
+        },
+        {
+          label: 'my-staging-cluster', value: 'my-staging-cluster', disabled: false
+        }
+      ]);
+    });
+
+    it('should filter out clusters from other namespaces', () => {
+      const mockClusters = [
+        {
+          metadata:    { namespace: 'fleet-default', name: 'c-m-abc123' },
+          nameDisplay: 'my-cluster',
+          status:      { provider: 'rke2' }
+        },
+        {
+          metadata:    { namespace: 'other-namespace', name: 'c-m-other' },
+          nameDisplay: 'other-cluster',
+          status:      { provider: 'rke2' }
+        }
+      ];
+
+      const wrapper = mount(FleetClusterTargets, {
+        ...requiredSetup(),
+        props: {
+          targets:   [],
+          namespace: 'fleet-default',
+          mode:      _EDIT
+        }
+      });
+
+      wrapper.setData({ allClusters: mockClusters });
+
+      expect(wrapper.vm.clustersOptions).toStrictEqual([
+        {
+          label: 'my-cluster', value: 'my-cluster', disabled: false
+        }
+      ]);
+    });
+  });
+
+  describe('allClusters watcher', () => {
+    it('should resolve selectedClusters metadata.name values to nameDisplay when clusters load', async() => {
+      const mockClusters = [
+        {
+          metadata:    { namespace: 'fleet-default', name: 'c-m-abc123' },
+          nameDisplay: 'my-production-cluster'
+        },
+        {
+          metadata:    { namespace: 'fleet-default', name: 'c-m-def456' },
+          nameDisplay: 'my-staging-cluster'
+        }
+      ];
+
+      const targets = [
+        { clusterName: 'c-m-abc123' },
+        { clusterName: 'c-m-def456' }
+      ];
+
+      const wrapper = mount(FleetClusterTargets, {
+        ...requiredSetup(),
+        props: {
+          targets,
+          namespace: 'fleet-default',
+          mode:      _EDIT
+        }
+      });
+
+      expect(wrapper.vm.selectedClusters).toStrictEqual(['c-m-abc123', 'c-m-def456']);
+
+      wrapper.setData({ allClusters: mockClusters });
+      await flushPromises();
+
+      expect(wrapper.vm.selectedClusters).toStrictEqual(['my-production-cluster', 'my-staging-cluster']);
+    });
+
+    it('should keep names that already match nameDisplay unchanged', async() => {
+      const mockClusters = [
+        {
+          metadata:    { namespace: 'fleet-default', name: 'my-cluster' },
+          nameDisplay: 'my-cluster'
+        }
+      ];
+
+      const targets = [{ clusterName: 'my-cluster' }];
+
+      const wrapper = mount(FleetClusterTargets, {
+        ...requiredSetup(),
+        props: {
+          targets,
+          namespace: 'fleet-default',
+          mode:      _EDIT
+        }
+      });
+
+      wrapper.setData({ allClusters: mockClusters });
+      await flushPromises();
+
+      expect(wrapper.vm.selectedClusters).toStrictEqual(['my-cluster']);
+    });
+
+    it('should keep unresolvable names as-is', async() => {
+      const mockClusters = [
+        {
+          metadata:    { namespace: 'fleet-default', name: 'c-m-abc123' },
+          nameDisplay: 'known-cluster'
+        }
+      ];
+
+      const targets = [
+        { clusterName: 'c-m-abc123' },
+        { clusterName: 'unknown-name' }
+      ];
+
+      const wrapper = mount(FleetClusterTargets, {
+        ...requiredSetup(),
+        props: {
+          targets,
+          namespace: 'fleet-default',
+          mode:      _EDIT
+        }
+      });
+
+      wrapper.setData({ allClusters: mockClusters });
+      await flushPromises();
+
+      expect(wrapper.vm.selectedClusters).toStrictEqual(['known-cluster', 'unknown-name']);
+    });
+
+    it('should not resolve when clusters array is empty', async() => {
+      const targets = [{ clusterName: 'c-m-abc123' }];
+
+      const wrapper = mount(FleetClusterTargets, {
+        ...requiredSetup(),
+        props: {
+          targets,
+          namespace: 'fleet-default',
+          mode:      _EDIT
+        }
+      });
+
+      wrapper.setData({ allClusters: [] });
+      await flushPromises();
+
+      expect(wrapper.vm.selectedClusters).toStrictEqual(['c-m-abc123']);
+    });
+  });
 });

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

@@ -63,6 +63,22 @@ describe('component: FleetSecretSelector.vue', () => {
     ]);
   });
 
+  it('should accept lockedOptions prop', () => {
+    const lockedOptions = ['locked-secret-1', 'locked-secret-2'];
+    const wrapper = shallowMount(FleetSecretSelector, {
+      props: { ...props, lockedOptions },
+      global
+    });
+
+    expect((wrapper.vm as any).lockedOptions).toStrictEqual(lockedOptions);
+  });
+
+  it('should default lockedOptions to empty array', () => {
+    const wrapper = shallowMount(FleetSecretSelector, { props, global });
+
+    expect((wrapper.vm as any).lockedOptions).toStrictEqual([]);
+  });
+
   it('should return correct filter structure from paginatePageOptions', () => {
     const wrapper = shallowMount(FleetSecretSelector, { props, global });
 

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

@@ -50,6 +50,50 @@ const allSecrets = [
 ];
 
 describe('component: FleetValuesFrom', () => {
+  describe('compact prop', () => {
+    it('should render h2 heading when compact is false', async() => {
+      const wrapper = mount(FleetValuesFrom, {
+        ...requiredSetup(),
+        props: {
+          value:     [],
+          namespace: 'fleet-default',
+          mode:      _CREATE,
+          compact:   false,
+        },
+        data: () => ({ allSecrets, allConfigMaps })
+      });
+
+      await flushPromises();
+
+      const h2 = wrapper.find('[data-testid="fleet-values-from-list"] h2');
+      const h4 = wrapper.find('[data-testid="fleet-values-from-list"] h4');
+
+      expect(h2.exists()).toBe(true);
+      expect(h4.exists()).toBe(false);
+    });
+
+    it('should render h4 heading when compact is true', async() => {
+      const wrapper = mount(FleetValuesFrom, {
+        ...requiredSetup(),
+        props: {
+          value:     [],
+          namespace: 'fleet-default',
+          mode:      _CREATE,
+          compact:   true,
+        },
+        data: () => ({ allSecrets, allConfigMaps })
+      });
+
+      await flushPromises();
+
+      const h4 = wrapper.find('[data-testid="fleet-values-from-list"] h4');
+      const h2 = wrapper.find('[data-testid="fleet-values-from-list"] h2');
+
+      expect(h4.exists()).toBe(true);
+      expect(h2.exists()).toBe(false);
+    });
+  });
+
   describe.each([
     _CREATE,
     _EDIT

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

@@ -0,0 +1,59 @@
+import { shallowMount } from '@vue/test-utils';
+import HelmOpAppCoConfigTab from '@shell/components/fleet/HelmOpAppCoConfigTab.vue';
+import HelmOpAppCoResourcesSection from '@shell/components/fleet/HelmOpAppCoResourcesSection.vue';
+import { _EDIT } from '@shell/config/query-params';
+
+describe('component: HelmOpAppCoConfigTab', () => {
+  const defaultProps = {
+    value: {
+      metadata: { namespace: 'fleet-default' },
+      spec:     { helm: { valuesFrom: [] } },
+    },
+    mode:               _EDIT,
+    realMode:           _EDIT,
+    registerBeforeHook: jest.fn(),
+  };
+
+  const mountWithSecrets = (downstreamSecretsList: string[]) => {
+    return shallowMount(HelmOpAppCoConfigTab, {
+      props: {
+        ...defaultProps,
+        downstreamSecretsList,
+      },
+      global: {
+        stubs: {
+          RcSection: { template: '<div><slot /></div>' },
+          RcIcon:    true,
+          Tab:       { template: '<div><slot /></div>' },
+          Tabbed:    { template: '<div><slot /></div>' },
+        }
+      }
+    });
+  };
+
+  describe('appCoLockedSecrets', () => {
+    it('should only lock image pull secrets, not auth secrets', () => {
+      const wrapper = mountWithSecrets([
+        'fleet-appco-auth-2n9px-image-pull-secret',
+        'fleet-appco-auth-2n9px',
+      ]);
+
+      const resourcesSection = wrapper.findComponent(HelmOpAppCoResourcesSection);
+
+      expect(resourcesSection.props('lockedSecrets')).toStrictEqual([
+        'fleet-appco-auth-2n9px-image-pull-secret',
+      ]);
+    });
+
+    it('should return empty array when no image pull secrets exist', () => {
+      const wrapper = mountWithSecrets([
+        'fleet-appco-auth-abc123',
+        'some-other-secret',
+      ]);
+
+      const resourcesSection = wrapper.findComponent(HelmOpAppCoResourcesSection);
+
+      expect(resourcesSection.props('lockedSecrets')).toStrictEqual([]);
+    });
+  });
+});

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

@@ -0,0 +1,62 @@
+import { shallowMount } from '@vue/test-utils';
+import HelmOpAppCoResourcesSection from '@shell/components/fleet/HelmOpAppCoResourcesSection.vue';
+import FleetSecretSelector from '@shell/components/fleet/FleetSecretSelector.vue';
+import { _EDIT } from '@shell/config/query-params';
+
+describe('component: HelmOpAppCoResourcesSection', () => {
+  const props = {
+    value:                    { metadata: { namespace: 'fleet-default' }, spec: { keepResources: false } },
+    mode:                     _EDIT,
+    correctDriftEnabled:      false,
+    downstreamSecretsList:    ['secret-1'],
+    downstreamConfigMapsList: ['cm-1'],
+  };
+
+  const shallowMountWithSlots = (overrides = {}) => {
+    return shallowMount(HelmOpAppCoResourcesSection, {
+      props:  { ...props, ...overrides },
+      global: {
+        stubs: {
+          RcSection: { template: '<div><slot /></div>' },
+          RcIcon:    true,
+        }
+      }
+    });
+  };
+
+  it('should render the section container', () => {
+    const wrapper = shallowMountWithSlots();
+
+    expect(wrapper.find('[data-testid="helmop-appco-resources-section"]').exists()).toBe(true);
+  });
+
+  it('should show locked secret banner when lockedSecrets is non-empty', () => {
+    const wrapper = shallowMountWithSlots({ lockedSecrets: ['locked-1'] });
+
+    expect(wrapper.find('[data-testid="helmop-appco-resources-locked-secret-banner"]').exists()).toBe(true);
+  });
+
+  it('should not show locked secret banner when lockedSecrets is empty', () => {
+    const wrapper = shallowMountWithSlots({ lockedSecrets: [] });
+
+    expect(wrapper.find('[data-testid="helmop-appco-resources-locked-secret-banner"]').exists()).toBe(false);
+  });
+
+  it('should pass lockedSecrets to FleetSecretSelector as locked-options', () => {
+    const lockedSecrets = ['locked-a', 'locked-b'];
+    const wrapper = shallowMountWithSlots({ lockedSecrets });
+
+    const selector = wrapper.findComponent(FleetSecretSelector);
+
+    expect(selector.props('lockedOptions')).toStrictEqual(lockedSecrets);
+  });
+
+  it('should emit update:correct-drift', () => {
+    const wrapper = shallowMountWithSlots();
+    const checkbox = wrapper.findComponent({ name: 'Checkbox' });
+
+    checkbox.vm.$emit('update:value', true);
+
+    expect(wrapper.emitted('update:correct-drift')?.[0]).toStrictEqual([true]);
+  });
+});

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

@@ -0,0 +1,43 @@
+import { shallowMount } from '@vue/test-utils';
+import HelmOpResourcesSection from '@shell/components/fleet/HelmOpResourcesSection.vue';
+import { _EDIT } from '@shell/config/query-params';
+
+describe('component: HelmOpResourcesSection', () => {
+  const props = {
+    value:                    { metadata: { namespace: 'fleet-default' }, spec: { keepResources: false } },
+    mode:                     _EDIT,
+    correctDriftEnabled:      false,
+    downstreamSecretsList:    ['secret-1'],
+    downstreamConfigMapsList: ['cm-1'],
+  };
+
+  it('should render the section container', () => {
+    const wrapper = shallowMount(HelmOpResourcesSection, { props });
+
+    expect(wrapper.find('[data-testid="helmop-resources-section"]').exists()).toBe(true);
+  });
+
+  it('should emit update:correct-drift when checkbox changes', () => {
+    const wrapper = shallowMount(HelmOpResourcesSection, { props });
+
+    wrapper.findComponent({ name: 'Checkbox' }).vm.$emit('update:value', true);
+
+    expect(wrapper.emitted('update:correct-drift')?.[0]).toStrictEqual([true]);
+  });
+
+  it('should emit update:downstream-resources when FleetSecretSelector emits', () => {
+    const wrapper = shallowMount(HelmOpResourcesSection, { props });
+
+    wrapper.findComponent({ name: 'FleetSecretSelector' }).vm.$emit('update:value', ['s1', 's2']);
+
+    expect(wrapper.emitted('update:downstream-resources')?.[0]).toStrictEqual([{ kind: 'Secret', list: ['s1', 's2'] }]);
+  });
+
+  it('should emit update:downstream-resources for ConfigMap', () => {
+    const wrapper = shallowMount(HelmOpResourcesSection, { props });
+
+    wrapper.findComponent({ name: 'FleetConfigMapSelector' }).vm.$emit('update:value', ['cm-a']);
+
+    expect(wrapper.emitted('update:downstream-resources')?.[0]).toStrictEqual([{ kind: 'ConfigMap', list: ['cm-a'] }]);
+  });
+});

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

@@ -0,0 +1,34 @@
+import { shallowMount } from '@vue/test-utils';
+import HelmOpTargetOptionsSection from '@shell/components/fleet/HelmOpTargetOptionsSection.vue';
+import { _EDIT } from '@shell/config/query-params';
+
+describe('component: HelmOpTargetOptionsSection', () => {
+  const props = {
+    value: { spec: { serviceAccount: 'sa-1', namespace: 'ns-1' } },
+    mode:  _EDIT,
+  };
+
+  it('should match snapshot with default props', () => {
+    const wrapper = shallowMount(HelmOpTargetOptionsSection, { props });
+
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('should match snapshot in compact mode', () => {
+    const wrapper = shallowMount(HelmOpTargetOptionsSection, { props: { ...props, compact: true } });
+
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('should show description text when compact is true', () => {
+    const wrapper = shallowMount(HelmOpTargetOptionsSection, { props: { ...props, compact: true } });
+
+    expect(wrapper.find('p').exists()).toBe(true);
+  });
+
+  it('should not show description text when compact is false', () => {
+    const wrapper = shallowMount(HelmOpTargetOptionsSection, { props: { ...props, compact: false } });
+
+    expect(wrapper.find('p').exists()).toBe(false);
+  });
+});

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

@@ -0,0 +1,39 @@
+import { shallowMount } from '@vue/test-utils';
+import HelmOpValuesTab from '@shell/components/fleet/HelmOpValuesTab.vue';
+import { _EDIT } from '@shell/config/query-params';
+
+describe('component: HelmOpValuesTab', () => {
+  const defaultProps = {
+    value: {
+      metadata: { namespace: 'fleet-default' },
+      spec:     { helm: { valuesFrom: [] } },
+    },
+    mode:                _EDIT,
+    realMode:            _EDIT,
+    chartValues:         '',
+    chartValuesInit:     '',
+    yamlForm:            'yaml',
+    yamlFormOptions:     [],
+    yamlDiffModeOptions: [],
+    isYamlDiff:          false,
+    editorMode:          'edit',
+    diffMode:            'diff',
+    isRealModeEdit:      true,
+  };
+
+  it('should update value.spec.helm.valuesFrom when FleetValuesFrom emits update:value', () => {
+    const wrapper = shallowMount(HelmOpValuesTab, { props: defaultProps });
+
+    const newValuesFrom = [
+      {
+        configMapKeyRef: {
+          key: 'foo', name: 'cm-1', namespace: 'fleet-default'
+        }
+      },
+    ];
+
+    wrapper.findComponent({ name: 'FleetValuesFrom' }).vm.$emit('update:value', newValuesFrom);
+
+    expect(defaultProps.value.spec.helm.valuesFrom).toStrictEqual(newValuesFrom);
+  });
+});

package/components/fleet/__tests__/__snapshots__/AppCoEmptyState.test.ts.snap

@@ -0,0 +1,97 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`component: AppCoEmptyState should match snapshot with error badge state 1`] = `
+<div
+  class="appco-transitioning-error-state"
+>
+  <h2
+    class="appco-empty-state-title m-0"
+  >
+    Error
+  </h2>
+  <div
+    class="appco-empty-state-body has-badge direction-column"
+  >
+    <div
+      class="appco-badge-container"
+      role="status"
+    >
+      <rc-icon-stub
+        ariahidden="true"
+        size="large"
+        status="error"
+        type="alert-alt"
+      />
+      <anonymous-stub
+        color="bg-error"
+        label="Failed"
+      />
+    </div>
+    <p>
+      
+      Something went wrong
+      
+    </p>
+  </div>
+</div>
+`;
+
+exports[`component: AppCoEmptyState should match snapshot with no badge state 1`] = `
+<div
+  class="appco-empty-state"
+>
+  <h1
+    class="appco-empty-state-title m-0"
+  >
+    No charts found
+  </h1>
+  <div
+    class="appco-empty-state-body"
+  >
+    <!--v-if-->
+    <p>
+      
+      Try a different search
+      
+    </p>
+  </div>
+</div>
+`;
+
+exports[`component: AppCoEmptyState should match snapshot with transitioning badge state 1`] = `
+<div
+  class="appco-transitioning-error-state"
+>
+  <h2
+    class="appco-empty-state-title m-0"
+  >
+    Loading charts
+  </h2>
+  <div
+    class="appco-empty-state-body has-badge"
+  >
+    <div
+      aria-live="polite"
+      class="appco-badge-container"
+      role="status"
+    >
+      <rc-icon-stub
+        ariahidden="true"
+        class="icon-spin"
+        size="large"
+        status="inherit"
+        type="spinner"
+      />
+      <anonymous-stub
+        color="bg-info"
+        label="In Progress"
+      />
+    </div>
+    <p>
+      
+      Please wait...
+      
+    </p>
+  </div>
+</div>
+`;