@rancher/shell 3.0.9-rc.5 → 3.0.9

package/edit/provisioning.cattle.io.cluster/__tests__/rke2-fleet-cluster-agent.test.ts

@@ -0,0 +1,283 @@
+import { shallowMount } from '@vue/test-utils';
+import { nextTick } from 'vue';
+import RKE2 from '@shell/edit/provisioning.cattle.io.cluster/rke2.vue';
+import { AGENT_CONFIGURATION_TYPES } from '@shell/config/settings';
+
+jest.mock('@shell/edit/provisioning.cattle.io.cluster/shared', () => ({
+  RETENTION_DEFAULT:         5,
+  RKE2_INGRESS_NGINX:        'rke2-ingress-nginx',
+  RKE2_TRAEFIK:              'rke2-traefik',
+  INGRESS_NGINX:             'ingress-nginx',
+  INGRESS_CONTROLLER:        'ingress-controller',
+  TRAEFIK:                   'traefik',
+  HARVESTER:                 'harvester',
+  INGRESS_DUAL:              'dual',
+  INGRESS_NONE:              'none',
+  INGRESS_OPTIONS:           [],
+  INGRESS_MIGRATION_KB_LINK: 'mock-link'
+}));
+const mockStore = {
+  getters: {
+    'management/schemaFor':            jest.fn().mockReturnValue(null),
+    'management/byId':                 jest.fn().mockReturnValue({}),
+    'management/canList':              jest.fn().mockReturnValue(true),
+    'management/all':                  jest.fn().mockReturnValue([]),
+    'rancher/all':                     jest.fn().mockReturnValue([]),
+    'rancher/byId':                    jest.fn().mockReturnValue({}),
+    'i18n/t':                          jest.fn().mockImplementation((key) => key),
+    'i18n/withFallback':               jest.fn().mockImplementation((key) => key),
+    'features/get':                    jest.fn().mockReturnValue(() => true),
+    'plugins/cloudProviderForDriver':  jest.fn().mockReturnValue(undefined),
+    currentCluster:                    {},
+    'customisation/getPreviewCluster': {
+      badge: {
+        iconText: '', color: '', text: ''
+      }
+    },
+    productId:    'rancher',
+    currentStore: jest.fn().mockReturnValue('management')
+  },
+  dispatch: jest.fn().mockResolvedValue({ data: [] })
+};
+
+const mockRoute = {
+  query: {},
+  name:  'test'
+};
+
+const mockValue = {
+  metadata: {
+    name:        'test-cluster',
+    annotations: {}
+  },
+  spec: {
+    kubernetesVersion: 'v1.25.0+rke2r1',
+    rkeConfig:         {
+      machineGlobalConfig:   {},
+      networking:            { stackPreference: 'ipv4' },
+      machineSelectorConfig: [{ config: {} }],
+      dataDirectories:       {}
+    },
+    clusterAgentDeploymentCustomization: {},
+    fleetAgentDeploymentCustomization:   {}
+  },
+  agentConfig: {}
+};
+
+const createWrapper = (propsData: any = {}) => {
+  return shallowMount(RKE2, {
+    propsData: {
+      mode:     'create',
+      value:    { ...mockValue, ...propsData.value },
+      provider: 'custom',
+      ...propsData
+    },
+    global: {
+      mocks: {
+        $store:      mockStore,
+        $route:      mockRoute,
+        $router:     { replace: jest.fn() },
+        t:           jest.fn().mockImplementation((key) => key),
+        $extension:  { getDynamic: jest.fn().mockReturnValue(undefined) },
+        $fetchState: { pending: false, error: null }
+      }
+    },
+    data() {
+      return {
+        loadedOnce:   true,
+        rke2Versions: null,
+        k3sVersions:  null,
+        defaultRke2:  'v1.25.0+rke2r1',
+        defaultK3s:   'v1.25.0+k3s1'
+      } as any;
+    }
+  });
+};
+
+describe('component: RKE2 - Fleet Agent Configuration', () => {
+  let wrapper: any;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    wrapper = createWrapper();
+  });
+
+  afterEach(() => {
+    if (wrapper) {
+      wrapper.unmount();
+    }
+  });
+
+  describe('fleet Agent Scheduling Customization', () => {
+    beforeEach(async() => {
+      // Initialize the component with fleet agent defaults
+      wrapper.vm.fleetAgentDefaultPC = { value: 100, preemptionPolicy: 'PreemptLowerPriority' };
+      wrapper.vm.fleetAgentDefaultPDB = { maxUnavailable: 1 };
+      wrapper.vm.schedulingCustomizationFeatureEnabled = true;
+      await nextTick();
+    });
+
+    it('should enable Fleet Agent scheduling customization when event is true', async() => {
+      const event = { event: true, agentType: AGENT_CONFIGURATION_TYPES.FLEET };
+
+      wrapper.vm.setSchedulingCustomization(event);
+
+      expect(wrapper.vm.value.spec.fleetAgentDeploymentCustomization.schedulingCustomization).toStrictEqual({
+        priorityClass:       wrapper.vm.fleetAgentDefaultPC,
+        podDisruptionBudget: wrapper.vm.fleetAgentDefaultPDB
+      });
+    });
+
+    it('should disable Fleet Agent scheduling customization when event is false', async() => {
+      // First enable it
+      const enableEvent = { event: true, agentType: AGENT_CONFIGURATION_TYPES.FLEET };
+
+      wrapper.vm.setSchedulingCustomization(enableEvent);
+
+      // Then disable it
+      const disableEvent = { event: false, agentType: AGENT_CONFIGURATION_TYPES.FLEET };
+
+      wrapper.vm.setSchedulingCustomization(disableEvent);
+
+      expect(wrapper.vm.value.spec.fleetAgentDeploymentCustomization.schedulingCustomization).toBeUndefined();
+    });
+
+    it('should enable Cluster Agent scheduling customization when event is true', async() => {
+      // Initialize cluster agent defaults
+      wrapper.vm.clusterAgentDefaultPC = { value: 200, preemptionPolicy: 'PreemptLowerPriority' };
+      wrapper.vm.clusterAgentDefaultPDB = { maxUnavailable: 2 };
+
+      const event = { event: true, agentType: AGENT_CONFIGURATION_TYPES.CLUSTER };
+
+      wrapper.vm.setSchedulingCustomization(event);
+
+      expect(wrapper.vm.value.spec.clusterAgentDeploymentCustomization.schedulingCustomization).toStrictEqual({
+        priorityClass:       wrapper.vm.clusterAgentDefaultPC,
+        podDisruptionBudget: wrapper.vm.clusterAgentDefaultPDB
+      });
+    });
+
+    it('should disable Cluster Agent scheduling customization when event is false', async() => {
+      // Initialize cluster agent defaults
+      wrapper.vm.clusterAgentDefaultPC = { value: 200, preemptionPolicy: 'PreemptLowerPriority' };
+      wrapper.vm.clusterAgentDefaultPDB = { maxUnavailable: 2 };
+
+      // First enable it
+      const enableEvent = { event: true, agentType: AGENT_CONFIGURATION_TYPES.CLUSTER };
+
+      wrapper.vm.setSchedulingCustomization(enableEvent);
+
+      // Then disable it
+      const disableEvent = { event: false, agentType: AGENT_CONFIGURATION_TYPES.CLUSTER };
+
+      wrapper.vm.setSchedulingCustomization(disableEvent);
+
+      expect(wrapper.vm.value.spec.clusterAgentDeploymentCustomization.schedulingCustomization).toBeUndefined();
+    });
+
+    it('should handle unknown agent types gracefully', async() => {
+      const event = { event: true, agentType: 'unknown' };
+
+      // Should not throw an error
+      expect(() => wrapper.vm.setSchedulingCustomization(event)).not.toThrow();
+
+      // Should not modify any agent configuration
+      expect(wrapper.vm.value.spec.clusterAgentDeploymentCustomization.schedulingCustomization).toBeUndefined();
+      expect(wrapper.vm.value.spec.fleetAgentDeploymentCustomization.schedulingCustomization).toBeUndefined();
+    });
+
+    it('should pass the correct agent type to SchedulingCustomization components', async() => {
+      await wrapper.vm.$nextTick();
+
+      // Check if AGENT_CONFIGURATION_TYPES is available in the component data
+      expect(wrapper.vm.AGENT_CONFIGURATION_TYPES).toBeDefined();
+      expect(wrapper.vm.AGENT_CONFIGURATION_TYPES.CLUSTER).toBe('cluster');
+      expect(wrapper.vm.AGENT_CONFIGURATION_TYPES.FLEET).toBe('fleet');
+    });
+  });
+
+  describe('fleet Agent Configuration Data Initialization', () => {
+    it('should initialize fleet agent default configuration properties', () => {
+      expect(wrapper.vm.fleetAgentDefaultPC).toBeDefined();
+      expect(wrapper.vm.fleetAgentDefaultPDB).toBeDefined();
+      expect(wrapper.vm.AGENT_CONFIGURATION_TYPES).toBeDefined();
+    });
+
+    it('should have AGENT_CONFIGURATION_TYPES with correct values', () => {
+      expect(wrapper.vm.AGENT_CONFIGURATION_TYPES).toStrictEqual({
+        CLUSTER: 'cluster',
+        FLEET:   'fleet'
+      });
+    });
+  });
+
+  describe('fleet Agent Configuration Template', () => {
+    it('should render AgentConfiguration for fleet agent with correct props', async() => {
+      // Set up fleet agent configuration to ensure it renders
+      wrapper.vm.value.spec.fleetAgentDeploymentCustomization = {};
+      wrapper.vm.schedulingCustomizationFeatureEnabled = true;
+      wrapper.vm.fleetAgentDefaultPC = { value: 100 };
+      wrapper.vm.fleetAgentDefaultPDB = { maxUnavailable: 1 };
+      await nextTick();
+
+      // Force re-render
+      await wrapper.vm.$forceUpdate();
+      await nextTick();
+
+      // The template should contain fleet agent configuration
+      // This tests the template structure even if the component isn't fully mounted
+      expect(wrapper.vm.value.spec.fleetAgentDeploymentCustomization).toBeDefined();
+    });
+  });
+
+  describe('flannel Masquerade Configuration', () => {
+    let k3sWrapper: any;
+
+    beforeEach(() => {
+      const k3sValue = {
+        ...mockValue,
+        spec: {
+          ...mockValue.spec,
+          rkeConfig: {
+            ...mockValue.spec.rkeConfig,
+            machineGlobalConfig: { 'flannel-backend': 'vxlan' } // flannel enabled
+          }
+        }
+      };
+
+      k3sWrapper = createWrapper({ value: k3sValue });
+    });
+
+    afterEach(() => {
+      if (k3sWrapper) {
+        k3sWrapper.unmount();
+      }
+    });
+
+    it('should handle flannel masquerade configuration change', async() => {
+      k3sWrapper.vm.handleFlannelMasqChanged(true);
+
+      expect(k3sWrapper.vm.serverConfig['flannel-ipv6-masq']).toBe(true);
+    });
+
+    it('should remove flannel masquerade configuration when set to false', async() => {
+      // First set it to true
+      k3sWrapper.vm.handleFlannelMasqChanged(true);
+      expect(k3sWrapper.vm.serverConfig['flannel-ipv6-masq']).toBe(true);
+
+      // Then set it to false
+      k3sWrapper.vm.handleFlannelMasqChanged(false);
+      expect(k3sWrapper.vm.serverConfig['flannel-ipv6-masq']).toBe(false);
+    });
+
+    it('should remove flannel masquerade configuration when set to null/undefined', async() => {
+      // First set it to true
+      k3sWrapper.vm.handleFlannelMasqChanged(true);
+      expect(k3sWrapper.vm.serverConfig['flannel-ipv6-masq']).toBe(true);
+
+      // Then set it to null
+      k3sWrapper.vm.handleFlannelMasqChanged(null);
+      expect(k3sWrapper.vm.serverConfig['flannel-ipv6-masq']).toBeUndefined();
+    });
+  });
+});

