dashboard-shell-shell 3.0.2-test.20250913 → 3.0.5-test.2

package/components/__tests__/ConfigMapSettings.test.ts

@@ -0,0 +1,376 @@
+
+import { mount } from '@vue/test-utils';
+import ConfigMapSettings, { Setting } from '@shell/components/ConfigMapSettings/index.vue';
+import { _EDIT } from '@shell/config/query-params';
+import { CONFIG_MAP } from '@shell/config/types';
+import jsyaml from 'js-yaml';
+
+const mockedStore = () => {
+  return {
+    getters: {
+      'cluster/schemaFor':    jest.fn(),
+      'management/schemaFor': jest.fn(),
+      'i18n/t':               (text: string, v = {}) => {
+        return `${ text }${ Object.values(v) }`;
+      },
+    },
+  };
+};
+
+const mockedRoute = { query: {} };
+
+const requiredSetup = () => {
+  return {
+    global: {
+      mocks: {
+        $store:      mockedStore(),
+        $route:      mockedRoute,
+        $fetchState: {},
+      },
+      stubs: { AsyncButton: true }
+    }
+  };
+};
+
+const settings = {
+  garbageCollectionInterval: {
+    weight:  0,
+    type:    'string',
+    path:    'garbageCollectionInterval',
+    default: '15m',
+  },
+  garbageCollectionIntervalNumber: {
+    weight:  0,
+    type:    'number',
+    handler: 'UnitInput',
+    path:    'garbageCollectionIntervalNumber',
+    default: '15m',
+  },
+  gitClientTimeout: {
+    weight:  1,
+    type:    'string',
+    path:    'gitClientTimeout',
+    default: '30s',
+  },
+  gitClientTimeoutNumber: {
+    weight:  1,
+    type:    'number',
+    handler: 'UnitInput',
+    path:    'gitClientTimeoutNumber',
+    default: '30s',
+  },
+  gitjobReplicas: {
+    weight:  1,
+    type:    'number',
+    path:    'gitjob.replicas',
+    default: 1,
+  },
+  multiSelect: {
+    weight:  4,
+    type:    'array',
+    path:    'multiSelect',
+    default: 'foo',
+    items:   [{
+      type:  'string',
+      value: 'foo'
+    }, {
+      type:  'string',
+      value: 'bar'
+    }],
+  },
+  singleSelect: {
+    weight: 1,
+    type:   'string',
+    items:  [{
+      type:  'string',
+      value: 'strict'
+    }, {
+      type:  'string',
+      value: 'system-store'
+    }],
+    path:    'agentTLSMode',
+    default: 'system-store',
+  },
+  nodeSelector: {
+    weight:  1,
+    type:    'object',
+    handler: 'Textarea',
+    path:    'nodeSelector',
+    default: {},
+  },
+  nodeSelectorKeyValue: {
+    weight:  1,
+    type:    'object',
+    handler: 'KeyValue',
+    path:    'nodeSelectorKeyValue',
+    default: { foo: 'val' },
+  },
+  debug: {
+    weight:  1,
+    type:    'boolean',
+    path:    'debug',
+    default: false,
+  },
+  tolerationsTaints: {
+    weight:  2,
+    type:    'object',
+    handler: 'Taints',
+    path:    'tolerationsTaints',
+    default: [{
+      key:    'foo1',
+      value:  'bar1',
+      effect: 'PreferNoSchedule'
+    }],
+  },
+} as Record<string, Setting>;
+
+const groups = [{
+  name:     'general',
+  children: [
+    'garbageCollectionInterval',
+    'gitClientTimeout'
+  ],
+  expanded: true,
+  weight:   0
+}];
+
+const configMap = {
+  type:     CONFIG_MAP,
+  metadata: {
+    namespace: 'ns',
+    name:      'name'
+  },
+  data: {
+    fleet: jsyaml.dump({
+      foo:                             'bar',
+      garbageCollectionInterval:       '1h',
+      gitjob:                          { replicas: 5 },
+      debug:                           true,
+      nodeSelector:                    { key: 'value1' },
+      garbageCollectionIntervalNumber: '14m',
+      gitClientTimeoutNumber:          '3m',
+      nodeSelectorKeyValue:            { foo: 'bar' },
+      tolerationsTaints:               [{
+        key:    'foo',
+        value:  'bar',
+        effect: 'PreferNoSchedule'
+      }]
+    }),
+    foo: { bar: 'value' }
+  },
+  save: () => {},
+};
+
+describe('component: ConfigMapSettings', () => {
+  it('should init values from settings descriptor default values, having ConfigMap === null', async() => {
+    const wrapper = mount(ConfigMapSettings, {
+      ...requiredSetup(),
+      props: {
+        settings,
+        groups,
+        name:      'cm-name',
+        namespace: 'cm-namespace',
+        dataKey:   'fleet'
+      },
+      computed: {
+        mode:       () => _EDIT,
+        canEdit:    () => true,
+        fetchState: () => ({ $fetchState: false }),
+      },
+    });
+
+    wrapper.vm.initValues();
+
+    await wrapper.vm.$nextTick();
+
+    const generalGroup = wrapper.find('[data-testid="cm-settings-group-body-general"]');
+
+    const garbageCollectionInterval = wrapper.find('[data-testid="cm-settings-field-string-garbageCollectionInterval"]').element as HTMLInputElement;
+    const garbageCollectionIntervalNumber = wrapper.find('[data-testid="cm-settings-field-number-UnitInput-garbageCollectionIntervalNumber"]').element as HTMLInputElement;
+    const gitClientTimeout = wrapper.find('[data-testid="cm-settings-field-string-gitClientTimeout"]').element as HTMLInputElement;
+    const gitClientTimeoutNumber = wrapper.find('[data-testid="cm-settings-field-number-UnitInput-gitClientTimeoutNumber"]').element as HTMLInputElement;
+    const gitjobReplicas = wrapper.find('[data-testid="cm-settings-field-number-gitjobReplicas"]').element as HTMLInputElement;
+    const multiSelect = wrapper.find('[data-testid="cm-settings-field-array-multiSelect"]').element as HTMLInputElement;
+    const nodeSelector = wrapper.find('[data-testid="cm-settings-field-object-Textarea-nodeSelector"]').element as HTMLInputElement;
+    const nodeSelectorKeyValue = wrapper.find('[data-testid="cm-settings-field-object-KeyValue-nodeSelectorKeyValue"]').find('[data-testid="input-kv-item-key-0"]').element as HTMLInputElement;
+    const tolerationsTaints = wrapper.find('[data-testid="cm-settings-field-object-Taints-tolerationsTaints"]').find('[data-testid="input-kv-item-key-0"]').element as HTMLInputElement;
+    const singleSelect = wrapper.find('[data-testid="cm-settings-field-string-singleSelect"]').element as HTMLInputElement;
+    const debug = wrapper.find('[data-testid="cm-settings-field-boolean-debug"]').find('input[type="checkbox"]').element as HTMLInputElement;
+
+    expect(generalGroup.exists()).toBe(true);
+    expect(garbageCollectionInterval.value).toBe('15m');
+    expect(garbageCollectionIntervalNumber.value).toBe('900');
+    expect(gitClientTimeout.value).toBe('30s');
+    expect(gitClientTimeoutNumber.value).toBe('30');
+    expect(multiSelect.textContent).toContain('foo');
+    expect(singleSelect.textContent).toContain('system-store');
+    expect(nodeSelector.value).toBe('{}');
+    expect(nodeSelectorKeyValue.value).toBe('foo');
+    expect(tolerationsTaints.value).toBe('foo1');
+    expect(gitjobReplicas.value).toBe('1');
+    expect(debug.checked).toBe(false);
+  });
+
+  it('should display error when parsing malformed values', async() => {
+    const wrapper = mount(ConfigMapSettings, {
+      ...requiredSetup(),
+      props: {
+        settings,
+        groups,
+        name:      'cm-name',
+        namespace: 'cm-namespace',
+        dataKey:   'fleet'
+      },
+      computed: {
+        mode:       () => _EDIT,
+        canEdit:    () => true,
+        fetchState: () => ({ $fetchState: false }),
+      },
+    });
+
+    wrapper.setData({
+      configMap: {
+        type:     CONFIG_MAP,
+        metadata: {
+          namespace: 'ns',
+          name:      'name'
+        },
+        data: {
+          fleet: { foo: 'bar' },
+          foo:   { bar: 'value' }
+        }
+      }
+    });
+
+    wrapper.vm.initValues();
+
+    await wrapper.vm.$nextTick();
+
+    const error = wrapper.find('[data-testid="cm-settings-error"]');
+
+    expect(error.text()).toContain('parseError');
+  });
+
+  it('should merge settings descriptor default values with ConfigMap values', async() => {
+    const wrapper = mount(ConfigMapSettings, {
+      ...requiredSetup(),
+      props: {
+        settings,
+        groups,
+        name:      'cm-name',
+        namespace: 'cm-namespace',
+        dataKey:   'fleet'
+      },
+      computed: {
+        mode:       () => _EDIT,
+        canEdit:    () => true,
+        fetchState: () => ({ $fetchState: false }),
+      },
+    });
+
+    wrapper.setData({ configMap });
+
+    wrapper.vm.initValues();
+
+    await wrapper.vm.$nextTick();
+
+    const garbageCollectionInterval = wrapper.find('[data-testid="cm-settings-field-string-garbageCollectionInterval"]').element as HTMLInputElement;
+    const gitClientTimeout = wrapper.find('[data-testid="cm-settings-field-string-gitClientTimeout"]').element as HTMLInputElement;
+    const gitjobReplicas = wrapper.find('[data-testid="cm-settings-field-number-gitjobReplicas"]').element as HTMLInputElement;
+    const multiSelect = wrapper.find('[data-testid="cm-settings-field-array-multiSelect"]').element as HTMLInputElement;
+    const nodeSelector = wrapper.find('[data-testid="cm-settings-field-object-Textarea-nodeSelector"]').element as HTMLInputElement;
+    const singleSelect = wrapper.find('[data-testid="cm-settings-field-string-singleSelect"]').element as HTMLInputElement;
+    const debug = wrapper.find('[data-testid="cm-settings-field-boolean-debug"]').find('input[type="checkbox"]').element as HTMLInputElement;
+    const garbageCollectionIntervalNumber = wrapper.find('[data-testid="cm-settings-field-number-UnitInput-garbageCollectionIntervalNumber"]').element as HTMLInputElement;
+    const gitClientTimeoutNumber = wrapper.find('[data-testid="cm-settings-field-number-UnitInput-gitClientTimeoutNumber"]').element as HTMLInputElement;
+    const nodeSelectorKeyValue = wrapper.find('[data-testid="cm-settings-field-object-KeyValue-nodeSelectorKeyValue"]').find('[data-testid="input-kv-item-key-0"]').element as HTMLInputElement;
+    const tolerationsTaints = wrapper.find('[data-testid="cm-settings-field-object-Taints-tolerationsTaints"]').find('[data-testid="input-kv-item-key-0"]').element as HTMLInputElement;
+
+    expect(garbageCollectionInterval.value).toBe('1h');
+    expect(gitClientTimeout.value).toBe('30s');
+    expect(multiSelect.textContent).toContain('foo');
+    expect(singleSelect.textContent).toContain('system-store');
+    expect(nodeSelector.value).toBe('{\"key\":\"value1\"}');
+    expect(gitjobReplicas.value).toBe('5');
+    expect(debug.checked).toBe(true);
+    expect(garbageCollectionIntervalNumber.value).toBe('840');
+    expect(gitClientTimeoutNumber.value).toBe('180');
+    expect(nodeSelectorKeyValue.value).toBe('foo');
+    expect(tolerationsTaints.value).toBe('foo');
+  });
+
+  it('should save ConfigMap values preserving extraneous values', async() => {
+    const wrapper = mount(ConfigMapSettings, {
+      ...requiredSetup(),
+      props: {
+        settings,
+        groups,
+        name:      'cm-name',
+        namespace: 'cm-namespace',
+        dataKey:   'fleet'
+      },
+      computed: {
+        mode:       () => _EDIT,
+        canEdit:    () => true,
+        fetchState: () => ({ $fetchState: false }),
+      },
+    });
+
+    wrapper.setData({ configMap });
+
+    wrapper.vm.initValues();
+
+    await wrapper.vm.$nextTick();
+
+    await wrapper.vm.save(() => {});
+
+    const cm = wrapper.vm.configMap as any;
+
+    expect(cm.data).toStrictEqual({
+      fleet: 'foo: bar\ngarbageCollectionInterval: 1h\ngitjob:\n  replicas: 5\ndebug: true\nnodeSelector:\n  key: value1\ngarbageCollectionIntervalNumber: 840s\ngitClientTimeoutNumber: 180s\nnodeSelectorKeyValue:\n  foo: bar\ntolerationsTaints:\n  - key: foo\n    value: bar\n    effect: PreferNoSchedule\ngitClientTimeout: 30s\nmultiSelect: foo\nagentTLSMode: system-store\n',
+      foo:   { bar: 'value' },
+    });
+  });
+
+  it('should show groups titles and hide body if group is collapsed', async() => {
+    const wrapper = mount(ConfigMapSettings, {
+      ...requiredSetup(),
+      props: {
+        settings,
+        groups: [{
+          name:     'general',
+          children: [
+            'garbageCollectionInterval',
+            'gitClientTimeout'
+          ],
+          expanded: false,
+          weight:   0
+        }],
+        name:      'cm-name',
+        namespace: 'cm-namespace',
+        dataKey:   'fleet'
+      },
+      computed: {
+        mode:       () => _EDIT,
+        canEdit:    () => true,
+        fetchState: () => ({ $fetchState: false }),
+      },
+    });
+
+    wrapper.vm.initValues();
+
+    await wrapper.vm.$nextTick();
+
+    const generalGroupRow = wrapper.find('[data-testid="cm-settings-row-general"]');
+    const generalGroupBody = wrapper.find('[data-testid="cm-settings-group-body-general"]');
+
+    const garbageCollectionInterval = wrapper.find('[data-testid="cm-settings-field-string-garbageCollectionInterval"]');
+    const gitClientTimeout = wrapper.find('[data-testid="cm-settings-field-string-gitClientTimeout"]');
+
+    expect(generalGroupRow.exists()).toBe(true);
+    expect(generalGroupBody.exists()).toBe(false);
+
+    expect(garbageCollectionInterval.exists()).toBe(false);
+    expect(gitClientTimeout.exists()).toBe(false);
+  });
+});

