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

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__/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();
 

package/components/auth/login/ldap.vue

@@ -69,7 +69,7 @@ export default {
             v-model:value="password"
             type="password"
             :label="t('login.password')"
-            autocomplete="password"
+            autocomplete="current-password"
           />
         </div>
       </div>

package/components/fleet/FleetApplications.vue

@@ -143,12 +143,6 @@ export default {
       ];
     },
   },
-
-  methods: {
-    getDetailLocation(row: Application) {
-      return row._detailLocation;
-    }
-  },
 };
 </script>
 
@@ -169,7 +163,6 @@ export default {
       :schema="schema"
       :headers="headers"
       :rows="filteredRows"
-      :get-custom-detail-link="getDetailLocation"
       :loading="loading"
       :use-query-params-for-simple-filtering="useQueryParamsForSimpleFiltering"
       :namespaced="!workspace"

package/components/fleet/FleetClusterTargets/TargetsList.vue

@@ -0,0 +1,66 @@
+<script lang="ts">
+import { PropType } from 'vue';
+import { Cluster } from '@shell/components/fleet/FleetClusterTargets/index.vue';
+
+export default {
+  name: 'FleetTargetsList',
+
+  props: {
+    clusters: {
+      type:    Array as PropType<Cluster[]>,
+      default: () => [],
+    },
+
+    emptyLabel: {
+      type:    String,
+      default: ''
+    }
+  },
+
+  computed: {
+    names() {
+      const names = this.clusters.map(({ nameDisplay, name }) => nameDisplay || name);
+      const max = 10;
+
+      const remaining = names.length - max;
+
+      if (remaining > 0) {
+        return [
+          ...names.filter((_, i) => i < max),
+          this.t('fleet.clusterTargets.rules.matching.plusMore', { n: remaining }, true),
+        ];
+      }
+
+      return names;
+    }
+  }
+};
+</script>
+
+<template>
+  <div class="targets-list">
+    <h3>{{ t('fleet.clusterTargets.rules.matching.title') }}</h3>
+    <span
+      v-for="(name, i) in names"
+      :key="i"
+      class="row mt-5"
+    >
+      {{ name }}
+    </span>
+    <span
+      v-if="!names.length"
+      class="text-label"
+    >
+      {{ emptyLabel || t('fleet.clusterTargets.rules.matching.empty') }}
+    </span>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+  .targets-list {
+    height: 100%;
+    border-radius: 4px;
+    padding: 16px;
+    background-color: var(--tabbed-sidebar-bg);
+  }
+</style>