@rancher/shell 0.5.3 → 1.2.0

package/machine-config/__tests__/vmwarevsphere.test.ts

@@ -4,13 +4,12 @@ import { cleanHtmlDirective } from '@shell/plugins/clean-html-directive';
 
 describe('component: vmwarevsphere', () => {
   const defaultGetters = { 'i18n/t': jest.fn().mockImplementation((key: string) => key) };
-  const defaultSetup = {
+  const poolId = 'poolId';
+  const baseSetup = {
     propsData: {
-      poolId:       'poolId',
+      poolId,
       credentialId: 'credentialId',
       disabled:     false,
-      mode:         'create',
-      value:        { initted: false },
       provider:     'vmwarevsphere'
     },
     mocks: {
@@ -20,54 +19,86 @@ describe('component: vmwarevsphere', () => {
     stubs:      { CodeMirror: true },
     directives: { cleanHtmlDirective }
   };
+  const defaultCreateSetup = {
+    ...baseSetup,
+    propsData: {
+      ...baseSetup.propsData,
+      mode:           'create',
+      poolCreateMode: true,
+      value:          { initted: false },
+    }
+  };
+  const defaultEditSetup = {
+    ...baseSetup,
+    propsData: {
+      ...baseSetup.propsData,
+      mode:           'edit',
+      poolCreateMode: false,
+      value:          { initted: false },
+    }
+  };
+  const editModeWithPoolInCreateModeSetup = {
+    ...defaultEditSetup,
+    propsData: {
+      ...defaultEditSetup.propsData,
+      poolCreateMode: true
+    }
+  };
+
+  describe('default values', () => {
+    const testCases = [
+      defaultCreateSetup,
+      editModeWithPoolInCreateModeSetup
+    ];
+
+    it.each(testCases)('should mount successfully with correct default values', (setup) => {
+      const wrapper = mount(vmwarevsphere, setup);
+
+      const dataCenterElement = wrapper.find(`[data-testid="datacenter"]`).element;
+      const resourcePoolElement = wrapper.find(`[data-testid="resourcePool"]`).element;
+      const dataStoreElement = wrapper.find(`[data-testid="dataStore"]`).element;
+      const folderElement = wrapper.find(`[data-testid="folder"]`).element;
+      const hostElement = wrapper.find(`[data-testid="host"]`).element;
+      const gracefulShutdownTimeoutElement = wrapper.find(`[data-testid="gracefulShutdownTimeout"]`).element;
+
+      expect(dataCenterElement).toBeDefined();
+      expect(resourcePoolElement).toBeDefined();
+      expect(dataStoreElement).toBeDefined();
+      expect(folderElement).toBeDefined();
+      expect(hostElement).toBeDefined();
+      expect(gracefulShutdownTimeoutElement).toBeDefined();
 
-  it('should mount successfully with correct default values', () => {
-    const wrapper = mount(vmwarevsphere, defaultSetup);
-
-    const dataCenterElement = wrapper.find(`[data-testid="datacenter"]`).element;
-    const resourcePoolElement = wrapper.find(`[data-testid="resourcePool"]`).element;
-    const dataStoreElement = wrapper.find(`[data-testid="dataStore"]`).element;
-    const folderElement = wrapper.find(`[data-testid="folder"]`).element;
-    const hostElement = wrapper.find(`[data-testid="host"]`).element;
-    const gracefulShutdownTimeoutElement = wrapper.find(`[data-testid="gracefulShutdownTimeout"]`).element;
-
-    expect(dataCenterElement).toBeDefined();
-    expect(resourcePoolElement).toBeDefined();
-    expect(dataStoreElement).toBeDefined();
-    expect(folderElement).toBeDefined();
-    expect(hostElement).toBeDefined();
-    expect(gracefulShutdownTimeoutElement).toBeDefined();
-
-    const {
-      cpuCount: defaultCpuCount,
-      diskSize: defaultDiskSize,
-      memorySize: defaultMemorySize,
-      hostsystem: defaultHostsystem,
-      cloudConfig: defaultCloudConfig,
-      gracefulShutdownTimeout: defaultGracefulShutdownTimeout,
-      cfgparam: defaultCfgparam,
-      os: defaultOs
-    } = DEFAULT_VALUES;
-
-    const {
-      cpuCount,
-      diskSize,
-      memorySize,
-      hostsystem,
-      cloudConfig,
-      gracefulShutdownTimeout,
-      cfgparam,
-      os
-    } = wrapper.vm.$options.propsData.value;
-
-    expect(cpuCount).toStrictEqual(defaultCpuCount);
-    expect(diskSize).toStrictEqual(defaultDiskSize);
-    expect(memorySize).toStrictEqual(defaultMemorySize);
-    expect(hostsystem).toStrictEqual(defaultHostsystem);
-    expect(cloudConfig).toStrictEqual(defaultCloudConfig);
-    expect(gracefulShutdownTimeout).toStrictEqual(defaultGracefulShutdownTimeout);
-    expect(cfgparam).toStrictEqual(defaultCfgparam);
-    expect(os).toStrictEqual(defaultOs);
+      const {
+        cpuCount: defaultCpuCount,
+        diskSize: defaultDiskSize,
+        memorySize: defaultMemorySize,
+        hostsystem: defaultHostsystem,
+        cloudConfig: defaultCloudConfig,
+        gracefulShutdownTimeout: defaultGracefulShutdownTimeout,
+        cfgparam: defaultCfgparam,
+        os: defaultOs
+      } = DEFAULT_VALUES;
+
+      const {
+        cpuCount,
+        diskSize,
+        memorySize,
+        hostsystem,
+        cloudConfig,
+        gracefulShutdownTimeout,
+        cfgparam,
+        os
+      } = wrapper.vm.$options.propsData.value;
+
+      expect(cpuCount).toStrictEqual(defaultCpuCount);
+      expect(diskSize).toStrictEqual(defaultDiskSize);
+      expect(memorySize).toStrictEqual(defaultMemorySize);
+      expect(hostsystem).toStrictEqual(defaultHostsystem);
+      expect(cloudConfig).toStrictEqual(defaultCloudConfig);
+      expect(gracefulShutdownTimeout).toStrictEqual(defaultGracefulShutdownTimeout);
+      expect(cfgparam).toStrictEqual(defaultCfgparam);
+      expect(os).toStrictEqual(defaultOs);
+    });
   });
 
   describe('mapPathOptionsToContent', () => {
@@ -78,7 +109,7 @@ describe('component: vmwarevsphere', () => {
     ];
 
     it.each(testCases)('should generate label/value object without manipultion', (rawData, expected) => {
-      const wrapper = mount(vmwarevsphere, defaultSetup);
+      const wrapper = mount(vmwarevsphere, defaultCreateSetup);
 
       expect(wrapper.vm.mapPathOptionsToContent(rawData)).toStrictEqual(expected);
     });
@@ -95,7 +126,7 @@ describe('component: vmwarevsphere', () => {
     ];
 
     it.each(testCases)('should generate label/value object for host options properly', (rawData, expected) => {
-      const wrapper = mount(vmwarevsphere, defaultSetup);
+      const wrapper = mount(vmwarevsphere, defaultCreateSetup);
 
       expect(wrapper.vm.mapHostOptionsToContent(rawData)).toStrictEqual(expected);
     });
@@ -114,7 +145,7 @@ describe('component: vmwarevsphere', () => {
     ];
 
     it.each(testCases)('should generate label/value object for folder options properly', (rawData, expected) => {
-      const wrapper = mount(vmwarevsphere, defaultSetup);
+      const wrapper = mount(vmwarevsphere, defaultCreateSetup);
 
       expect(wrapper.vm.mapFolderOptionsToContent(rawData)).toStrictEqual(expected);
     });
@@ -127,7 +158,7 @@ describe('component: vmwarevsphere', () => {
     ];
 
     it.each(testCases)('should generate label/value object for custom attributes options properly', (rawData, expected) => {
-      const wrapper = mount(vmwarevsphere, defaultSetup);
+      const wrapper = mount(vmwarevsphere, defaultCreateSetup);
 
       expect(wrapper.vm.mapCustomAttributesToContent(rawData)).toStrictEqual(expected);
     });
@@ -143,9 +174,83 @@ describe('component: vmwarevsphere', () => {
       const expectedReslut = [{
         ...tag, label: `${ tag.category } / ${ tag.name }`, value: tag.id
       }];
-      const wrapper = mount(vmwarevsphere, defaultSetup);
+      const wrapper = mount(vmwarevsphere, defaultCreateSetup);
 
       expect(wrapper.vm.mapTagsToContent([tag])).toStrictEqual(expectedReslut);
     });
   });
+
+  describe('resetValueIfNecessary', () => {
+    const hostsystemOptions = ['', '/Datacenter/host/Cluster/111.11.11.1'];
+    const folderOptions = ['', '/Datacenter/vm', '/Datacenter/vm/sub-folder'];
+    const contentLibraryOptions = ['', 'some-content-library'];
+    const networkOptions = ['', 'some-network'];
+    const tagOptions = ['', 'some-tag'];
+
+    it('should add errors to validationError collection when values are NOT in the options', () => {
+      const setup = {
+        ...defaultEditSetup,
+        propsData: {
+          ...defaultEditSetup.propsData,
+          value: {
+            ...defaultEditSetup.propsData.value,
+            hostsystem:      'something that is not included in the options',
+            folder:          'same as above',
+            constentLibrary: 'same as above'
+          }
+        }
+      };
+
+      const wrapper = mount(vmwarevsphere, setup);
+
+      const hostsystemContent = wrapper.vm.mapHostOptionsToContent(hostsystemOptions);
+      const folderContent = wrapper.vm.mapHostOptionsToContent(folderOptions);
+      const contentLibraryContent = wrapper.vm.mapPathOptionsToContent(contentLibraryOptions);
+
+      wrapper.vm.resetValueIfNecessary('hostsystem', hostsystemContent, hostsystemOptions);
+      wrapper.vm.resetValueIfNecessary('folder', folderContent, folderOptions);
+      wrapper.vm.resetValueIfNecessary('contentLibrary', contentLibraryContent, contentLibraryOptions);
+
+      expect(wrapper.vm.$data.validationErrors[poolId]).toContain('hostsystem');
+      expect(wrapper.vm.$data.validationErrors[poolId]).toContain('folder');
+      expect(wrapper.vm.$data.validationErrors[poolId]).toContain('contentLibrary');
+    });
+
+    describe('hostsystem, folder, contentLibrary, network and tag', () => {
+      const testCases = [null, ''];
+
+      it.each(testCases)('should NOT be added to validationError collection if they are null or ""', (data) => {
+        const setup = {
+          ...defaultEditSetup,
+          propsData: {
+            ...defaultEditSetup.propsData,
+            value: {
+              ...defaultEditSetup.propsData.value,
+              hostsystem:     data,
+              folder:         data,
+              contentLibrary: data,
+              network:        [data],
+              tag:            [data]
+            }
+          }
+        };
+
+        const wrapper = mount(vmwarevsphere, setup);
+
+        const hostsystemContent = wrapper.vm.mapHostOptionsToContent(hostsystemOptions);
+        const folderContent = wrapper.vm.mapHostOptionsToContent(folderOptions);
+        const contentLibraryContent = wrapper.vm.mapPathOptionsToContent(contentLibraryOptions);
+        const networkContent = wrapper.vm.mapPathOptionsToContent(networkOptions);
+        const tagContent = wrapper.vm.mapPathOptionsToContent(tagOptions);
+
+        wrapper.vm.resetValueIfNecessary('hostsystem', hostsystemContent, hostsystemOptions);
+        wrapper.vm.resetValueIfNecessary('folder', folderContent, folderOptions);
+        wrapper.vm.resetValueIfNecessary('contentLibrary', contentLibraryContent, contentLibraryOptions);
+        wrapper.vm.resetValueIfNecessary('network', networkContent, networkOptions, true);
+        wrapper.vm.resetValueIfNecessary('tag', tagContent, tagOptions, true);
+
+        expect(wrapper.vm.$data.validationErrors[poolId]).toBeUndefined();
+      });
+    });
+  });
 });

package/machine-config/azure.vue

@@ -12,6 +12,8 @@ import { Checkbox } from '@components/Form/Checkbox';
 import ArrayList from '@shell/components/form/ArrayList';
 import { randomStr } from '@shell/utils/string';
 import { addParam, addParams } from '@shell/utils/url';
+import { NORMAN } from '@shell/config/types';
+import { findBy } from '@shell/utils/array';
 import KeyValue from '@shell/components/form/KeyValue';
 import { RadioGroup } from '@components/Form/Radio';
 import { _CREATE, _EDIT } from '@shell/config/query-params';
@@ -92,7 +94,6 @@ const storageTypes = [
     value: 'StandardSSD_LRS'
   }
 ];
-const DEFAULT_REGION = 'westus';
 
 export default {
   components: {
@@ -148,6 +149,12 @@ export default {
       }
       if (!isEmpty(environment)) {
         this.value.environment = environment;
+      } else if (this.loadedCredentialIdFor !== this.credentialId) {
+        this.allCredentials = await this.$store.dispatch('rancher/findAll', { type: NORMAN.CLOUD_CREDENTIAL });
+
+        const currentCredential = this.allCredentials.find((obj) => obj.id === this.credentialId);
+
+        this.value.environment = currentCredential.azurecredentialConfig.environment;
       }
       if (!isEmpty(subscriptionId)) {
         this.value.subscriptionId = subscriptionId;
@@ -156,19 +163,20 @@ export default {
         this.value.tenantId = tenantId;
       }
 
-      this.locationOptions = await this.$store.dispatch('management/request', {
-        url:    addParam('/meta/aksLocations', 'cloudCredentialId', this.credentialId),
-        method: 'GET',
-      });
+      if (this.loadedCredentialIdFor !== this.credentialId) {
+        this.locationOptions = await this.$store.dispatch('management/request', {
+          url:    addParam('/meta/aksLocations', 'cloudCredentialId', this.credentialId),
+          method: 'GET',
+        });
 
-      if (this.mode === _CREATE) {
-        this.value.location = DEFAULT_REGION;
+        this.loadedCredentialIdFor = this.credentialId;
+      }
 
       // when you edit an Azure cluster and add a new machine pool (edit)
       // the location field doesn't come populated which causes the vmSizes request
       // to return 200 but with a null response (also a bunch of other fields are undefined...)
       // so let's prefill them with the defaults
-      } else if (this.mode === _EDIT && !this.value?.location) {
+      if (this.mode === _EDIT && !this.value?.location) {
         for (const key in this.defaultConfig) {
           if (this.value[key] === undefined) {
             this.$set(this.value, key, this.defaultConfig[key]);
@@ -176,6 +184,10 @@ export default {
         }
       }
 
+      if (!this.value.location || !findBy(this.locationOptions, 'name', this.value.location)) {
+        this.locationOptions?.length && this.setLocation(this.locationOptions[this.locationOptions.length - 1]);
+      }
+
       this.vmSizes = await this.$store.dispatch('management/request', {
         url: addParams('/meta/aksVMSizesV2', {
           cloudCredentialId: this.credentialId,
@@ -206,6 +218,8 @@ export default {
       useAvailabilitySet: false,
       vmSizes:            [],
       valueCopy:          this.value,
+
+      loadedCredentialIdFor: null
     };
   },
 
@@ -214,6 +228,10 @@ export default {
       this.$fetch();
     },
 
+    'value.location'() {
+      this.$fetch();
+    },
+
     'value.availabilityZone'(neu) {
       if (neu && (!this.value.managedDisks || !this.value.enablePublicIpStandardSku || !this.value.staticPublicIp)) {
         this.$emit('expandAdvanced');
@@ -499,19 +517,6 @@ export default {
   </div>
   <div v-else>
     <div class="row mt-20">
-      <div class="col span-6">
-        <LabeledSelect
-          v-model="value.environment"
-          :mode="mode"
-          :options="azureEnvironments"
-          option-key="value"
-          option-label="value"
-          :searchable="false"
-          :required="true"
-          :label="t('cluster.machineConfig.azure.environment.label')"
-          :disabled="disabled"
-        />
-      </div>
       <div class="col span-6">
         <LabeledSelect
           :value="value.location"
@@ -526,6 +531,17 @@ export default {
           @input="setLocation"
         />
       </div>
+      <div>
+        <label
+          v-clean-tooltip="t('cluster.machineConfig.azure.environment.tooltip')"
+          :style="{'display':'block'}"
+          class="text-label"
+        >
+          {{ t('cluster.machineConfig.azure.environment.label') }}
+          <i class="icon icon-sm icon-info" />
+        </label>
+        <span>{{ value.environment }}</span>
+      </div>
     </div>
     <div class="row mt-20">
       <div class="col span-4">