@rancher/shell 3.0.2-rc.5 → 3.0.2

package/dialog/GitRepoForceUpdateDialog.vue

@@ -0,0 +1,132 @@
+<script>
+import { mapGetters, mapState } from 'vuex';
+import { resourceNames } from '@shell/utils/string';
+import { exceptionToErrorsArray } from '@shell/utils/error';
+import { Banner } from '@components/Banner';
+import { Card } from '@components/Card';
+import AsyncButton from '@shell/components/AsyncButton';
+
+export default {
+  name: 'GitRepoForceUpdateDialog',
+
+  emits: ['close'],
+
+  components: {
+    AsyncButton,
+    Banner,
+    Card,
+  },
+
+  props: {
+    repositories: {
+      type:     Array,
+      required: true,
+    },
+  },
+
+  data() {
+    return { errors: [] };
+  },
+
+  computed: {
+    ...mapState('action-menu', ['toRemove']),
+    ...mapGetters({ t: 'i18n/t' }),
+
+    names() {
+      return this.repositories.map((repository) => repository.nameDisplay);
+    }
+  },
+
+  methods: {
+    resourceNames,
+
+    close(buttonDone) {
+      if (buttonDone && typeof buttonDone === 'function') {
+        buttonDone(true);
+      }
+      this.$emit('close');
+    },
+
+    async apply(buttonDone) {
+      try {
+        await Promise.all(this.repositories.map((repository) => this.updateGitRepo(repository)));
+
+        this.close();
+      } catch (err) {
+        this.errors = exceptionToErrorsArray(err);
+        buttonDone(false);
+      }
+    },
+
+    updateGitRepo(repository) {
+      const now = repository.spec.forceSyncGeneration || 1;
+
+      repository.spec.forceSyncGeneration = now + 1;
+
+      return repository.save();
+    },
+  }
+};
+</script>
+
+<template>
+  <Card
+    class="prompt-force-update"
+    :show-highlight-border="false"
+  >
+    <template #title>
+      <h4
+        v-clean-html="t('fleet.gitRepo.actions.forceUpdate.promptTitle')"
+        class="text-default-text"
+      />
+    </template>
+
+    <template #body>
+      <div class="mb-20">
+        {{ t('fleet.gitRepo.actions.forceUpdate.promptNames') }} <span
+          v-clean-html="resourceNames(names, t)"
+          class="body"
+        />
+      </div>
+      <Banner
+        color="info"
+        label-key="fleet.gitRepo.actions.forceUpdate.promptWarning"
+      >
+        <span v-clean-html="t('fleet.gitRepo.actions.forceUpdate.promptWarning', { count: names.length}, true)" />
+      </Banner>
+      <Banner
+        v-for="(err, i) in errors"
+        :key="i"
+        color="error"
+        :label="err"
+      />
+    </template>
+
+    <template #actions>
+      <button
+        class="btn role-secondary"
+        @click="close"
+      >
+        {{ t('generic.cancel') }}
+      </button>
+      <div class="spacer" />
+      <AsyncButton
+        mode="update"
+        class="btn bg-info ml-10"
+        :data-testid="'deactivate-driver-confirm'"
+        @click="apply"
+      />
+    </template>
+  </Card>
+</template>
+
+<style lang='scss' scoped>
+  .card-container {
+    box-shadow: none;
+  }
+
+  :deep() .card-actions {
+    display: flex;
+    justify-content: end;
+  }
+</style>

package/directives/strip-html-aria-label.js

@@ -0,0 +1,19 @@
+/**
+ * Vue directive that strips HTML tags from a string and uses the output as an "aria-label" HTML attribute
+ */
+export default {
+  mounted(el, binding) {
+    if (typeof binding.value === 'string') {
+      const htmlStrippedAriaLabelString = binding.value.replace(/<\/?[^>]+(>|$)/g, '');
+
+      el.setAttribute('aria-label', htmlStrippedAriaLabelString);
+    }
+  },
+  updated(el, binding) {
+    if (typeof binding.value === 'string') {
+      const htmlStrippedAriaLabelString = binding.value.replace(/<\/?[^>]+(>|$)/g, '');
+
+      el.setAttribute('aria-label', htmlStrippedAriaLabelString);
+    }
+  }
+};