package/components/__tests__/CruResource.test.ts

@@ -68,6 +68,69 @@ describe('component: CruResource', () => {
     expect(node.text()).toContain(errors[1]);
   });
 
+  it.each([
+    ['error', 'error'],
+    [{
+      code: 'ActionNotAvailable', status: 500, message: 'error'
+    }, 'errors.actionNotAvailable'],
+    [{
+      status: 422, fieldName: 'Name', code: 'NotUnique', message: 'error'
+    }, 'errors.failedInApi.withName.withCodeExplanation.withMessageDetail'],
+    [{
+      status: 422, fieldName: 'Name', code: 'NotUnique'
+    }, 'errors.failedInApi.withName.withCodeExplanation.withoutMessageDetail'],
+    [{
+      status: 422, fieldName: 'Name', code: 'Brr', message: 'error'
+    }, 'errors.failedInApi.withName.withMessageDetail'],
+    [{
+      status: 422, fieldName: 'Name', code: 'Brr'
+    }, 'errors.failedInApi.withName.withoutAnythingElse'],
+    [{
+      status: 422, code: 'NotUnique', message: 'error'
+    }, 'errors.failedInApi.withoutName.withMessageDetail.withCodeExplanation'],
+    [{ status: 422, message: 'error' }, 'errors.failedInApi.withoutName.withMessageDetail.withoutCodeExplanation'],
+    [{ status: 422, code: 'NotUnique' }, 'errors.failedInApi.withoutName.withCode.withCodeExplanation'],
+    [{ status: 422, code: 'Brr' }, 'errors.failedInApi.withoutName.withCode.withoutCodeExplanation'],
+    [{ status: 422 }, 'errors.failedInApi.withoutAnything'],
+    [{ status: 404, message: 'message' }, 'errors.notFound.withoutUrl'],
+    [{
+      status: 404, message: 'message', opt: { url: 'test' }
+    }, 'errors.notFound.withUrl'],
+    [{ status: 500, message: 'message' }, 'errors.messageOrDetail'],
+    [{
+      status: 500, message: 'message', detail: 'detail'
+    }, 'errors.messageAndDetail'],
+    [{ status: 500, detail: 'detail' }, 'errors.messageOrDetail'],
+  ])('should display correct error', (err, res) => {
+    const wrapper = mount(CruResource, {
+      props: {
+        canYaml:  false,
+        mode:     _EDIT,
+        resource: {},
+        errors:   [err]
+      },
+      global: {
+        mocks: {
+          $store: {
+            getters: {
+              currentStore:              () => 'current_store',
+              'current_store/schemaFor': jest.fn(),
+              'current_store/all':       jest.fn(),
+              'i18n/t':                  (text: string) => text,
+              'i18n/exists':             jest.fn(),
+            },
+            dispatch: jest.fn(),
+          },
+          $route:  { query: { AS: _YAML } },
+          $router: { applyQuery: jest.fn() },
+        },
+      }
+    });
+    const node = wrapper.find('#cru-errors');
+
+    expect(node.text()).toContain(res);
+  });
+
   it('should prevent default events on keypress Enter', async() => {
     const event = { preventDefault: jest.fn() };
     const wrapper = mount(CruResource, {

package/components/__tests__/FilterPanel.test.ts

@@ -0,0 +1,81 @@
+import { mount } from '@vue/test-utils';
+import FilterPanel from '@shell/components/FilterPanel.vue';
+import Checkbox from '@components/Form/Checkbox/Checkbox.vue';
+
+const filters = [
+  {
+    key:     'status',
+    title:   'Status',
+    options: [
+      { label: 'Installed', value: 'installed' },
+      { label: 'Deprecated', value: 'deprecated' }
+    ]
+  },
+  {
+    key:     'repos',
+    title:   'Repository',
+    options: [
+      { label: 'Repo A', value: 'repo-a' },
+      { label: 'Repo B', value: 'repo-b' }
+    ]
+  }
+];
+
+describe('component: FilterPanel', () => {
+  it('renders all filter groups and options with correct labels', () => {
+    const wrapper = mount(FilterPanel, {
+      props: {
+        modelValue: {},
+        filters
+      }
+    });
+
+    expect(wrapper.findAll('.filter-panel-filter-group-title')).toHaveLength(2);
+    expect(wrapper.text()).toContain('Status');
+    expect(wrapper.text()).toContain('Repository');
+    expect(wrapper.text()).toContain('Installed');
+    expect(wrapper.text()).toContain('Repo A');
+    expect(wrapper.text()).toContain('Repo B');
+  });
+
+  it('emits update:modelValue when a new status is added via checkbox emit', async() => {
+    const wrapper = mount(FilterPanel, {
+      props: {
+        modelValue: { status: ['installed'] },
+        filters
+      }
+    });
+
+    const checkboxes = wrapper.findAllComponents(Checkbox);
+    const deprecatedCheckbox = checkboxes.find((c) => c.props('label') === 'Deprecated');
+
+    expect(deprecatedCheckbox).toBeTruthy();
+
+    deprecatedCheckbox?.vm.$emit('update:value', ['installed', 'deprecated']);
+    await wrapper.vm.$nextTick();
+
+    const emitted = wrapper.emitted('update:modelValue');
+
+    expect(emitted).toBeTruthy();
+    expect(emitted?.[0][0].status).toStrictEqual(['installed', 'deprecated']);
+  });
+
+  it('renders a custom component if provided in option', () => {
+    const CustomComponent = { template: '<div>Custom content</div>' };
+
+    const wrapper = mount(FilterPanel, {
+      props: {
+        modelValue: {},
+        filters:    [
+          {
+            key:     'custom',
+            title:   'Custom Filters',
+            options: [{ component: CustomComponent }]
+          }
+        ]
+      }
+    });
+
+    expect(wrapper.text()).toContain('Custom content');
+  });
+});

package/components/__tests__/GrowlManager.test.ts

@@ -43,7 +43,6 @@ describe('component: GrowlManager', () => {
     const growlFirstItemTitle = wrapper.find('.growl-list [data-testid="growl-list-item-0"] .growl-text div');
     const growlFirstItemMessage = wrapper.find('.growl-list [data-testid="growl-list-item-0"] .growl-text p');
     const growlFirstItemClose = wrapper.find('.growl-list [data-testid="growl-list-item-0"] .close.icon');
-    const clearAllButton = wrapper.find('button[type="button"]');
 
     expect(growlMainContainer.exists()).toBe(true);
     expect(growlListContainer.exists()).toBe(true);
@@ -52,7 +51,6 @@ describe('component: GrowlManager', () => {
     expect(growlFirstItemTitle.text()).toBe('growl1-title');
     expect(growlFirstItemMessage.text()).toBe('growl1-message');
     expect(growlFirstItemClose.exists()).toBe(true);
-    expect(clearAllButton.exists()).toBe(true);
   });
 
   it('clicking on individual growl close should dismiss the individual growl', async() => {
@@ -79,29 +77,6 @@ describe('component: GrowlManager', () => {
     expect(spyDispatch).toHaveBeenCalledTimes(1);
   });
 
-  it('clicking on clear all growls should dismiss all growls', async() => {
-    const mockStore = {
-      getters:  { 'i18n/t': jest.fn() },
-      dispatch: () => jest.fn()
-    };
-
-    const wrapper = shallowMount(GrowlManager, {
-      computed: { stack: () => stackMock },
-      global:   { mocks: { $store: mockStore } }
-    });
-
-    const clearAllButton = wrapper.find('button[type="button"]');
-    const spyCloseAll = jest.spyOn(wrapper.vm, 'closeAll');
-    const spyDispatch = jest.spyOn(mockStore, 'dispatch');
-
-    clearAllButton.trigger('click');
-
-    await nextTick();
-
-    expect(spyCloseAll).toHaveBeenCalledTimes(1);
-    expect(spyDispatch).toHaveBeenCalledTimes(1);
-  });
-
   it('growl should auto remove itself after set interval of 1 second', async() => {
     jest.useFakeTimers();