package/edit/provisioning.cattle.io.cluster/__tests__/rke2.test.ts

@@ -1,10 +1,26 @@
 import { mount, shallowMount } from '@vue/test-utils';
 import { SECRET } from '@shell/config/types';
-import { _CREATE } from '@shell/config/query-params';
+import { _CREATE, _EDIT } from '@shell/config/query-params';
 import rke2 from '@shell/edit/provisioning.cattle.io.cluster/rke2.vue';
 import { get } from '@shell/utils/object';
 import { rke2TestTable } from './utils/rke2-test-data';
-import { NGINX_SUPPORTED, INGRESS_CONTROLLER, INGRESS_NGINX } from '@shell/edit/provisioning.cattle.io.cluster/shared';
+import {
+  RKE2_INGRESS_NGINX, INGRESS_CONTROLLER, INGRESS_NGINX, TRAEFIK, INGRESS_NONE, RKE2_TRAEFIK
+} from '@shell/edit/provisioning.cattle.io.cluster/shared';
+
+jest.mock('@shell/edit/provisioning.cattle.io.cluster/shared', () => ({
+  RETENTION_DEFAULT:         5,
+  RKE2_INGRESS_NGINX:        'rke2-ingress-nginx',
+  RKE2_TRAEFIK:              'rke2-traefik',
+  INGRESS_NGINX:             'ingress-nginx',
+  INGRESS_CONTROLLER:        'ingress-controller',
+  TRAEFIK:                   'traefik',
+  HARVESTER:                 'harvester',
+  INGRESS_DUAL:              'dual',
+  INGRESS_NONE:              'none',
+  INGRESS_OPTIONS:           [],
+  INGRESS_MIGRATION_KB_LINK: 'mock-link'
+}));
 
 /**
  * DISCLAIMER ***************************************************************************************
@@ -453,7 +469,11 @@ describe('component: rke2', () => {
       rke2Versions: [{
         id:         k8s,
         version:    k8s,
-        serverArgs: true
+        serverArgs: true,
+        charts:     {
+          [RKE2_INGRESS_NGINX]: {},
+          [RKE2_TRAEFIK]:       {}
+        }
       }]
     });
 
@@ -593,6 +613,7 @@ describe('component: rke2', () => {
                 repo:    'rancher-rke2-charts',
                 version: '3.12.200'
               },
+              'rke2-traefik': {}
             }
           }
         ]
@@ -616,10 +637,10 @@ describe('component: rke2', () => {
 
   describe('should correctly update NGINX configuration', () => {
     const k8sVersion = 'v1.25.0+rke2r1';
-    const createWrapper = () => {
+    const createWrapper = (mode = _EDIT) => {
       return shallowMount(rke2, {
         props: {
-          mode:  _CREATE,
+          mode,
           value: {
             spec: {
               ...defaultSpec,
@@ -646,33 +667,47 @@ describe('component: rke2', () => {
         },
       });
     };
+    const mockCharts = {
+      [RKE2_INGRESS_NGINX]: {},
+      [RKE2_TRAEFIK]:       {}
+    };
 
-    it('should set ingress-controller to ingress-nginx by default when nginx is supported and not disabled', async() => {
-      const wrapper = createWrapper();
+    it('should set ingress-controller to traefik by default for new clusters', async() => {
+      const wrapper = createWrapper(_CREATE);
 
       await wrapper.setData({
         rke2Versions: [{
           id:         k8sVersion,
           version:    k8sVersion,
-          serverArgs: { disable: { options: [NGINX_SUPPORTED] } }
+          serverArgs: { disable: { options: [RKE2_INGRESS_NGINX] } },
+          charts:     mockCharts
         }]
       });
 
-      expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBe(INGRESS_NGINX);
+      expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBe(TRAEFIK);
     });
 
-    it('should set ingress-controller to undefined by default when nginx is not supported', async() => {
+    it('should set ingress-controller to None on version change when nginx is not supported', async() => {
       const wrapper = createWrapper();
+      const newVersion = 'v1.26.0+rke2r1';
 
       await wrapper.setData({
         rke2Versions: [{
           id:         k8sVersion,
           version:    k8sVersion,
-          serverArgs: { disable: { options: [] } }
+          serverArgs: { disable: { options: [] } },
+          charts:     mockCharts
+        },
+        {
+          id:         newVersion,
+          version:    newVersion,
+          serverArgs: { disable: { options: [] } },
+          charts:     mockCharts
         }]
       });
-
-      expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBeUndefined();
+      wrapper.vm.value.spec.kubernetesVersion = newVersion;
+      (wrapper.vm as any).handleKubernetesChange(newVersion);
+      expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBe(INGRESS_NONE);
     });
 
     it('should set ingress-controller to ingress-nginx on change when nginx is supported and not disabled', () => {
@@ -682,7 +717,8 @@ describe('component: rke2', () => {
         rke2Versions: [{
           id:         k8sVersion,
           version:    k8sVersion,
-          serverArgs: { disable: { options: [NGINX_SUPPORTED] } }
+          serverArgs: { disable: { options: [RKE2_INGRESS_NGINX] } },
+          charts:     mockCharts
         }]
       });
 
@@ -691,36 +727,38 @@ describe('component: rke2', () => {
       expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBe(INGRESS_NGINX);
     });
 
-    it('should set ingress-controller to undefined when nginx is supported but disabled', () => {
+    it('should set ingress-controller to None when nginx is supported but disabled', () => {
       const wrapper = createWrapper();
 
       wrapper.setData({
         rke2Versions: [{
           id:         k8sVersion,
           version:    k8sVersion,
-          serverArgs: { disable: { options: [NGINX_SUPPORTED] } }
+          serverArgs: { disable: { options: [RKE2_INGRESS_NGINX] } },
+          charts:     mockCharts
         }]
       });
 
-      (wrapper.vm as any).handleEnabledSystemServicesChanged([NGINX_SUPPORTED]);
+      (wrapper.vm as any).handleEnabledSystemServicesChanged([RKE2_INGRESS_NGINX]);
 
-      expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBeUndefined();
+      expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBe(INGRESS_NONE);
     });
 
-    it('should set ingress-controller to undefined when nginx is not supported', () => {
+    it('should set ingress-controller for existing cluster to None when nginx is not supported', () => {
       const wrapper = createWrapper();
 
       wrapper.setData({
         rke2Versions: [{
           id:         k8sVersion,
           version:    k8sVersion,
-          serverArgs: { disable: { options: [] } }
+          serverArgs: { disable: { options: [] } },
+          charts:     mockCharts
         }]
       });
 
       (wrapper.vm as any).handleEnabledSystemServicesChanged([]);
 
-      expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBeUndefined();
+      expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBe(INGRESS_NONE);
     });
 
     it('should correctly update disable list in serverConfig', () => {
@@ -730,7 +768,8 @@ describe('component: rke2', () => {
         rke2Versions: [{
           id:         k8sVersion,
           version:    k8sVersion,
-          serverArgs: { disable: { options: [NGINX_SUPPORTED] } }
+          serverArgs: { disable: { options: [RKE2_INGRESS_NGINX] } },
+          charts:     mockCharts
         }]
       });
       const disabledServices = ['other-service'];
@@ -749,12 +788,14 @@ describe('component: rke2', () => {
           {
             id:         k8sVersion,
             version:    k8sVersion,
-            serverArgs: { disable: { options: [NGINX_SUPPORTED] } }
+            serverArgs: { disable: { options: [RKE2_INGRESS_NGINX] } },
+            charts:     mockCharts
           },
           {
             id:         newVersion,
             version:    newVersion,
-            serverArgs: { disable: { options: [NGINX_SUPPORTED] } }
+            serverArgs: { disable: { options: [RKE2_INGRESS_NGINX] } },
+            charts:     mockCharts
           }
         ]
       });
@@ -764,30 +805,5 @@ describe('component: rke2', () => {
 
       expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBe(INGRESS_NGINX);
     });
-
-    it('should not set ingress-controller to ingress-nginx on version change when nginx is not supported', async() => {
-      const wrapper = createWrapper();
-      const newVersion = 'v1.26.0+rke2r1';
-
-      await wrapper.setData({
-        k3sVersions: [
-          {
-            id:         k8sVersion,
-            version:    k8sVersion,
-            serverArgs: { disable: { options: [] } }
-          },
-          {
-            id:         newVersion,
-            version:    newVersion,
-            serverArgs: { disable: { options: [] } }
-          }
-        ]
-      });
-
-      wrapper.vm.value.spec.kubernetesVersion = newVersion;
-      (wrapper.vm as any).handleKubernetesChange(newVersion);
-
-      expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBeUndefined();
-    });
   });
 });

package/edit/provisioning.cattle.io.cluster/ingress/IngressCards.vue

@@ -0,0 +1,114 @@
+<script setup lang="ts">
+import { _CREATE, _VIEW } from '@shell/config/query-params';
+import { PropType } from 'vue';
+import { useStore } from 'vuex';
+import { useI18n } from '@shell/composables/useI18n';
+import { RcItemCard, RcItemCardAction } from '@components/RcItemCard';
+
+interface IngressCard {
+  id: string;
+  image?: any;
+  header: { title: { key: string } };
+  subHeader: { label: { key: string } };
+  content: { key: string };
+  doc?: {url: string};
+  selected?: boolean;
+}
+
+defineProps({
+  options: {
+    type:     Array as PropType<IngressCard[]>,
+    required: true
+  },
+  mode: { type: String, default: _CREATE },
+});
+
+const emit = defineEmits(['select']);
+
+const store = useStore();
+const { t } = useI18n(store);
+
+</script>
+
+<template>
+  <div class="ingress-cards">
+    <rc-item-card
+      v-for="card in options"
+      :id="card.id"
+      :key="card.id"
+      :header="card.header"
+      :image="card.image"
+      :content="card.content"
+      :selected="card.selected"
+      variant="small"
+      role="link"
+      :disabled="mode === _VIEW"
+      :class="{ 'single-card': options.length === 1 }"
+      :clickable="mode !== _VIEW"
+      @card-click="emit('select', card.id)"
+    >
+      <template
+        v-once
+        #item-card-sub-header
+      >
+        <p class="ingress-card-sub-header">
+          {{ t(card.subHeader.label.key) }}
+        </p>
+      </template>
+      <template
+        v-if="!!card.doc"
+        v-once
+        #item-card-footer
+      >
+        <div class="mmt-2">
+          <rc-item-card-action>
+            <a
+              :href="card.doc.url"
+              rel="nofollow noopener noreferrer"
+              target="_blank"
+              class="ingress-card-footer-button secondary-text-link"
+            >
+              {{ t('cluster.ingress.learnMore.label') }}
+              <i class="icon icon-external-link" />
+              <span class="sr-only">{{ t('generic.opensInNewTab') }}</span>
+            </a>
+          </rc-item-card-action>
+        </div>
+      </template>
+    </rc-item-card>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.ingress-cards{
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  grid-gap: var(--gap-md);
+  width: 100%;
+  height: max-content;
+  overflow: hidden;
+
+  .single-card {
+    max-width: 500px;
+  }
+}
+.ingress-card-sub-header {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--gap) var(--gap-md);
+  color: var(--link-text-secondary);
+  margin-bottom: 8px;
+}
+
+button.variant-ghost.ingress-card-footer-button {
+  padding: 0;
+  gap: 0;
+  min-height: 20px;
+
+  &:focus-visible {
+    border-color: var(--primary);
+    @include focus-outline;
+    outline-offset: -2px;
+  }
+}
+</style>