package/edit/__tests__/cis.cattle.io.clusterscan.test.ts

@@ -0,0 +1,87 @@
+import { mount, type VueWrapper } from '@vue/test-utils';
+import cisEditor from '@shell/edit/cis.cattle.io.clusterscan.vue';
+
+describe('view: cisEditor', () => {
+  let wrapper: VueWrapper<any, any>;
+
+  beforeEach(() => {
+    wrapper = mount(cisEditor, {
+      props: {
+        value: {
+          spec:           { scanProfileName: null, canBeScheduled: () => true },
+          canBeScheduled: () => true,
+        }
+      },
+      global: {
+        mocks: {
+          $fetchState: { pending: false },
+          $route:      {
+            name:  'whatever',
+            query: { AS: 'whatever' },
+          },
+          $store: {
+            getters: {
+              'i18n/t':             (text: string) => text,
+              currentStore:         () => 'whatever',
+              'whatever/schemaFor': jest.fn(),
+            },
+            dispatch: jest.fn(),
+          },
+        },
+        stubs: { AsyncButton: true }
+      }
+    });
+  });
+
+  it('renders the component', () => {
+    expect(wrapper.exists()).toBe(true);
+  });
+
+  describe('should prevent to save', () => {
+    it('given no Profile name', () => {
+      const saveButton = wrapper.find('[data-testid="form-save"]');
+
+      expect(saveButton.attributes().disabled).toStrictEqual('true');
+    });
+
+    it('given a wrong schedule format', async() => {
+      wrapper.vm.value.spec.scanProfileName = 'this is valid';
+      wrapper.vm.value.spec.scheduledScanConfig = { cronSchedule: 'this is not', scanAlertRule: { } };
+      wrapper.vm.isScheduled = true; // Not assigned by fetch()
+      wrapper.vm.scheduledScanConfig = { cronSchedule: 'this is not', scanAlertRule: { } }; // Not assigned by fetch()
+      wrapper.vm.scanAlertRule = {}; // Not assigned by fetch()
+      await wrapper.vm.$nextTick();
+
+      const saveButton = wrapper.find('[data-testid="form-save"]');
+
+      expect(saveButton.attributes().disabled).toStrictEqual('true');
+    });
+  });
+
+  describe('should allow to save', () => {
+    it('given a scanProfileName', async() => {
+      wrapper.vm.value.spec.scanProfileName = 'this is valid';
+      await wrapper.vm.$nextTick();
+
+      const saveButton = wrapper.find('[data-testid="form-save"]');
+
+      expect(saveButton.attributes().disabled).toStrictEqual('false');
+    });
+
+    it.each([
+      '0 * * * *',
+      '@daily'
+    ])('given a scanProfileName and a schedule %p', async(cronSchedule) => {
+      wrapper.vm.value.spec.scanProfileName = 'this is valid';
+      wrapper.vm.value.spec.scheduledScanConfig = { cronSchedule, scanAlertRule: { } };
+      wrapper.vm.scheduledScanConfig = { cronSchedule, scanAlertRule: {} }; // Not assigned by fetch()
+      wrapper.vm.scanAlertRule = {}; // Not assigned by fetch()
+      wrapper.vm.isScheduled = true; // Not assigned by fetch()
+      await wrapper.vm.$nextTick();
+
+      const saveButton = wrapper.find('[data-testid="form-save"]');
+
+      expect(saveButton.attributes().disabled).toStrictEqual('false');
+    });
+  });
+});

package/edit/__tests__/fleet.cattle.io.gitrepo.test.ts

@@ -1,59 +1,104 @@
 import { mount } from '@vue/test-utils';
+import { _CREATE, _EDIT, _VIEW } from '@shell/config/query-params';
 import GitRepo from '@shell/edit/fleet.cattle.io.gitrepo.vue';
 
-describe('view: fleet.cattle.io.gitrepo should', () => {
-  const mockStore = {
-    dispatch: jest.fn(),
-    getters:  {
-      'i18n/t':                  (text: string) => text,
-      t:                         (text: string) => text,
-      currentStore:              () => 'current_store',
-      'current_store/schemaFor': jest.fn(),
-      'current_store/all':       jest.fn(),
-      workspace:                 jest.fn(),
-    }
-  };
-  const mocks = {
-    $store:      mockStore,
-    $fetchState: { pending: false },
-    $route:      {
-      query: { AS: '' },
-      name:  {
-        endsWith: () => {
-          return false;
-        }
+const mockStore = {
+  dispatch: jest.fn(),
+  getters:  {
+    'i18n/t':                  (text: string) => text,
+    'i18n/exists':             jest.fn(),
+    t:                         (text: string) => text,
+    currentStore:              () => 'current_store',
+    'current_store/schemaFor': jest.fn(),
+    'current_store/all':       jest.fn(),
+    workspace:                 jest.fn(),
+  }
+};
+const mocks = {
+  $store:      mockStore,
+  $fetchState: { pending: false },
+  $route:      {
+    query: { AS: '' },
+    name:  {
+      endsWith: () => {
+        return false;
       }
-    },
-  };
-  const values = {
-    metadata: { namespace: 'test' }, spec: { template: {}, correctDrift: { enabled: false } }, targetInfo: { mode: 'all' },
-  };
+    }
+  },
+};
+const mockComputed = {
+  ...GitRepo.computed,
+  steps: () => [{
+    name:           'stepAdvanced',
+    title:          'title',
+    label:          'label',
+    subtext:        'subtext',
+    descriptionKey: 'description',
+    ready:          true,
+    weight:         1,
+  }],
+};
+
+const values = {
+  metadata: { namespace: 'test' },
+  spec:     {
+    template:     {},
+    correctDrift: { enabled: false },
+  },
+  targetInfo: { mode: 'all' },
+};
+
+describe('view: fleet.cattle.io.gitrepo, mode: view - should', () => {
+  it('hide advanced options banner', () => {
+    const wrapper = mount(GitRepo, {
+      props:    { value: values, mode: _VIEW },
+      computed: mockComputed,
+      global:   { mocks }
+    });
+
+    const advancedInfoBanner = wrapper.find('[data-testid="gitrepo-advanced-info"]');
+
+    expect(advancedInfoBanner.exists()).toBeFalsy();
+  });
+});
+
+describe.each([
+  _CREATE,
+  _EDIT,
+])('view: fleet.cattle.io.gitrepo, mode: %p - should', (mode) => {
   const wrapper = mount(GitRepo, {
-    props:  { value: values },
-    global: { mocks }
+    props:    { value: values, mode },
+    computed: mockComputed,
+    global:   { mocks }
+  });
+
+  it('show advanced options banner', () => {
+    const advancedInfoBanner = wrapper.find('[data-testid="gitrepo-advanced-info"]');
+
+    expect(advancedInfoBanner.exists()).toBeTruthy();
   });
 
-  it('should have self-healing checkbox and tooltip', () => {
-    const correctDriftCheckbox = wrapper.find('[data-testid="GitRepo-correctDrift-checkbox"]');
-    const tooltip = wrapper.find('[data-testid="GitRepo-correctDrift-checkbox"]');
+  it('have self-healing checkbox and tooltip', () => {
+    const correctDriftCheckbox = wrapper.find('[data-testid="gitRepo-correctDrift-checkbox"]');
+    const tooltip = wrapper.find('[data-testid="gitRepo-correctDrift-checkbox"]');
 
     expect(tooltip.element.classList).toContain('v-popper--has-tooltip');
     expect(correctDriftCheckbox.exists()).toBeTruthy();
     expect(correctDriftCheckbox.attributes().value).toBeFalsy();
   });
 
-  it('should have keep-resources checkbox and tooltip', () => {
-    const correctDriftCheckbox = wrapper.find('[data-testid="GitRepo-keepResources-checkbox"]');
-    const tooltip = wrapper.find('[data-testid="GitRepo-keepResources-checkbox"]');
+  it('have keep-resources checkbox and tooltip', () => {
+    const correctDriftCheckbox = wrapper.find('[data-testid="gitRepo-keepResources-checkbox"]');
+    const tooltip = wrapper.find('[data-testid="gitRepo-keepResources-checkbox"]');
 
     expect(tooltip.element.classList).toContain('v-popper--has-tooltip');
     expect(correctDriftCheckbox.exists()).toBeTruthy();
     expect(correctDriftCheckbox.attributes().value).toBeFalsy();
   });
 
-  it('should enable drift if self-healing is checked', async() => {
-    const correctDriftCheckbox = wrapper.findComponent('[data-testid="GitRepo-correctDrift-checkbox"]');
-    const correctDriftContainer = wrapper.find('[data-testid="GitRepo-correctDrift-checkbox"] .checkbox-container');
+  it('enable drift if self-healing is checked', async() => {
+    const correctDriftCheckbox = wrapper.findComponent('[data-testid="gitRepo-correctDrift-checkbox"]') as any;
+    const correctDriftContainer = wrapper.find('[data-testid="gitRepo-correctDrift-checkbox"] .checkbox-container');
 
     expect(correctDriftContainer.exists()).toBeTruthy();
 
@@ -63,4 +108,139 @@ describe('view: fleet.cattle.io.gitrepo should', () => {
     expect(correctDriftCheckbox.emitted('update:value')![0][0]).toBe(true);
     expect(correctDriftCheckbox.props().value).toBeTruthy();
   });
+
+  it.each([
+    ['show Polling Interval and warnings', 'enabled', undefined, true],
+    ['show Polling Interval and warnings', 'enabled', false, true],
+    ['hide Polling Interval and warnings', 'disabled', true, false],
+  ])('show Enable Polling checkbox and %p if %p, with spec.disablePolling: %p', (
+    descr1,
+    descr2,
+    disablePolling,
+    enabled
+  ) => {
+    const wrapper = mount(GitRepo, {
+      props: {
+        value: {
+          ...values,
+          spec: {
+            disablePolling,
+            pollingInterval: 10
+          },
+          status: { webhookCommit: 'sha' },
+        },
+        realMode: mode
+      },
+      computed: mockComputed,
+      global:   { mocks },
+    });
+
+    const pollingCheckbox = wrapper.findComponent('[data-testid="gitRepo-enablePolling-checkbox"]') as any;
+    const pollingIntervalInput = wrapper.find('[data-testid="gitRepo-pollingInterval-input"]');
+    const pollingIntervalMinimumValueWarning = wrapper.find('[data-testid="gitRepo-pollingInterval-minimumValueWarning"]');
+    const pollingIntervalWebhookWarning = wrapper.find('[data-testid="gitRepo-pollingInterval-webhookWarning"]');
+
+    expect(pollingIntervalMinimumValueWarning.exists()).toBe(enabled);
+    expect(pollingIntervalWebhookWarning.exists()).toBe(enabled);
+    expect(pollingCheckbox.exists()).toBeTruthy();
+    expect(pollingCheckbox.vm.value).toBe(enabled);
+    expect(pollingIntervalInput.exists()).toBe(enabled);
+  });
+
+  const defaultPollingInterval = mode === _CREATE ? '60' : '15';
+
+  it.each([
+    ['null', `default ${ defaultPollingInterval } seconds`, null, defaultPollingInterval],
+    ['0', `default ${ defaultPollingInterval } seconds`, 0, defaultPollingInterval],
+    ['1', 'custom 1 second', 1, '1'],
+    ['60', 'custom 60 seconds', 60, '60'],
+    ['15', 'custom 15 seconds', 15, '15'],
+    ['0s', `default ${ defaultPollingInterval } seconds`, 0, defaultPollingInterval],
+    ['1s', 'custom 1 second', '1s', '1'],
+    ['60s', 'custom 60 seconds', '1m', '60'],
+    ['1m3s', 'custom 63 seconds', '1m3s', '63'],
+    ['1h2m3s', 'custom 3723 seconds', '1h2m3s', '3723'],
+    ['15', 'custom 15 seconds', '15s', '15'],
+  ])('show Polling Interval input with source: %p, value: %p', async(
+    descr1,
+    descr2,
+    pollingInterval,
+    unitValue,
+  ) => {
+    const wrapper = mount(GitRepo, {
+      props: {
+        value: {
+          ...values,
+          spec: { pollingInterval }
+        },
+        realMode: mode
+      },
+      computed: mockComputed,
+      global:   { mocks },
+    });
+
+    const pollingIntervalInput = wrapper.find('[data-testid="gitRepo-pollingInterval-input"]').element as any;
+
+    expect(pollingIntervalInput).toBeDefined();
+    expect(pollingIntervalInput.value).toBe(unitValue);
+  });
+
+  it.each([
+    ['hide', 'source: null, value: equal to 60', null, false],
+    ['hide', 'source: 0, value: equal to 60', 0, false],
+    ['hide', 'source: 15, value: equal to 15', 15, false],
+    ['hide', 'source: 60, value: equal to 60', 60, false],
+    ['hide', 'source: 16, value: higher than 15', 16, false],
+    ['show', 'source: 1, value: lower than 15', 1, true],
+  ])('%p Polling Interval warning if %p', async(
+    descr1,
+    descr2,
+    pollingInterval,
+    visible,
+  ) => {
+    const wrapper = mount(GitRepo, {
+      props: {
+        value: {
+          ...values,
+          spec: { pollingInterval }
+        },
+        realMode: mode
+      },
+      computed: mockComputed,
+      global:   { mocks },
+    });
+
+    const pollingIntervalMinimumValueWarning = wrapper.find('[data-testid="gitRepo-pollingInterval-minimumValueWarning"]');
+
+    expect(pollingIntervalMinimumValueWarning.exists()).toBe(visible);
+  });
+
+  it.each([
+    ['hide', 'disabled', null, false],
+    ['hide', 'disabled', false, false],
+    ['hide', 'disabled', '', false],
+    ['show', 'enabled', 'sha', true],
+  ])('%p Webhook configured warning if webhook is %p', (
+    descr1,
+    descr2,
+    webhookCommit,
+    visible
+  ) => {
+    const wrapper = mount(GitRepo, {
+      props: {
+        value: {
+          ...values,
+          spec:   { pollingInterval: 60 },
+          status: { webhookCommit },
+        },
+        realMode: mode
+      },
+      computed: mockComputed,
+      global:   { mocks },
+    });
+
+    const pollingIntervalWebhookWarning = wrapper.find('[data-testid="gitRepo-pollingInterval-webhookWarning"]');
+
+    expect(pollingIntervalWebhookWarning.exists()).toBe(visible);
+  });
 });

package/edit/auth/__tests__/oidc.test.ts

@@ -1,6 +1,6 @@
 import { nextTick } from 'vue';
 /* eslint-disable jest/no-hooks */
-import { mount } from '@vue/test-utils';
+import { mount, type VueWrapper } from '@vue/test-utils';
 import { _EDIT } from '@shell/config/query-params';
 
 import oidc from '@shell/edit/auth/oidc.vue';
@@ -19,19 +19,20 @@ const validAuthEndpoint = 'http://localhost:8080/realms/rancherrealm/protocol/op
 const validScope = 'openid profile email';
 
 const mockModel = {
-  enabled:      false,
-  id:           'genericoidc',
-  rancherUrl:   validRancherUrl,
-  issuer:       validIssuer,
-  authEndpoint: validAuthEndpoint,
-  scope:        validScope,
-  clientId:     validClientId,
-  clientSecret: validClientSecret,
-  type:         'genericOIDCConfig',
+  enabled:            false,
+  id:                 'genericoidc',
+  rancherUrl:         validRancherUrl,
+  issuer:             validIssuer,
+  authEndpoint:       validAuthEndpoint,
+  scope:              validScope,
+  clientId:           validClientId,
+  clientSecret:       validClientSecret,
+  type:               'genericOIDCConfig',
+  groupSearchEnabled: false,
 };
 
 describe('oidc.vue', () => {
-  let wrapper: any;
+  let wrapper: VueWrapper<any, any>;
   const requiredSetup = () => ({
     data() {
       return {
@@ -43,7 +44,7 @@ describe('oidc.vue', () => {
         originalModel:  null,
         principals:     [],
         authConfigName: 'oidc',
-      };
+      } as any; // any is necessary as in pre-existing tests we are including inherited mixins values
     },
     global: {
       mocks: {
@@ -131,4 +132,51 @@ describe('oidc.vue', () => {
 
     expect(wrapper.vm.model.issuer).toBe(`${ validUrl }/realms/${ validRealm }`);
   });
+
+  it('`groupSearchEnabled` defaults to false', async() => {
+    const groupSearchCheckbox = wrapper.getComponent('[data-testid="input-group-search"]');
+
+    expect(groupSearchCheckbox.isVisible()).toBe(true);
+    expect(wrapper.vm.model.groupSearchEnabled).toBe(false);
+  });
+
+  it('`groupSearchEnabled` updates when checkbox is clicked', async() => {
+    const groupSearchCheckbox = wrapper.getComponent('[data-testid="input-group-search"]');
+
+    await groupSearchCheckbox.find('[role="checkbox"]').trigger('click');
+
+    expect(groupSearchCheckbox.isVisible()).toBe(true);
+    expect(wrapper.vm.model.groupSearchEnabled).toBe(true);
+  });
+
+  it('changing URL should update issuer and auth-endpoint if Keycloak', async() => {
+    wrapper.vm.model.id = 'keycloakoidc';
+    const newUrl = 'whatever';
+
+    await wrapper.find(`[data-testid="oidc-url"]`).setValue(newUrl);
+    await wrapper.vm.$nextTick();
+
+    const issuer = (wrapper.find('[data-testid="oidc-issuer"]').element as HTMLInputElement).value;
+    const endpoint = (wrapper.find('[data-testid="oidc-auth-endpoint"]').element as HTMLInputElement).value;
+
+    expect(issuer).toBe(`${ newUrl }/realms/`);
+    expect(endpoint).toBe(`${ newUrl }/realms//protocol/openid-connect/auth`);
+  });
+
+  it('changing realm should update issuer and auth-endpoint if Keycloak', async() => {
+    const newRealm = 'newRealm';
+    const oldUrl = 'oldUrl';
+
+    wrapper.vm.model.id = 'keycloakoidc';
+    wrapper.vm.oidcUrls.url = oldUrl;
+
+    await wrapper.find(`[data-testid="oidc-realm"]`).setValue(newRealm);
+    await wrapper.vm.$nextTick();
+
+    const issuer = (wrapper.find('[data-testid="oidc-issuer"]').element as HTMLInputElement).value;
+    const endpoint = (wrapper.find('[data-testid="oidc-auth-endpoint"]').element as HTMLInputElement).value;
+
+    expect(issuer).toBe(`${ oldUrl }/realms/${ newRealm }`);
+    expect(endpoint).toBe(`${ oldUrl }/realms/${ newRealm }/protocol/openid-connect/auth`);
+  });
 });

package/edit/auth/ldap/__tests__/config.test.ts

@@ -15,4 +15,44 @@ describe('lDAP config', () => {
 
     expect(checkbox).toBeDefined();
   });
+
+  it('updates user login filter when value is entered', async() => {
+    const wrapper = mount(
+      LDAPConfig,
+      {
+        props: {
+          value: {},
+          type:  'openldap',
+        }
+      });
+
+    const userLoginFilter = wrapper.find('[data-testid="user-login-filter"]');
+
+    await userLoginFilter.setValue('Test Filter');
+
+    const expectedValue = 'Test Filter';
+
+    expect(userLoginFilter.exists()).toBe(true);
+    expect(userLoginFilter.element.value).toBe(expectedValue);
+    expect(wrapper.vm.model.userLoginFilter).toBe(expectedValue);
+  });
+
+  it('defaults to undefined for user login filter', () => {
+    const wrapper = mount(
+      LDAPConfig,
+      {
+        props: {
+          value: {},
+          type:  'openldap',
+        }
+      });
+
+    const userLoginFilter = wrapper.find('[data-testid="user-login-filter"]');
+
+    const expectedValue = '';
+
+    expect(userLoginFilter.exists()).toBe(true);
+    expect(userLoginFilter.element.value).toBe(expectedValue);
+    expect(wrapper.vm.model.userLoginFilter).toBeUndefined();
+  });
 });